这次教程中,我们将在第02课的基础上,教大家如何使用颜色。我们将一起理解两种着色模式(光滑着色与平面着色),并运用这两种模式分别给第02课的三角形和正方形着色。我们将使用平面着色给四边形着色,即给三角形涂上一种固定的颜色;使用平滑着色给三角形着色,将三角形的三个顶点的不同颜色混合在一起,创建漂亮的色彩混合。
程序运行时效果如下:
下面进入教程:
要对三角形和四边形进行着色,只需在第02课代码的基础上,对paintGL()函数作一定的修改。
下面我将重写整个paintGL()函数,具体代码如下:
1 void MyGLWidget::paintGL() //从这里开始进行所以的绘制
2 {
3 glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); //清除屏幕和深度缓存
4 glLoadIdentity(); //重置当前的模型观察矩阵
5
6 glTranslatef(-1.5f, 0.0f, -6.0f); //左移1.5单位,并移入屏幕6.0单位
7 glBegin(GL_TRIANGLES); //开始绘制三角形
8 glColor3f(1.0f, 0.0f, 0.0f); //设置当前色为红色
9 glVertex3f(0.0f, 1.0f, 0.0f); //上顶点
10 glColor3f(0.0f, 1.0f, 0.0f); //设置当前色为绿色
11 glVertex3f(-1.0f, -1.0f, 0.0f); //左下
12 glColor3f(0.0f, 0.0f, 1.0f); //设置当前色为蓝色
13 glVertex3f(1.0f, -1.0f, 0.0f); //右下
14 glEnd(); //三角形绘制结束
15
16 glTranslatef(3.0f, 0.0f, 0.0f); //右移3.0单位
17 glColor3f(0.5f, 0.5f, 1.0f); //一次性将当前色设置为蓝色
18 glBegin(GL_QUADS); //开始绘制四边形
19 glVertex3f(-1.0f, 1.0f, 0.0f); //左上
20 glVertex3f(1.0f, 1.0f, 0.0f); //右上
21 glVertex3f(1.0f, -1.0f, 0.0f); //左下
22 glVertex3f(-1.0f, -1.0f, 0.0f); //右下
23 glEnd(); //四边形绘制结束
24 }
其实与第02课相比,只是增加了4行代码而已。我们利用glColor3f(r, g, b)函数来选择颜色进行着色,该函数三个参数依次是红、绿、蓝三色分量,范围从0.0到1.0之间,类似于之前所讲的清除屏幕背景函数。当我们将颜色设为某种颜色时,接下来的代码绘制出的对象的颜色就都是对应颜色的。
对于用光滑着色的三角形,我们需要分别对于3个顶点分别选择颜色,再分别进行绘点。故我们在每次绘点之前都需要调用一次glColor3f(r, g, b)进行选色,glEnd()之后,三角形将被填充,但因为每个顶点有不同的颜色,因此看起来颜色从每个顶点喷出,并刚好在三角形的中心汇合,三种颜色相互混合,这就是平滑着色;而对于使用平面着色的四边形,我只需要在一开始就选择好颜色,直接绘制四边形即可。
还有一点值得提的是,顺时针绘制图形时,意味着我们所看见的是图形的背景,这在后面对图形有一定影响。
现在就可以运行程序查看效果了!