Android OpenGL 显示基本图形及相关概念解读

转载请注明出处：【huachao1001的专栏：http://blog.youkuaiyun.com/huachao1001】

在上一篇文章中，我们知道了如何在Android开发一个OpenGL模型显示。但是并没有对具体模型数据进行显示，只是展示一个背景颜色而已，在本章中，我们学习如何将一个模型数据显示成一个具体的3D图形。在Android中开发OpenGL程序非常简单，但是却有很多OpenGL相关概念是必须要清楚的，了解这些相关概念才能写出正确的代码，否则，你写出来的程序可能会无缘无故崩溃，或者是画出来的模型显示不出来等等问题。

本文是建立在上一篇文章之上，只修改GLRender类，其他部分保持不变，如果你没有看上一篇文章，请先移步【Android OpenGL入门】

1 模型数据

前面我们说过，一个3D模型一般是由很多三角片（或四边形）组成，因此，首先我们需要有三角形的点数据。既然是3D模型，自然每个点坐标是在三维坐标系中，因此，每个点需要3个数来表示。

我们定义一个三角形，需要9个数，如果我们有float类型表示一个数，那么定义一个三角形（三个点）如下：

 private float[] mTriangleArray = {
            0f, 1f, 0f,
            -1f, -1f, 0f,
            1f, -1f, 0f
};
 
1
2
3
4
5

此时，我们就有了一个三角形的3个点数据了。但是，OpenGL并不是对堆里面的数据进行操作，而是在直接内存中（Direct Memory），即操作的数据需要保存到NIO里面的Buffer对象中。而我们上面声明的float[]对象保存在堆中，因此，需要我们将float[]对象转为java.nio.Buffer对象。

我们可以选择在构造函数里面，将float[]对象转为java.nio.Buffer，如下所示：

private FloatBuffer mTriangleBuffer;
public GLRenderer() {
    //先初始化buffer，数组的长度*4，因为一个float占4个字节
    ByteBuffer bb = ByteBuffer.allocateDirect(mTriangleArray.length * 4);
    //以本机字节顺序来修改此缓冲区的字节顺序
    bb.order(ByteOrder.nativeOrder());
    mTriangleBuffer = bb.asFloatBuffer();
    //将给定float[]数据从当前位置开始，依次写入此缓冲区
    mTriangleBuffer.put(mTriangleArray);
    //设置此缓冲区的位置。如果标记已定义并且大于新的位置，则要丢弃该标记。 
    mTriangleBuffer.position(0);

}
 
1
2
3
4
5
6
7
8
9
10
11
12
13

注意，ByteBuffer和FloatBuffer以及IntBuffer都是继承自抽象类java.nio.Buffer。

另外，OpenGL在底层的实现是C语言，与Java默认的数据存储字节顺序可能不同，即大端小端问题。因此，为了保险起见，在将数据传递给OpenGL之前，我们需要指明使用本机的存储顺序。

此时，我们顺利地将float[]转为了FloatBuffer，后面绘制三角形的时候，直接通过成员变量mTriangleBuffer即可。

2 矩阵变换

在现实世界中，我们要观察一个物体可以通过如下几种方式：

• 从不同位置去观察。（视图变换）
• 移动或旋转物体，放缩物体（虽然实际生活中不能放缩，但是计算机世界是可以的）。（模型变换）
• 给物体拍照印成照片。可以做到“近大远小”、裁剪只看部分等等透视效果。（投影变换）
• 只拍摄物体的一部分，使得物体在照片中只显示部分。（视口变换）

上面所述效果，可以在OpenGL中全部实现。有一点需要很清楚，就是OpenGL的变换其实都是通过矩阵相乘来实现的。

2.1 模型变换和视图变换

高中我们学过相对运动，就是说，改变观测点的位置与改变物体位置都可以达到等效的运动效果。因此，在OpenGL中，这两种变换本质上用的是同一个函数。

在进行变换之前，我们需要声明当前是使用哪种变换。在本节中，声明使用模型视图变换，而模型视图变换在OpenGL中对应标识为：GL10.GL_MODELVIEW。通过glMatrixMode函数来声明：

