QPaint练习000（绘制实时显示数字&一个圆圈）

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QPainter>
#include <QString>
#include <QTimer>

QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();

    //动态增加时速画面效果
    void slot_speed_changed();
    //中间小圆
    void DrawCircle_bom_small(QPainter& painter,int radius);
    void DrawCircle_bom_small(QPainter& painter,  QPoint & center, int radius);
    //绘制实时数字
    void DrawDbNum(QPainter& painter, QPoint & point);
    // 绘制一条中间略粗两边略尖的渐变发光线条
    void DrawDbLightLine(QPainter& painter, QPoint & point);

protected:
    void paintEvent(QPaintEvent*);

private:
    Ui::Widget *ui;
    QTimer timer;   //定时器
    int m_degRotate = 0;
};
#endif // WIDGET_H

 

#include "widget.h"
#include "ui_widget.h"
#include <QDebug>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    connect(&timer, &QTimer::timeout, [=]()
    {
        //动态增加时速画面效果
        slot_speed_changed();
    });
    timer.start(100);
}

Widget::~Widget()
{
    delete ui;
    timer.stop();
}

//动态增加时速画面效果
void Widget::slot_speed_changed()
{
    m_degRotate++;
    if(m_degRotate > 250) {
          m_degRotate = 0;
    }
    update();//刷新很重要！
}

//绘制实时数字
void Widget::DrawDbNum(QPainter& painter, QPoint & point)
{
    painter.save();
    painter.setPen(QColor(255,0,0));
    QFont font;
    font.setFamily("Arial");
    font.setPointSize(20);
    painter.setFont(font);
    // 根据 QFont 对象创建 QFontMetrics 实例
    QFontMetrics font_metrics(painter.font());
    QString str = QString::number(m_degRotate) + QString("kb/s");
    // 获取文本的长度
    int text_width = font_metrics.width(str);
    // 获取文本的高度
    int text_height = font_metrics.height();
    QPoint curPoint = QPoint(point.x() - text_width / 2, point.y() - text_height);
    painter.drawText(curPoint, str);
    str = "数据传输速率";
    text_width = font_metrics.width(str);
    QPoint curPoint2 = QPoint(point.x() - text_width / 2, point.y() + text_height);
    painter.drawText(curPoint2, str);
    painter.restore();
}

// 绘制一条中间略粗两边略尖的渐变发光线条
void Widget::DrawDbLightLine(QPainter& painter, QPoint & point)
{
    painter.save();
    // 创建白色的画笔，设置较粗的线条和略圆形的线帽
    QPen pen(QColor(255, 255, 255));
    pen.setWidth(6);
    pen.setCapStyle(Qt::RoundCap);
    // 创建一个渐变，将颜色从白色渐变到透明色
    QLinearGradient gradient(0, point.y() - 100, 0, point.y() + 100);
    gradient.setColorAt(0, QColor(255, 255, 255));
    gradient.setColorAt(1, QColor(255, 255, 255, 0));
    // 设置画笔的颜色为渐变
    pen.setBrush(gradient);
    // 将这个画笔设置给 QPainter
    painter.setPen(pen);
    // 绘制一条直线
    painter.drawLine(QPoint(point.x() - 100, point.y()), QPoint(point.x() + 100, point.y()));
    painter.restore();
}

// 中间小圆
void Widget::DrawCircle_bom_small(QPainter& painter, QPoint & center, int radius)
{
    //保存绘图对象
    painter.save();
    //计算圆的位置和大小
    int x = center.x() - radius;
    int y = center.y() - radius;
    int width = 2 * radius;
    int height = 2 * radius;
    //创建圆形路径
    QPainterPath inCircle;
    inCircle.moveTo(center);
    inCircle.addEllipse(x, y, width, height);
    //设置画刷和画笔
    painter.setBrush(QColor(0, 73, 107));
    painter.setPen(QColor(255, 255, 255));
    //绘制圆形
    painter.drawPath(inCircle);
    //恢复绘图对象
    painter.restore();
}

void Widget::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    //中间小圆
    QPoint dbrPointSmallCircle = QPoint(width() / 2, height() / 2);
    DrawCircle_bom_small(painter, dbrPointSmallCircle, qMin(width() / 2, height() / 2) - qMin(width() / 2, height() / 2) / 2);
    // 绘制文字
    QPoint dbrPoint = QPoint(width() / 2, height() / 2);
    DrawDbNum(painter, dbrPoint);
    // 绘制一条中间略粗两边略尖的渐变发光线条
    QPoint curPoint = QPoint(width() / 2, height() / 2);
    DrawDbLightLine(painter, curPoint);
}