绘制形状

编写:jdneo - 原文:http://developer.android.com/training/graphics/opengl/draw.html

在定义了使用OpenGL绘制的形状之后,你可能希望绘制出它们。使用OpenGL ES 2.0绘制图形可能会比你想象当中更复杂一些,因为API中提供了大量对于图形渲染流程的控制。

这节课将解释如何使用OpenGL ES 2.0接口画出在上一节课中定义的形状。

初始化形状

在你开始绘画之前,你需要初始化并加载你期望绘制的图形。除非你所使用的形状结构(原始坐标)在执行过程中发生了变化,不然的话你应该在渲染器的onSurfaceCreated()方法中初始化它们,这样做是出于内存和执行效率的考量。

public class MyGLRenderer implements GLSurfaceView.Renderer {

    ...
private Triangle mTriangle;
private Square mSquare; public void onSurfaceCreated(GL10 unused, EGLConfig config) {
... // initialize a triangle
mTriangle = new Triangle();
// initialize a square
mSquare = new Square();
}
...
}

画一个形状

使用OpenGL ES 2.0画一个定义好的形状需要较多代码,因为你需要提供很多图形渲染流程的细节。具体而言,你必须定义如下几项:

  • 顶点着色器(Vertex Shader):用来渲染形状顶点的OpenGL ES代码。
  • 片段着色器(Fragment Shader):使用颜色或纹理渲染形状表面的OpenGL ES代码。
  • 程式(Program):一个OpenGL ES对象,包含了你希望用来绘制一个或更多图形所要用到的着色器。

你需要至少一个顶点着色器来绘制一个形状,以及一个片段着色器为该形状上色。这些着色器必须被编译然后添加到一个OpenGL ES Program当中,并利用它来绘制形状。下面的代码在Triangle类中定义了基本的着色器,我们可以利用它们绘制出一个图形:

public class Triangle {

    private final String vertexShaderCode =
"attribute vec4 vPosition;" +
"void main() {" +
" gl_Position = vPosition;" +
"}"; private final String fragmentShaderCode =
"precision mediump float;" +
"uniform vec4 vColor;" +
"void main() {" +
" gl_FragColor = vColor;" +
"}"; ...
}

着色器包含了OpenGL Shading Language(GLSL)代码,它必须先被编译然后才能在OpenGL环境中使用。要编译这些代码,需要在你的渲染器类中创建一个辅助方法:

public static int loadShader(int type, String shaderCode){

    // create a vertex shader type (GLES20.GL_VERTEX_SHADER)
// or a fragment shader type (GLES20.GL_FRAGMENT_SHADER)
int shader = GLES20.glCreateShader(type); // add the source code to the shader and compile it
GLES20.glShaderSource(shader, shaderCode);
GLES20.glCompileShader(shader); return shader;
}

为了绘制你的图形,你必须编译着色器代码,将它们添加至一个OpenGL ES Program对象中,然后执行链接。在你的绘制对象的构造函数里做这些事情,这样上述步骤就只用执行一次。

Note:编译OpenGL ES着色器及链接操作对于CPU周期和处理时间而言,消耗是巨大的,所以你应该避免重复执行这些事情。如果在执行期间不知道着色器的内容,那么你应该在构建你的应用时,确保它们只被创建了一次,并且缓存以备后续使用。

public class Triangle() {
... private final int mProgram; public Triangle() {
... int vertexShader = MyGLRenderer.loadShader(GLES20.GL_VERTEX_SHADER,
vertexShaderCode);
int fragmentShader = MyGLRenderer.loadShader(GLES20.GL_FRAGMENT_SHADER,
fragmentShaderCode); // create empty OpenGL ES Program
mProgram = GLES20.glCreateProgram(); // add the vertex shader to program
GLES20.glAttachShader(mProgram, vertexShader); // add the fragment shader to program
GLES20.glAttachShader(mProgram, fragmentShader); // creates OpenGL ES program executables
GLES20.glLinkProgram(mProgram);
}
}

至此,你已经完全准备好添加实际的调用语句来绘制你的图形了。使用OpenGL ES绘制图形需要你定义一些变量来告诉渲染流程你需要绘制的内容以及如何绘制。既然绘制属性会根据形状的不同而发生变化,把绘制逻辑包含在形状类里面将是一个不错的主意。

创建一个draw()方法来绘制图形。下面的代码为形状的顶点着色器和形状着色器设置了位置和颜色值,然后执行绘制函数:

private int mPositionHandle;
private int mColorHandle; private final int vertexCount = triangleCoords.length / COORDS_PER_VERTEX;
private final int vertexStride = COORDS_PER_VERTEX * 4; // 4 bytes per vertex public void draw() {
// Add program to OpenGL ES environment
GLES20.glUseProgram(mProgram); // get handle to vertex shader's vPosition member
mPositionHandle = GLES20.glGetAttribLocation(mProgram, "vPosition"); // Enable a handle to the triangle vertices
GLES20.glEnableVertexAttribArray(mPositionHandle); // Prepare the triangle coordinate data
GLES20.glVertexAttribPointer(mPositionHandle, COORDS_PER_VERTEX,
GLES20.GL_FLOAT, false,
vertexStride, vertexBuffer); // get handle to fragment shader's vColor member
mColorHandle = GLES20.glGetUniformLocation(mProgram, "vColor"); // Set color for drawing the triangle
GLES20.glUniform4fv(mColorHandle, 1, color, 0); // Draw the triangle
GLES20.glDrawArrays(GLES20.GL_TRIANGLES, 0, vertexCount); // Disable vertex array
GLES20.glDisableVertexAttribArray(mPositionHandle);
}