gl.glMatrixMode(GL10.GL_MODELVIEW);
 
1

接下来你就可以对模型进行：平移、放缩、旋转等操作啦。但是有一点值得注意的是，在此之前，你可能针对模型做了其他的操作，而我们知道，每次操作相当于一次矩阵相乘。OpenGL中，使用“当前矩阵”表示要执行的变化，为了防止前面执行过变换“保留”在“当前矩阵”，我们需要把“当前矩阵”复位，即变为单位矩阵（对角线上的元素全为1），通过执行如下函数：

gl.glLoadIdentity();
 
1

此时，当前变换矩阵为单位矩阵，后面才可以继续做变换，例如：

//绕（1,0,0）向量旋转30度
gl.glRotatef(30, 1, 0, 0);

//沿x轴方向移动1个单位
gl.glTranslatef(1, 0, 0);

//x，y，z方向放缩0.1倍
gl.glScalef(0.1f, 0.1f, 0.1f);
 
1
2
3
4
5
6
7
8
9

上面的效果都是矩阵相乘实现，因此我们需要注意变换次序问题，举个例子，假设“当前矩阵”为单位矩阵，然后乘以一个表示旋转的矩阵R，再乘以一个表示移动的矩阵T，最后得到的矩阵，再与每个顶点相乘。假设表示模型所以顶点的矩阵为V，则实际就是((RT)V)，由矩阵乘法结合律，((RT)V)=(R(TV))，这导致的就是，先移动再旋转。即：

实际变换顺序与代码中的顺序是相反的

上面所讲的都是改变物体的位置或方向来实现“相对运动”的，如果我们不想改变物体，而是改变观察点，可以使用如下函数

/**
* gl: GL10型变量
* eyeX,eyeY,eyeZ: 观测点坐标（相机坐标）
* centerX,centerY,centerZ：观察位置的坐标
* upX,upY,upZ ：相机向上方向在世界坐标系中的方向（即保证看到的物体跟期望的不会颠倒）
*/
GLU.gluLookAt(gl,eyeX,eyeY,eyeZ,centerX,centerY,centerZ,upX,upY,upZ);
 
1
2
3
4
5
6
7

2.2 投影变换

投影变换就是定义一个可视空间，可视空间之外的物体是看不到的（即不会再屏幕中）。在此之前，我们的三维坐标中的三个坐标轴取值为[-1,1]，从现在开始，坐标可以不再是从-1到1了！

OpenGL支持主要两种投影变换：

• 透视投影
• 正投影

当然了，投影也是通过矩阵来实现的，如果想要设置为投影变换，跟前面类似：

gl.glMatrixMode(GL10.GL_PROJECTION);
gl.glLoadIdentity();
 
1
2

同样的道理，glLoadIdentity()函数也需要立即调用。

通过如下函数可将当前可视空间设置为透视投影空间：

gl.glFrustumf(left,right,bottom,top,near,far);
 
1

上面函数对应参数如下图所示（图片出自www.opengl.org）：

当然了，也可以通过另一个函数实现相同的效果：

 GLU.gluPerspective(gl,fovy,aspect,near,far);
 
1

上面函数对应的参数如下图所示（图片出自www.opengl.org）：

而对于正投影来说，相当于观察点处于无穷远，当然了，这是一种理想状态，但是有时使用正投影效率可能会更高。可以通过如下函数设置正投影：

gl.glOrthof(left,right,bottom,top,near,far);
 
1

上面函数对应的参数如下图所示（图片出自www.opengl.org）： 

2.3 视口变换

我们可以选择将图像绘制到屏幕窗口的那个区域，一般默认是在整个窗口中绘制，但是，如果你不希望在整个窗口中绘制，而是在窗口的某个小区域中绘制，你也可以自己定制：

@Override
public void onSurfaceChanged(GL10 gl, int width, int height) {
    gl.glViewport(0, 0, width, height);
}
 
1
2
3
4

每次窗口发生变化时，我们可以设置绘制区域，即在onSurfaceChanged函数中调用glViewport函数。

