前文链接:QGraphicsView实现简易地图17『涟漪效果』
模仿echarts的散点图效果
在前一篇的基础上增加了文本,支持设置散点大小、颜色、涟漪线条宽度。
动态演示效果
静态展示图片
核心代码
void EffectScatterItem::paint(QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget)
{
painter->setPen(Qt::NoPen);
painter->setBrush(m_color);
painter->setRenderHint(QPainter::Antialiasing);
painter->drawEllipse(QPointF(0, 0), m_radius * 0.4, m_radius * 0.4);
painter->setBrush(Qt::NoBrush);
for (int i = 1; i <= 3; ++i)
{
QColor color = m_color;
color.setAlphaF((4 - i - m_percent) / 3);
painter->setPen(QPen(color, m_ripplesWidth));
double radius = m_radius * (0.4 + (i - 1 + m_percent) * 0.2);
painter->drawEllipse(QPointF(0, 0), radius, radius);
}
if (!m_text.isEmpty())
{
QFont font = painter->font();
font.setPixelSize(m_radius * 0.4);
QFontMetrics fontMetrics(font);
int textW = fontMetrics.width(m_text);
painter->setFont(font);
painter->setPen(QPen(m_color, m_ripplesWidth));
painter->drawText(m_radius * 0.6, -m_radius, textW, 2 * m_radius, Qt::AlignCenter, m_text);
}
}