[学习][笔记] qt5 从入门到入坟:＜九＞反走样,渐变-阿里云开发者社区

[学习][笔记] qt5 从入门到入坟:＜九＞反走样,渐变

2023-10-13 17

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： [学习][笔记] qt5 从入门到入坟:＜九＞反走样,渐变

反走样

Qt 学习之路 2（26）：反走样

反走样是图形学中的重要概念，用以防止通常所说的“锯齿”现象的出现。

void paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    painter.setPen(QPen(Qt::black, 5, Qt::DashDotLine, Qt::RoundCap));//色 5 像素宽的画笔，使用了点线的样式，圆形笔帽
    painter.setBrush(Qt::yellow);//黄色的画刷填充
    painter.drawEllipse(50, 150, 200, 150);
    painter.setRenderHint(QPainter::Antialiasing, true);//Antialiasing属性（也就是反走样）设置为 true
    painter.setPen(QPen(Qt::black, 5, Qt::DashDotLine, Qt::RoundCap));
    painter.setBrush(Qt::yellow);
    painter.drawEllipse(300, 150, 200, 150);
}

左侧没有使用反锯齿，明细显示出锯齿的样子；右侧则增加了反锯齿代码。

Antialiasing属性：setRenderHint(QPainter::Antialiasing, true);

渐变

Qt 学习之路 2（27）：渐变

线性渐变（QLinearGradient）、辐射渐变（QRadialGradient）和角度渐变（QConicalGradient）

线性渐变（QLinearGradient）

void paintEvent(QPaintEvent *)
{
    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);
}

void QGradient::setColorAt ( qreal position, const QColor & color )

这个函数的作用是，把 position 位置的颜色设置成 color。其中，position 是一个 [0, 1] 闭区间的数字。也就是说，position 是相对于我们建立渐变对象时做的那个起始点和终止点区间的一个比例。以这个线性渐变为例，在从 (60, 50) 到 (200, 200) 的线段上，在 0.2，也就五分之一处设置成白色，在 0.6 也就是五分之三处设置成绿色，在 1.0 也就是终点处设置成黑色。

辐射渐变（QRadialGradient）

角度渐变（QConicalGradient）

void PaintedWidget::paintEvent(QPaintEvent *) 
  {
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing);
    const int r = 200;
    QConicalGradient conicalGradient(0, 0, 0);
    conicalGradient.setColorAt(0.0, Qt::red);
    conicalGradient.setColorAt(60.0/360.0, Qt::yellow);
    conicalGradient.setColorAt(120.0/360.0, Qt::green);
    conicalGradient.setColorAt(180.0/360.0, Qt::cyan);
    conicalGradient.setColorAt(240.0/360.0, Qt::blue);
    conicalGradient.setColorAt(300.0/360.0, Qt::magenta);
    conicalGradient.setColorAt(1.0, Qt::red);
    painter.translate(r, r);//set O point position is (r,r)
    QBrush brush(conicalGradient);
    painter.setPen(Qt::NoPen);
    painter.setBrush(brush);
    painter.drawEllipse(QPoint(0, 0), r, r);
}