3 启用相关功能及配置

3.1 glClearColor()

设置清屏颜色，每次清屏时，使用该颜色填充整个屏幕。使用例子：

 gl.glClearColor(1.0f, 1.0f, 1.0f, 0f);
 
1

里面参数分别代表RGBA，取值范围为[0,1]而不是[0,255]

3.2 glDepthFunc()

OpenGL中物体模型的每个像素都有一个深度缓存的值（在0到1之间，可以看成是距离）,可以通过glClearDepthf函数设置默认的“当前像素”z值。在绘制时，通过将待绘制的模型像素点的深度值与“当前像素”z值进行比较，将符合条件的像素绘制出来，不符合条件的不绘制。具体的“指定条件”可取以下值:

• GL10.GL_NEVER：永不绘制
• GL10.GL_LESS：只绘制模型中像素点的z值<当前像素z值的部分
• GL10.GL_EQUAL：只绘制模型中像素点的z值=当前像素z值的部分
• GL10.GL_LEQUAL：只绘制模型中像素点的z值<=当前像素z值的部分
• GL10.GL_GREATER ：只绘制模型中像素点的z值>当前像素z值的部分
• GL10.GL_NOTEQUAL：只绘制模型中像素点的z值!=当前像素z值的部分
• GL10.GL_GEQUAL：只绘制模型中像素点的z值>=当前像素z值的部分
• GL10.GL_ALWAYS：总是绘制

通过目标像素与当前像素在z方向上值大小的比较是否满足参数指定的条件，来决定在深度（z方向）上是否绘制该目标像素。

注意， 该函数只有启用“深度测试”时才有效，通过glEnable(GL_DEPTH_TEST)开启深度测试以及glDisable(GL_DEPTH_TEST)关闭深度测试。

例子：

 gl.glDepthFunc(GL10.GL_LEQUAL);
 
1

3.3 glClearDepthf()

给深度缓存设定默认值。

缓存中的每个像素的深度值默认都是这个， 假设在 gl.glDepthFunc(GL10.GL_LEQUAL);前提下：

• 如果指定“当前像素值”为1时，我们知道，一个模型深度值取值和范围为[0,1]。这个时候你往里面画一个物体， 由于物体的每个像素的深度值都小于等于1， 所以整个物体都被显示了出来。
• 如果指定“当前像素值”为0， 物体的每个像素的深度值都大于等于0， 所以整个物体都不可见。 
  如果指定“当前像素值”为0.5， 那么物体就只有深度小于等于0.5的那部分才是可见的

使用例子：

gl.glClearDepthf(1.0f);
 
1

3.3 glEnable()，glDisable()

glEnable()启用相关功能，glDisable()关闭相关功能。

比如：

//启用深度测试
gl.glEnable(GL10.GL_DEPTH_TEST);
//关闭深度测试
gl.glDisable(GL10.GL_DEPTH_TEST)
//开启灯照效果
gl.glEnable(GL10.GL_LIGHTING);
// 启用光源0
gl.glEnable(GL10.GL_LIGHT0);
// 启用颜色追踪
gl.glEnable(GL10.GL_COLOR_MATERIAL);
 
1
2
3
4
5
6
7
8
9
10

3.5 glHint()

如果OpenGL在某些地方不能有效执行是，给他指定其他操作。

函数原型为：

void glHint(GLenum target,GLenum mod)
 
1

其中，target：指定所控制行为的符号常量，可以是以下值（引自【OpenGL函数思考-glHint 】）：

• GL_FOG_HINT：指定雾化计算的精度。如果OpenGL实现不能有效的支持每个像素的雾化计算，则GL_DONT_CARE和GL_FASTEST雾化效果中每个定点的计算。
• GL_LINE_SMOOTH_HINT：指定反走样线段的采样质量。如果应用较大的滤波函数，GL_NICEST在光栅化期间可以生成更多的像素段。
• GL_PERSPECTIVE_CORRECTION_HINT：指定颜色和纹理坐标的差值质量。如果OpenGL不能有效的支持透视修正参数差值，那么GL_DONT_CARE 和 GL_FASTEST可以执行颜色、纹理坐标的简单线性差值计算。
• GL_POINT_SMOOTH_HINT：指定反走样点的采样质量，如果应用较大的滤波函数，GL_NICEST在光栅化期间可以生成更多的像素段。
• GL_POLYGON_SMOOTH_HINT：指定反走样多边形的采样质量，如果应用较大的滤波函数，GL_NICEST在光栅化期间可以生成更多的像素段。

