Qt：QtPainter的渐变风格

╰+攻爆jí腚メ 2022-10-25 05:58 144阅读 0赞

1、新建QT GUI， 基类选择QWidget，取消“创建界面”

2、在widget.h中添加\#include <QPainter>和重写绘画事件定义：  
\* protected:  
void paintEvent(QPaintEvent \*event);  
3、在widget.cpp中添加重绘事件void Widget::paintEvent(QPaintEvent \*event)

4、线性渐变QLinearGradient

void Widget::paintEvent(QPaintEvent *event)
    {
        QPainter painter;
    
        painter.begin(this);
        QLinearGradient ling(QPointF(70, 70), QPoint( 140, 140 ) );  //从起点到终点的渐变
        ling.setColorAt(0, Qt::blue);  //起点到中心要显示的颜色
        ling.setColorAt(1, Qt::green);
        ling.setSpread( QGradient::PadSpread );   //默认显示模式
    
        QBrush brush(ling);
        painter.setBrush(brush);
        painter.drawRect(0, 0, 200, 200);
    
        painter.end();
    }

![b6f33a50abdd0f62f8ba766f59529b45c3a.jpg][]

void Widget::paintEvent(QPaintEvent *event)
    {
        QPainter painter;
    
        painter.begin(this);
        QLinearGradient ling(QPointF(70, 70), QPoint( 140, 140 ) );  //从起点到终点的渐变
        ling.setColorAt(0, Qt::blue);  //起点到中心要显示的颜色
        ling.setColorAt(1, Qt::green);
        ling.setSpread( QGradient::RepeatSpread );   //默认显示模式
    
        QBrush brush(ling);
        painter.setBrush(brush);
        painter.drawRect(0, 0, 200, 200);
    
        painter.end();
    }

![2a1251ee16dacfb2918a95a207106d2d9b8.jpg][]

void Widget::paintEvent(QPaintEvent *event)
    {
        QPainter painter;
    
        painter.begin(this);
        QLinearGradient ling(QPointF(70, 70), QPoint( 140, 140 ) );  //从起点到终点的渐变
        ling.setColorAt(0, Qt::blue);  //起点到中心要显示的颜色
        ling.setColorAt(1, Qt::green);
        ling.setSpread( QGradient::ReflectSpread );   //默认显示模式
    
        QBrush brush(ling);
        painter.setBrush(brush);
        painter.drawRect(0, 0, 200, 200);
    
        painter.end();
    }

![00e754828b1a1e6cd582cc925880f6a4df7.jpg][]

5、圆心渐变QRadialGradient

void Widget::paintEvent(QPaintEvent *event)
    {
        QPainter painter;
        painter.begin(this);
    
        QRadialGradient radg(100, 100, 50, 120, 120);  //在圆心(100, 100)，半径50的圆上渐变。渐变起点是(120, 120)
        radg.setColorAt( 0, Qt::black );
        radg.setColorAt( 1, Qt::white );
        //radg.setSpread(QGradient::PadSpread);   //默认
        QBrush brush(radg);
        painter.setBrush(brush);
        painter.drawRect(0, 0, 200, 200);
        painter.end();
    }

![0eaec383eec476427f07448aba36047eb41.jpg][]

void Widget::paintEvent(QPaintEvent *event)
    {
        QPainter painter;
        painter.begin(this);
    
        QRadialGradient radg(100, 100, 50, 120, 120);  //在圆心(100, 100)，半径50的圆上渐变。渐变起点是(120, 120)
        radg.setColorAt( 0, Qt::black );
        radg.setColorAt( 1, Qt::white );
        radg.setSpread(QGradient::RepeatSpread);
        QBrush brush(radg);
        painter.setBrush(brush);
        painter.drawRect(0, 0, 200, 200);
        painter.end();
    }

![ecf0468788a6659f383698f70dd8938a622.jpg][]

void Widget::paintEvent(QPaintEvent *event)
    {
        QPainter painter;
        painter.begin(this);
    
        QRadialGradient radg(100, 100, 50, 120, 120);  //在圆心(100, 100)，半径50的圆上渐变。渐变起点是(120, 120)
        radg.setColorAt( 0, Qt::black );
        radg.setColorAt( 1, Qt::white );
        radg.setSpread(QGradient::ReflectSpread);
        QBrush brush(radg);
        painter.setBrush(brush);
        painter.drawRect(0, 0, 200, 200);
        painter.end();
    }

![a821d19ed104822fbf983f51169cd2f8412.jpg][]

6、坐标角度渐变QConicalGradient

void Widget::paintEvent(QPaintEvent *event)
    {
        QPainter painter;
        painter.begin(this);
    
        QConicalGradient cong( 100, 100, 45.0 );  //在(100, 100)坐标上以45°为中心渐变
        cong.setColorAt( 0, Qt::black );
        cong.setColorAt( 1, Qt::white );
    
        QBrush brush(cong);
        painter.setBrush(brush);
        painter.drawRect(0, 0, 200, 200);
    
    
        painter.end();
    }

![dd55b92bf994e67f657aec22e6421f53281.jpg][]

[b6f33a50abdd0f62f8ba766f59529b45c3a.jpg]: /images/20221024/a9949df46dbf48868d5ebcd2711177ad.png
[2a1251ee16dacfb2918a95a207106d2d9b8.jpg]: /images/20221024/82497a012cdc499786c56a3bebe0b69d.png
[00e754828b1a1e6cd582cc925880f6a4df7.jpg]: /images/20221024/8d3dfc5ddf4346848de20105df9594e3.png
[0eaec383eec476427f07448aba36047eb41.jpg]: /images/20221024/9d912304c19c4fc08c0e598f834f795f.png
[ecf0468788a6659f383698f70dd8938a622.jpg]: /images/20221024/61ffd4bdc4824d9aaf8fa50219365626.png
[a821d19ed104822fbf983f51169cd2f8412.jpg]: /images/20221024/d3be94fd269c45e98b7a1010de4d7092.png
[dd55b92bf994e67f657aec22e6421f53281.jpg]: /images/20221024/18674223f84a48dcbb7484ab63059b82.png