‌QPainter在Qt中三种类型的渐变

十启树

于 2024-12-20 16:22:22 发布

阅读量713

点赞数 1

分类专栏： Qt 技术文章标签： qt 开发语言

本文链接：https://blog.youkuaiyun.com/A185822153/article/details/144613997

版权

Qt 技术专栏收录该内容

39 篇文章

订阅专栏

‌QPainter在Qt中支持三种类型的渐变：线性渐变（QLinearGradient）、辐射渐变（QRadialGradient）和锥形渐变（QConicalGradient）。

1，线性渐变（QLinearGradient）

线性渐变由两个控制点定义，连接这两点的线上设置一系列的颜色断点。这些断点被钳位到浮点数0和1之间，0对应第一个控制点，1对应第二个控制点，两个指定断点之间的颜色由线性插值得出。例如：‌‌

void MyWidget::paintEvent(QPaintEvent* event) {
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing, true);
    QLinearGradient linearGradient(60, 50, 200, 200);
    linearGradient.setColorAt(0.2, Qt::white);
    linearGradient.setColorAt(0.6, Qt::green);
    linearGradient.setColorAt(1.0, Qt::black);
    painter.setBrush(QBrush(linearGradient));
    painter.drawEllipse(50, 50, 200, 150);
}

这段代码会在一个椭圆内填充从白色到绿色再到黑色的线性渐变‌。

2，辐射渐变（QRadialGradient）

辐射渐变由一个中心点、半径、一个核心，以及颜色断点控制。中心点和半径定义一个圆，颜色从中心向外扩散。例如：

void MyWidget::paintEvent(QPaintEvent* event) {
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing, true);
    QRadialGradient radialGradient(100, 100, 50, Qt::PointF(150, 150), Qt::PointF(150, 150));
    radialGradient.setColorAt(0.2, Qt::white);
    radialGradient.setColorAt(0.6, Qt::green);
    radialGradient.setColorAt(1.0, Qt::black);
    painter.setBrush(QBrush(radialGradient));
    painter.drawEllipse(50, 50, 200, 150);
}

这段代码会在一个椭圆内填充从中心向外扩散的线性渐变‌。

3，锥形渐变（QConicalGradient）

锥形渐变由一个中心点和起始角度定义，颜色从中心点向外扩散。例如：

QConicalGradient conicalGradient(100, 100, 45); // 起始角度为45度
conicalGradient.setColorAt(0.1, QColor(128, 138, 135, 150)); // 起始颜色
conicalGradient.setColorAt(0.7, QColor(128, 138, 135, 0)); // 结束颜色
painter.setBrush(conicalGradient); // 设置画刷为锥形渐变
painter.drawEllipse(100, 100, 200, 200); // 在椭圆内绘制锥形渐变效果‌:ml-citation{ref="1,3" data="citationList"}

:::ml-data{name=citationList}
```json
[{"source":{"logo":"https://ss1.baidu.com/6ONXsjip0QIZ8tyhnq/it/u=3385518650,4195902768&fm=195&app=88&f=JPEG?w=200&h=200","name":"51CTO博客"},"isVideo":false,"title":"渐变颜色Qt学习:QPainter之渐变填充","thumbnail":"http://t9.baidu.com/it/u=3344824971,4119498438&fm=217&app=126&f=JPEG?w=314&h=336&s=63A39B42C53A25849729B6030300B0D5","linkInfo":{"data-click-info":"{}","href":"https://blog.51cto.com/u_15057824/4098337","target":"_blank","data-noblank":true,"data-show":"list","data-show-ext":"{\"pos\":\"1\",\"component_content\":{\"component_name\":\"reference\"}}"}},{"source":{"logo":"http://gips0.baidu.com/it/u=4166997871,4290687763&fm=3033&app=3033&f=JPEG?w=200&h=200","name":"可吉拉多"},"isVideo":false,"title":"Qt项目中,三种图形渐变填充方式详细总结","thumbnail":"http://t7.baidu.com/it/u=25356089,528979329&fm=3031&app=3031&f=JPEG?w=591&h=185&s=A743F0109244831B1AAFC7D60300C0AC","linkInfo":{"data-click-info":"{}","href":"https://zhuanlan.zhihu.com/p/156771918","target":"_blank","data-noblank":true,"data-show":"list","data-show-ext":"{\"pos\":\"2\",\"component_content\":{\"component_name\":\"reference\"}}"}},{"source":{"logo":"https://ss2.baidu.com/6ONYsjip0QIZ8tyhnq/it/u=2005731947,4139443793&fm=195&app=88&f=JPEG?w=200&h=200","name":"优快云博客"},"isVideo":false,"title":"QPainter的画笔设置渐变","linkInfo":{"data-click-info":"{}","href":"https://blog.youkuaiyun.com/sunflower_2020/article/details/137871301","target":"_blank","data-noblank":true,"data-show":"list","data-show-ext":"{\"pos\":\"3\",\"component_content\":{\"component_name\":\"reference\"}}"}}]