mod：指定所采取行为的符号常量，可以是以下值:

• GL_FASTEST：选择速度最快选项。
• GL_NICEST：选择最高质量选项。
• GL_DONT_CARE：对选项不做考虑。

例子：

gl.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, GL10.GL_NICEST);
 
1

3.6 glEnableClientState()

当我们需要启用顶点数组（保存每个顶点的坐标数据）、顶点颜色数组（保存每个顶点的颜色）等等，就要通过glEnableClientState()函数来开启：

//以下两步为绘制颜色与顶点前必做操作
// 允许设置顶点
//GL10.GL_VERTEX_ARRAY顶点数组
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
// 允许设置颜色
//GL10.GL_COLOR_ARRAY颜色数组
gl.glEnableClientState(GL10.GL_COLOR_ARRAY);
 
1
2
3
4
5
6
7

3.7 glShadeModel()

设置着色器模式，有如下两个选择：

• GL10.GL_FLAT
• GL10.GL_SMOOTH（默认）

如果为每个顶点指定了顶点的颜色，此时：

• GL_SMOOTH：根据顶点的不同颜色，最终以渐变的形式填充图形。
• GL_FLAT：假设有n个三角片，则取最后n个顶点的颜色填充着n个三角片。

使用例子：

gl.glShadeModel(GL10.GL_SMOOTH);
 
1

4 开始绘制

前面讲了很多概念，但是其实都是非常值得学习的。有了这些基础，我们才能理解如何写OpenGL，从上一篇文章中我们知道，开发OpenGL大部分工作都是在Renderer类上面，我直接粘Renderder代码：

/**
 * Package com.hc.opengl
 * Created by HuaChao on 2016/7/28.
 */
public class GLRenderer implements GLSurfaceView.Renderer {
    private float[] mTriangleArray = {
            0f, 1f, 0f,
            -1f, -1f, 0f,
            1f, -1f, 0f
    };
    //三角形各顶点颜色(三个顶点)
    private float[] mColor = new float[]{
            1, 1, 0, 1,
            0, 1, 1, 1,
            1, 0, 1, 1
    };
    private FloatBuffer mTriangleBuffer;
    private FloatBuffer mColorBuffer;


    public GLRenderer() {
        //点相关
        //先初始化buffer，数组的长度*4，因为一个float占4个字节
        ByteBuffer bb = ByteBuffer.allocateDirect(mTriangleArray.length * 4);
        //以本机字节顺序来修改此缓冲区的字节顺序
        bb.order(ByteOrder.nativeOrder());
        mTriangleBuffer = bb.asFloatBuffer();
        //将给定float[]数据从当前位置开始，依次写入此缓冲区
        mTriangleBuffer.put(mTriangleArray);
        //设置此缓冲区的位置。如果标记已定义并且大于新的位置，则要丢弃该标记。
        mTriangleBuffer.position(0);


        //颜色相关
        ByteBuffer bb2 = ByteBuffer.allocateDirect(mColor.length * 4);
        bb2.order(ByteOrder.nativeOrder());
        mColorBuffer = bb2.asFloatBuffer();
        mColorBuffer.put(mColor);
        mColorBuffer.position(0);
    }

    @Override
    public void onDrawFrame(GL10 gl) {


        // 清除屏幕和深度缓存
        gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);
        // 重置当前的模型观察矩阵
        gl.glLoadIdentity();

        // 允许设置顶点
        //GL10.GL_VERTEX_ARRAY顶点数组
        gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
        // 允许设置颜色
        //GL10.GL_COLOR_ARRAY颜色数组
        gl.glEnableClientState(GL10.GL_COLOR_ARRAY);

