绘图中的渐变

绘图渐变:指的就是在指定区域内,指定开始位置到指定结束为止,一种颜色颜色逐渐变成另一种颜色的图

qt中的渐变分为三个类别:

1线性类别 (QLinearGradient)     2:角度渐变(QConicalGradient)   3:辐射渐变(QRadialGradient):

首先得介绍一下渐变的使用方法:

Type  Name(can1,can2,can3); 
 //Type 是选择的渐变类型类,Name是名字,里面的参数包含了渐变起始地址等信息
//   不同的渐变类,参数类型不一样

Name.setColorAt(x%,Qt::color);   
//setColorAt 里面包含两个属性,一个是渐变区间,一个是渐变区间的类型


//////////////////举个线性和圆形的例子///////////////////

QLinearGradient linear(10,10,200,200); //渐变类型为线性,起点坐标是(10,10)终点坐标(200,200)
linear.setColorAt(0.2,Qt::red);//0.2代表的是颜色在起始坐标上的比例,red  是颜色

QConicalGradient   Name(0,0,0);//  渐变类型为角度渐变,前两个零是渐变原点坐标,最后0是角度

Name.setColorAt(12/360,Qt::green);//两个参数,前面是比值同上,后面是颜色设置

下面将介绍两种渐变方式的具体例子:QlinearGradient  和QConicalGradient

QLinearGradient  线性渐变

    void paintEvent(QPaintEvent *)
    {
        QPainter painter(this);   //定义绘画者

        painter.setRenderHint(QPainter::Antialiasing, true);  //设置是否设置反走样
        QLinearGradient linearGradient(60, 50, 200, 200);  //创建渐变对象linewarGradient
        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);
    }

QConicalGradient角度渐变

    void ColorWheel::paintEvent(QPaintEvent *)
    {
        QPainter painter(this);
        painter.setRenderHint(QPainter::Antialiasing);
        const int r = 150;
        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);  /*主要注意这个,重新设置坐标原点的位置是r,rQPainter::translate(x, y) 函数意思是,将坐标系的原点设置到 (x, y) 点。原本坐标系原点位于左上角,我们使用 translate(r, r),将坐标原点设置为 (r, r)。这么一来,左上角的点的坐标就应该是 (-r, -r)。
*/

        QBrush brush(conicalGradient);
        painter.setPen(Qt::NoPen);
        painter.setBrush(brush);
        painter.drawEllipse(QPoint(0, 0), r, r);
    }

 

 

你可能感兴趣的:(qt)