渐变,是指逐渐的,有规律性的变化,是一种规律性很强的现象。Qt提供了一个与渐变相关的QGradient类,目前支持三种渐变画刷,分别是线性渐变(QLinearGradient)、辐射渐变(QRadialGradient)、角度渐变(QConicalGradient),如下图所示:

从左到右依次为:线性渐变、辐射渐变、角度渐变

下面来看一下实现的代码,由于程序较简单,所以将解释都加在了每行代码的后边:

  1. #include<QtGui/QApplication>
  2. #include"gradient_test.h"
  3. intmain(intargc,char*argv[])
  4. {
  5. QApplicationa(argc,argv);
  6. gradient_testw;
  7. w.show();
  8. returna.exec();
  9. }
  10. //gradient_test.h:
  11. #ifndefGRADIENT_TEST_H
  12. #defineGRADIENT_TEST_H
  13. #include<QtGui/QWidget>
  14. #include<QPainter>
  15. #include<QStyleOption>
  16. #include<QResizeEvent>
  17. classgradient_test:publicQWidget
  18. {
  19. Q_OBJECT
  20. public:
  21. explicitgradient_test(QWidget*parent=0);
  22. virtualQSizesizeHint()const;
  23. protected:
  24. voidpaintEvent(QPaintEvent*event);
  25. voidresizeEvent(QResizeEvent*event);
  26. private:
  27. QSizeinitSize;
  28. QImagewheel;
  29. voiddrawLine(constQSize&newSize);
  30. };
  31. #endif//GRADIENT_TEST_H
  32. //gradient_test.cpp:
  33. #include"gradient_test.h"
  34. gradient_test::gradient_test(QWidget*parent)
  35. :QWidget(parent),initSize(300,300)
  36. {
  37. resize(650,250);    //窗口大小
  38. }
  39. voidgradient_test::drawLine(constQSize&newSize)
  40. {
  41. QPainterpainter(&wheel);   //wheel作为画图对象?
  42. painter.setRenderHint(QPainter::Antialiasing);  //消除锯齿
  43. wheel.fill(Qt::white);
  44. //线性渐变
  45. QLinearGradientlinearGradient(20,20,150,150);
  46. //创建了一个QLinearGradient对象实例,参数为起点和终点坐标,可作为颜色渐变的方向
  47. //painter.setPen(Qt::NoPen);
  48. linearGradient.setColorAt(0.0,Qt::green);
  49. linearGradient.setColorAt(0.2,Qt::white);
  50. linearGradient.setColorAt(0.4,Qt::blue);
  51. linearGradient.setColorAt(0.6,Qt::red);
  52. linearGradient.setColorAt(1.0,Qt::yellow);
  53. painter.setBrush(QBrush(linearGradient));
  54. painter.drawEllipse(10,10,200,200);
  55. //前面为左边,后面两个参数为横轴和纵轴,上面的四行分别设置渐变的颜色和路径比例
  56. //辐射渐变
  57. QRadialGradientradialGradient(310,110,100,310,110);
  58. //创建了一个QRadialGradient对象实例,参数分别为中心坐标,半径长度和焦点坐标,如果需要对称那么中心坐标和焦点坐标要一致
  59. radialGradient.setColorAt(0,Qt::green);
  60. //radialGradient.setColorAt(0.2,Qt::white);
  61. radialGradient.setColorAt(0.4,Qt::blue);
  62. //radialGradient.setColorAt(0.6,Qt::red);
  63. radialGradient.setColorAt(1.0,Qt::yellow);
  64. painter.setBrush(QBrush(radialGradient));
  65. painter.drawEllipse(210,10,200,200);//在相应的坐标画出来
  66. //弧度渐变
  67. QConicalGradientconicalGradient(510,110,0);
  68. //创建了一个QConicalGradient对象实例,参数分别为中心坐标和初始角度
  69. conicalGradient.setColorAt(0,Qt::green);
  70. conicalGradient.setColorAt(0.2,Qt::white);
  71. conicalGradient.setColorAt(0.4,Qt::blue);
  72. conicalGradient.setColorAt(0.6,Qt::red);
  73. conicalGradient.setColorAt(0.8,Qt::yellow);
  74. conicalGradient.setColorAt(1.0,Qt::green);
  75. //设置渐变的颜色和路径比例
  76. painter.setBrush(QBrush(conicalGradient));
  77. painter.drawEllipse(410,10,200,200);//在相应的坐标画出来
  78. }
  79. QSizegradient_test::sizeHint()const
  80. {
  81. returnQSize(height(),height());
  82. }
  83. voidgradient_test::resizeEvent(QResizeEvent*event)
  84. {
  85. wheel=QImage(event->size(),QImage::Format_ARGB32_Premultiplied);
  86. wheel.fill(palette().background().color());
  87. drawLine(event->size());
  88. update();
  89. }
  90. voidgradient_test::paintEvent(QPaintEvent*event)
  91. {
  92. QPainterpainter(this);
  93. QStyleOptionopt;
  94. opt.init(this);
  95. painter.drawImage(0,0,wheel);
  96. style()->drawPrimitive(QStyle::PE_Widget,&opt,&painter,this);
  97. }