一旦你完成了上述所有代码,仅需要在你渲染器的onDrawFrame()方法中调用draw()方法就可以画出我们想要画的对象了:

public void onDrawFrame(GL10 unused) {
... mTriangle.draw();
}

当你运行这个应用时,它看上去会像是这样:

在这个代码样例中,还存在一些问题。首先,它无法给用户带来什么深刻的印象。其次,这个三角形看上去有一些扁,另外当你改变屏幕方向时,它的形状也会随之改变。发生形变的原因是因为对象的顶点没有根据显示GLSurfaceView的屏幕区域的长宽比进行修正。你可以在下一节课中使用投影(Projection)或者相机视角(Camera View)来解决这个问题。

最后,这个三角形是静止的,这看上去有些无聊。在添加移动课程当中(后续课程),你会让这个形状发生旋转,并使用一些OpenGL ES图形处理流程中更加新奇的用法。

(转)使用OpenGL显示图像(三)绘制Shapes的更多相关文章

  1. iOS OpenGL ES简单绘制三角形

    OpenGL 是用于2D/3D图形编程的一套基于C语言的统一接口. windows,Linux,Unix上均可兼容. OpenGL ES 是在OpenGL嵌入式设备上的版本, android/iOS ...

  2. OpenGL入门学习 课程 (三) 绘制几何图形的一些细节问题

    http://oulehui.blog.163.com/blog/static/79614698201191832753312/ 先回顾一下我们都学习了些什么: 第一课,编写第一个OpenGL程序第二 ...

  3. (转)使用OpenGL显示图像(二)定义Shapes

    定义形状 编写:jdneo - 原文:http://developer.android.com/training/graphics/opengl/shapes.html 在一个OpenGL ES Vi ...

  4. Android OpenGL ES(三)----编程框架

    首先当然是创建Android项目,你可以选择最新的Android Studio也可以选择eclipse都是一样的.我们重点讲解开发OpenGL ES的流程 1.定义顶点着色器和片段着色器 第一节我们讲 ...

  5. Android OpenGL 入门示例----绘制三角形和正方形

    Android上对OpenGl的支持是无缝的,所以才有众多3D效果如此逼真的游戏,在Camera的一些流程中也有用到GLSurfaceView的情况.本文记录OpenGL在Android上的入门级示例 ...

  6. OpenGL实现多层绘制(Layered Rendering) [转]

    http://blog.csdn.net/u010462297/article/details/50589991 引言 在某些情况下会需要用到多层绘制.FBO下有多个颜色挂接点(Color Attac ...

  7. <opengl>使用glu绘制二次曲面

    绘制二次曲面通常要以下四步:   1.首先我们创建一个二次方程状态对象 GLUquadricObj *m_pObj;    //保存绘图模式.法线模式.法线朝向.纹理等信息 //创建二次方程状态对象 ...

  8. OpenGL(三) RGBA颜色设置

    OpenGL支持两种颜色模式:一种是RGBA,一种是颜色索引模式. 像素点附加颜色信息之后,就必须为每一个像素点额外分配一个内存空间保存该点的颜色信息,对于RGBA颜色模式,保存的数据直接代表了颜色, ...

  9. (转)使用OpenGL显示图像(七)Android OpenGLES2.0——纹理贴图之显示图片

    转:http://blog.csdn.net/junzia/article/details/52842816 前面几篇博客,我们将了Android中利用OpenGL ES 2.0绘制各种形体,并在上一 ...

随机推荐

  1. sts bug SpringJUnit4ClassRunner

    SpringJUnit4ClassRunner找不到,不会自动修复, 只能复制引用过去 import org.springframework.test.context.junit4.SpringJUn ...

  2. linux下载文件到本地命令

    版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/mengda_lei/article/de ...

  3. PAT_A1071#Speech Patterns

    Source: PAT A1071 Speech Patterns (25 分) Description: People often have a preference among synonyms ...

  4. Oralce分页

    SELECT *FROM ( SELECT TMP_PAGE.*, ROWNUM ROW_ID FROM ( SELECT A . ID AS "id", A .bill_noti ...

  5. docker-compos联合两个容器

    使用网络 ' services: web: image: http networks: - myappnet1 worker: image: http networks: - myappnet2 db ...

  6. [fw]谈EXPORT_SYMBOL使用

    EXPORT_SYMBOL只出现在2.6内核中,在2.4内核默认的非static 函数和变量都会自动导入到kernel 空间的, 都不用EXPORT_SYMBOL() 做标记的.2.6就必须用EXPO ...

  7. vue中关于checkbox数据绑定v-model

    vue.js为开发者提供了很多便利的指令,其中v-model用于表单的数据绑定很常见, 下面是最常见的例子: <div id='myApp'>     <input type=&qu ...

  8. android pull 解析器解析xml文档

    person.xml <?xml version="1.0" encoding="UTF-8"?> <persons> <pers ...

  9. 回车\r的含义

    package main import "fmt" func main() { // \r 回车,从当前行的最前面开始输出,覆盖掉以前的内容 // 输出:曹操刘备关羽 fmt.Pr ...

  10. html中a标签伪类的优先级与顺序

    /** 这四个伪类的优先级相同,前一个会覆盖后一个 建议书写顺序: lvha => love hate(好记) */ a:link { color: red; } a:visited { col ...