<2017年12月>
日一二三四五六
262728293012
3456789
10111213141516
17181920212223
24252627282930
31123456

跟我一起玩Win32开发（23）：渐变颜色填充

GradientFill函数可以对特定的矩形区域或者三角形区域进行渐变颜色的填充。我们先来看看GradientFill函数到底长得什么样子，帅不帅。

[cpp] view plain copy
 
  1. BOOL GradientFill(  
  2.   _In_  HDC hdc,  
  3.   _In_  PTRIVERTEX pVertex,  
  4.   _In_  ULONG nVertex,  
  5.   _In_  PVOID pMesh,  
  6.   _In_  ULONG nMesh,  
  7.   _In_  ULONG ulMode  
  8. );  

参数涉及结构体，于是有些人就开始感到痛苦了，调用函数一遇到结构体就会痛苦，而这个函数更痛苦，还要结构体的数组。

人家达摩祖师说了，痛苦是你的事，和API无关，它又不会因为你痛苦就变得简单易用，该简单的就简单，该复杂的还是那么复杂。我们来分析一个吧。首先第一个hdc就不用我说了，就是某个上下文，这个上下文你就理解为和谁有关，就是谁的句柄，句柄是一种资源标识，以前说过了，就好比身份证号码可以唯一标识你的身份一般（假身份证除外）。所以，这个hdc就是决定你要把渐变颜色画到哪里，画到窗口上就是窗口的HDC，画到桌面上就是桌面的HDC。

第二个参数，注意，是TRIVERTEX结构体的数组，数组中每一个TRIVERTEX结构体的变量指定一个渐变点的坐标和颜色，颜色是ARGB四通道的，也就是说你可以玩透明效果，A，R，G，B每个值的范围，MSDN上有说明是The color information of each channel is specified as a value from 0x0000 to 0xff00，这个范围用十进制表示到底是多少，自己打开“计算器”算一下就知道了，Win7以后的计算器程序严重强大，用来算命都可以，更别说进制换算了。

如果你写C++程序多了，你就会猜到第三个参数是什么了，凡是涉及到传数组作为参数的，后面肯定要带一个参数指明数组中有多少个元素。因为C语言的数组与托管语言不同，其实它是善变的，你定义了int a[3] ....，然后你赋值的时候，赋到a[5]都可以，虽然会报错，但是你不妨试试，即使报错，但是仍然可以取到值，因为内存分布是连续的。

不用说，nVertex 就是指明前面pVertex的个数；后面一个pMesh又是一个结构体的数组，但它是“雄雌同体”的，可以是GRADIENT_TRIANGLE结构体的数组，也可以是GRADIENT_RECT结构体的数组，具体得看你想怎么填充，从名字就知道，GRADIENT_TRIANGLE是三角形填充，就是填充出来的区域是三角形的，这个应该好理解，就是你的内裤的形状；而GRADIENT_RECT更好理解了，矩形，就是小学老师教你的长方形，正方形。

接着这个nMesh 参数你肯定知道了，不解释了，你懂的。

最后一个参数就是指定怎么填充，无非就是水平填过去，还是垂直填下来之类的。

 

那么，TRIVERTEX数组与GRADIENT_RECT或GRADIENT_TRIANGLE数组是如何对应的呢？

GRADIENT_TRIANGLE是定义三角形的，要确定一个三角形就得要三个点，所以这些点就从TRIVERTEX数组来，每个TRIVERTEX变量定义一个点。

比如，TRIVERTEX数组有六个元素，就有六个点，刚好可以定义两个三角形，GRADIENT_TRIANGLE中的三个成员就是三角形三个点的索引，这些索引就是TRIVERTEX数组中的元素的索引，六个点，索引是0，1，2，3，4，5，接着，如果第一个GRADIENT_TRIANGLE中的三个成员分别设为0，1，2，则六个点中前三个点就定义了第一个三角形，如果第二个GRADIENT_TRIANGLE的三个成员设置为3，4，5，那么，六个点中的后三个点组成一个三角形。如果是1，4，5，就说明六个点中的第二个，第五个和第六个点将组成一个三角形。