http://blog.csdn.net/wangwei890702/article/details/8552482

线性渐变、辐射渐变、角度渐变-QLinearGradient,QRadialGradient,QConicalGradient的更多相关文章

  1. CSS3背景渐变属性 linear-gradient(线性渐变)和radial-gradient(径向渐变)

    CSS3 Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变). 为了更好的应用CSS3 Gradient,我们需要先了解一下目前的几种现代浏览器 ...

  2. css3实现背景颜色渐变,文字颜色渐变,边框颜色渐变

    css3的渐变可以使用2个或者多个指定的颜色之间显示平稳的过渡的效果.这篇文章主要介绍下css3实现背景颜色渐变,文字颜色渐变,边框颜色渐变的方法,以便大家学习参考! 1.css背景颜色渐变 代码: ...

  3. 30.QT-渐变之QLinearGradient、 QConicalGradient、QRadialGradient

    渐变有三种:QLinearGradient.QConicalGradient . QRadialGradient 它们都有一个QGradient父类 QGradient父类的常用公共函数有: void ...

  4. echarts 角度渐变环形图心得

    今天做了一个图,把自己的遇到的问题和体会记录一下,以防忘记 echarts地址 https://gallery.echartsjs.com/editor.html?c=xEPtLLmG4G 参考官网地 ...

  5. H5C3--线性渐变 linear-gradient,径向渐变radial-gradient,重复渐变radial-gradient

    一.线性渐变 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  6. CSS3 颜色渐变、阴影、渐变的阴影

    css阴影: 外阴影:box-shadow:X Y Npx #color; 内阴影:box-shadow:inset X Y Npx #color; 文字阴影:text-shadow:X Y Npx ...

  7. 第四界css大会 黑魔法-css网格背景、颜色拾取器、遮罩、文字颜色渐变、标题溢出渐变等

    1.css网格背景 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  8. 最简单的PS渐变导入方法 photoshop渐变插件素材导入教程

    photoshop渐变插件素材可以让用户更好更直接,更快速地设计出自己想要的效果作品.网上有多种多样的ps渐变,那么Mac版Ps渐变怎么导入呢?这里我来和大家分享一下photoshop渐变插件素材导入 ...

  9. c# 自定义按钮,渐变颜色(含中心向四周渐变,单方向渐变)

    废话不多言,直接代码: public class RoundButton : Button { bool clickBool = false; //1.设置圆形 //2.设置渐变色 //3.设置too ...

随机推荐

  1. thinkphp3.1 缓存配置设置读取

    以下黄字是我用的代码: //设置缓存名为zgg,内容为zongguagua,有效时间60秒 cache('zgg',"zongguagua",60); //读取缓存 if(cach ...

  2. [Compose] 16. Apply multiple functors as arguments to a function (Applicatives)

    We find a couple of DOM nodes that may or may not exist and run a calculation on the page height usi ...

  3. Android开发:使用ViewDragHelper实现抽屉拉伸效果

    事实上,有非常多方法能够实现一个Layout的抽屉拉伸效果,最常常的方法就是自己定义一个ViewGroup,然后控制点击事件.控制移动之类的,这样的方法的代码量多,并且实现起来复杂,后期维护添加其它效 ...

  4. 【计算机视觉】OpenCV中直方图处理函数简述

    计算直方图calcHist 直方图是对数据集合的统计 ,并将统计结果分布于一系列提前定义的bins中.这里的数据不只指的是灰度值 ,统计数据可能是不论什么能有效描写叙述图像的特征. 如果有一个矩阵包括 ...

  5. [GeekBand] C++ 基础知识一 ——通过引用传递数组

    本文参考 : C++ Primer (第四版)  7.2.4及 16.1.5 相关章节 GeekBand 侯捷老师,学习笔记 开发环境采用:VS2013版本 关键问题一.传递引用与传指针.传值的区别? ...

  6. 【rlz000】字串找数

    Time Limit: 3 second Memory Limit: 2 MB 问题描述 输入一个字符串,内有数字和非数字字符.如A123X456Y7A,302ATB567BC,统计共有多少个整数, ...

  7. Read-Copy Update Implementation For Non-Cache-Coherent Systems

    A technique for implementing read-copy update in a shared-memory computing system having two or more ...

  8. Vue挂载元素的替换

    Vue根组件已有挂载DOM'#app',在render又引进一个组件,该组件最外层也是用了'#app',为何根组件的DOM'#app'会被替换掉. //main.js import Vue from ...

  9. 一个自己犯的react错误

    在看<react小书>高阶组件一节的时候,看到如下代码 import React, { Component } from 'react' export default (WrappedCo ...

  10. burp suite中国乱码的解决方案

    于http的response还有经常出现乱码,其实解决的办法很easy 首先点击Options标签, 然后找到display 找到http message display watermark/2/te ...