        //将三角形在z轴上移动
        gl.glTranslatef(0f, 0.0f, -2.0f);

        // 设置三角形
        gl.glVertexPointer(3, GL10.GL_FLOAT, 0, mTriangleBuffer);
        // 设置三角形颜色
        gl.glColorPointer(4, GL10.GL_FLOAT, 0, mColorBuffer);
        // 绘制三角形
        gl.glDrawArrays(GL10.GL_TRIANGLES, 0, 3);


        // 取消颜色设置
        gl.glDisableClientState(GL10.GL_COLOR_ARRAY);
        // 取消顶点设置
        gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);

        //绘制结束
        gl.glFinish();

    }

    @Override
    public void onSurfaceChanged(GL10 gl, int width, int height) {
        float ratio = (float) width / height;
        // 设置OpenGL场景的大小,(0,0)表示窗口内部视口的左下角，(w,h)指定了视口的大小
        gl.glViewport(0, 0, width, height);
        // 设置投影矩阵
        gl.glMatrixMode(GL10.GL_PROJECTION);
        // 重置投影矩阵
        gl.glLoadIdentity();
        // 设置视口的大小
        gl.glFrustumf(-ratio, ratio, -1, 1, 1, 10);
        //以下两句声明，以后所有的变换都是针对模型(即我们绘制的图形)
        gl.glMatrixMode(GL10.GL_MODELVIEW);
        gl.glLoadIdentity();

    }

    @Override
    public void onSurfaceCreated(GL10 gl, EGLConfig config) {
        // 设置白色为清屏
        gl.glClearColor(1, 1, 1, 1);

    }
}

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103

效果如下：

5 几个重要的函数

5.1 glVertexPointer()

其实就是设置一个指针，这个指针指向顶点数组，后面绘制三角形（或矩形）根据这里指定的顶点数组来读取数据。 
函数原型如下：

void glVertexPointer(int size,int type,int stride,Buffer pointer)
 
1

其中：

• size: 每个顶点有几个数值描述。必须是2，3 ，4 之一。
• type: 数组中每个顶点的坐标类型。取值：GL_BYTE,GL_SHORT, GL_FIXED, GL_FLOAT。
• stride：数组中每个顶点间的间隔，步长（字节位移）。取值若为0，表示数组是连续的
• pointer：即存储顶点的Buffer

5.2 glColorPointer()

跟上面类似，只是设定指向颜色数组的指针。 
函数原型：

void glColorPointer(
        int size,
        int type,
        int stride,
        java.nio.Buffer pointer
    );
 
1
2
3
4
5
6

• size: 每种颜色组件的数量。 值必须为 3 或 4。
• type: 颜色数组中的每个颜色分量的数据类型。 使用下列常量指定可接受的数据类型：GL_BYTE GL_UNSIGNED_BYTE，GL_SHORTGL_UNSIGNED_SHORT，GL_INT GL_UNSIGNED_INT，GL_FLOAT，或 GL_DOUBLE。
• stride：连续颜色之间的字节偏移量。 当偏移量为0时，表示数据是连续的。
• pointer：即颜色的Buffer

5.3 glDrawArrays()

绘制数组里面所有点构成的各个三角片。

函数原型:

void glDrawArrays(
    int mode,
    int first,
    int count
);
 
1
2
3
4
5

其中：

• mode：有三种取值 
  
  • GL_TRIANGLES：每三个顶之间绘制三角形，之间不连接
  • GL_TRIANGLE_FAN：以V0 V1 V2,V0 V2 V3,V0 V3 V4，……的形式绘制三角形
  • GL_TRIANGLE_STRIP：顺序在每三个顶点之间均绘制三角形。这个方法可以保证从相同的方向上所有三角形均被绘制。以V0 V1 V2 ,V1 V2 V3,V2 V3 V4,……的形式绘制三角形
• first：从数组缓存中的哪一位开始绘制，一般都定义为0
• count：顶点的数量

相关资料：

【三维变换glMatrixMode】