GRADIENT_RECT就更好理解了，两个点就可以确定一个矩形，即左上角的点，右下角的点，如果渐变点有四个，正好可以组成两个矩形。0和1，2和3.

 

下面的代码将画出两个矩形的填充区域。

[cpp] view plain copy
 
  1. case WM_PAINT:  
  2.     hdc = BeginPaint(hWnd, &ps);  
  3.     // TODO: 在此添加任意绘图代码...  
  4.     TRIVERTEX trives[4];  
  5.     trives[0].x=10;  
  6.     trives[0].y=12;  
  7.     trives[0].Alpha=0xff00;  
  8.     trives[0].Red=0xe100;  
  9.     trives[0].Green=0x00cc;  
  10.     trives[0].Blue=0xa3c3;  
  11.     trives[1].x=188;  
  12.     trives[1].y=80;  
  13.     trives[1].Alpha=0xff00;  
  14.     trives[1].Red=0x00fa;  
  15.     trives[1].Green=0x0068;  
  16.     trives[1].Blue=46;  
  17.     trives[2].x=280;  
  18.     trives[2].y=190;  
  19.     trives[2].Alpha=0xff00;  
  20.     trives[2].Red=0x0004;  
  21.     trives[2].Green=0x0017;  
  22.     trives[2].Blue=0xff00;  
  23.     trives[3].x=500;  
  24.     trives[3].y=320;  
  25.     trives[3].Alpha=0xff00;  
  26.     trives[3].Red=0xfac0;  
  27.     trives[3].Green=0xcccc;  
  28.     trives[3].Blue=0xcef0;  
  29.   
  30.     // 定义渐变区为矩形，并确定其点  
  31.     GRADIENT_RECT rects[2];  
  32.     rects[0].UpperLeft=0;  
  33.     rects[0].LowerRight=1;  
  34.     rects[1].UpperLeft =2;  
  35.     rects[1].LowerRight=3;  
  36.   
  37.     GradientFill(hdc,trives,4,rects,2,GRADIENT_FILL_RECT_H);  
  38.   
  39.     EndPaint(hWnd, &ps);  
  40.     break;  

最后就得到如下图所示的效果。


好，下面我们看看三角形的。

[cpp] view plain copy
 
  1. // 三角形  
  2. GRADIENT_TRIANGLE triangles[2];  
  3. triangles[0].Vertex1=2;  
  4. triangles[0].Vertex2=0;  
  5. triangles[0].Vertex3=3;  
  6. triangles[1].Vertex1=3;  
  7. triangles[1].Vertex2=1;  
  8. triangles[1].Vertex3=0;  
  9.   
  10. // 矩形填充  
  11. GradientFill(hdc,trives,4,rects,2,GRADIENT_FILL_RECT_V);  
  12. // 三角形填充  
  13. GradientFill(hdc,trives,4,triangles,2,GRADIENT_FILL_TRIANGLE);  

我们用的还是前面填充矩形的四个点，那有人会问了，不对啊，四个怎么能弄出两个三角形呢，不是应该要六个点吗？是啊，是六个点，但是这个四个点是可以重复利用，现在都说要环保，所以循环利用，2-0-3组成一个三角形，3-1-0又组成一个三角形。反正就是一个排列组合，你只要每个三角形弄足三个点就行了。前面的矩形同样道理，你只要每个矩形弄够两个点就行了。这就很像WPF中使用的三角形建模的三维图形同理，点的集合我就定义这么多个，但是我在其中任取三个就可以组成一个“模型单元”。

与前面的代码合并执行，最后得到这种效果。

 


 

posted @ 2018-03-31 13:59  史D芬周  阅读(578)  评论(0)  编辑  收藏  举报