【Android】OpenGL ES入门

概述:OpenGL 是Open Graphics Library的简称,ES是Embedded Systems的简称,连起来就是针对嵌入式系统的开源图形库。

看下OpenGL ES 的api版本和安卓系统版本的对照:
OpenGL ES 1.0 and 1.1 - This API specification is supported by Android 1.0 and higher.
OpenGL ES 2.0 - This API specification is supported by Android 2.2 (API level 8) and higher.
OpenGL ES 3.0 - This API specification is supported by Android 4.3 (API level 18) and higher.
OpenGL ES 3.1 - This API specification is supported by Android 5.0 (API level 21) and higher.

讲解:Android框架中有两个基础类,可让您使用OpenGL ES API创建和操作图形:GLSurfaceView(https://developer.android.com/reference/android/opengl/GLSurfaceView.html)和GLSurfaceView.Renderer(https://developer.android.com/reference/android/opengl/GLSurfaceView.Renderer.html)。

1.GLSurfaceView这个类是一个View(https://developer.android.com/reference/android/view/View.html)可以使用OpenGL API调用绘制和操作对象的类,在功能上类似于SurfaceView(https://developer.android.com/reference/android/view/SurfaceView.html)

2.GLSurfaceView.Renderer(https://developer.android.com/reference/android/opengl/GLSurfaceView.Renderer.html)

此接口定义了在a中绘制图形所需的方法GLSurfaceView(https://developer.android.com/reference/android/opengl/GLSurfaceView.html)。您必须将此接口的实现作为单独的类提供,并GLSurfaceView(https://developer.android.com/reference/android/opengl/GLSurfaceView.html)使用它将其附加到您的实例 GLSurfaceView.setRenderer()(https://developer.android.com/reference/android/opengl/GLSurfaceView.html#setRenderer(android.opengl.GLSurfaceView.Renderer))`。

GLSurfaceView.Renderer(https://developer.android.com/reference/android/opengl/GLSurfaceView.Renderer.html)接口要求您实现以下方法:

  • onSurfaceCreated():系统在创建时调用此方法一次GLSurfaceView使用此方法执行仅需要发生一次的操作,例如设置OpenGL环境参数或初始化OpenGL图形对象。
  • onDrawFrame():系统在每次重绘时调用此方法GLSurfaceView。使用此方法作为绘制(和重新绘制)图形对象的主要执行点。
  • onSurfaceChanged():系统在GLSurfaceView几何图形更改时调用此方法,包括更GLSurfaceView设备屏幕的大小或方向。例如,当设备从纵向更改为横向时,系统会调用此方法。使用此方法响应GLSurfaceView容器中的更改。

使用前,需在清单文件里声明,这里我们使用ES2.0,如下:
<uses-feature android:glEsVersion="0x00020000" android:required="true" />

OpenGL的坐标系以屏幕中心点为原点

image.png

简单示例:

public class OpenGLES20Activity extends Activity {

    private GLSurfaceView mGLView;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // Create a GLSurfaceView instance and set it
        // as the ContentView for this Activity.
        mGLView = new MyGLSurfaceView(this);
        setContentView(mGLView);
    }
}

class MyGLSurfaceView extends GLSurfaceView {

    private final MyGLRenderer mRenderer;

    public MyGLSurfaceView(Context context){
        super(context);

        // Create an OpenGL ES 2.0 context
        setEGLContextClientVersion(2);

        mRenderer = new MyGLRenderer();

        // Set the Renderer for drawing on the GLSurfaceView
        setRenderer(mRenderer);
    }
}
public class MyGLRenderer implements GLSurfaceView.Renderer {

    public void onSurfaceCreated(GL10 unused, EGLConfig config) {
        // Set the background frame color
        GLES20.glClearColor(0.0f, 0.0f, 0.0f, 1.0f);
    }

    public void onDrawFrame(GL10 unused) {
        // Redraw background color
        GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT);
    }

    public void onSurfaceChanged(GL10 unused, int width, int height) {
        GLES20.glViewport(0, 0, width, height);
    }
}

上面三段代码准备好,开始写关键部分图形绘制的bean

画一个形状

使用OpenGL ES 2.0绘制定义的形状需要大量代码,因为您必须向图形渲染管道提供大量细节。具体而言,您必须定义以下内容:

  • 顶点着色器Vertex Shader - 用于渲染形状顶点的OpenGL ES图形代码。
  • Fragment Shader - OpenGL ES代码,用于渲染具有颜色或纹理的形状的面。
  • 程序 Program - 一个OpenGL ES对象,包含要用于绘制一个或多个形状的着色器。

至少一个顶点着色器来绘制形状,并使用一个片段着色器为该形状着色。必须编译这些着色器,然后将其添加到OpenGL ES程序中,然后使用该程序绘制形状。以下是如何定义可用于在Triangle类中绘制形状的基本着色器的示例 :

public class Triangle {
    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

    private final int mProgram;
    private FloatBuffer vertexBuffer;
    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;" +
                    "}";

    // number of coordinates per vertex in this array
    static final int COORDS_PER_VERTEX = 3;
    static float triangleCoords[] = {   // in counterclockwise order:
            0.0f,  0.622008459f, 0.0f, // top
            -0.5f, -0.311004243f, 0.0f, // bottom left
            0.5f, -0.311004243f, 0.0f  // bottom right
    };

    // Set color with red, green, blue and alpha (opacity) values
    float color[] = { 0.63671875f, 0.76953125f, 0.22265625f, 1.0f };

    public Triangle() {
        // initialize vertex byte buffer for shape coordinates
        ByteBuffer bb = ByteBuffer.allocateDirect(
                // (number of coordinate values * 4 bytes per float)
                triangleCoords.length * 4);
        // use the device hardware's native byte order
        bb.order(ByteOrder.nativeOrder());

        // create a floating point buffer from the ByteBuffer
        vertexBuffer = bb.asFloatBuffer();
        // add the coordinates to the FloatBuffer
        vertexBuffer.put(triangleCoords);
        // set the buffer to read the first coordinate
        vertexBuffer.position(0);
        int vertexShader = MyGLSurfaceView.MyGLRenderer.loadShader(GLES20.GL_VERTEX_SHADER,
                vertexShaderCode);
        int fragmentShader = MyGLSurfaceView.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);
    }

    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);
    }
}

定义好图形,我们在GlSurfaceView里面初始化,在onDrawFrame方法里面调用onDraw()

public class MyGLRenderer implements GLSurfaceView.Renderer {

    .
    private Triangle mTriangle;


    public void onSurfaceCreated(GL10 unused, EGLConfig config) {
      
        mTriangle = new Triangle();
      
    }
   public void onDrawFrame(GL10 unused) {
   
    mTriangle.draw();
} 
}

运行起来就得到下面的图像:

image.png

此代码示例存在一些问题。首先,它不会打动你的朋友。其次,当您更改设备的屏幕方向时,三角形会被压扁并改变形状。形状偏斜的原因是由于对象的顶点尚未针对GLSurfaceView (https://developer.android.com/reference/android/opengl/GLSurfaceView.html)`
显示的屏幕区域的比例进行校正 。有时间再写下使用投影和相机视图解决该问题。

最后,三角形是静止的,这有点无聊。在“ 添加运动”课程中,您可以使此形状旋转并更有趣地使用OpenGL ES图形管道。
感谢阅读!

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 205,132评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,802评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,566评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,858评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,867评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,695评论 1 282
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,064评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,705评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 42,915评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,677评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,796评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,432评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,041评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,992评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,223评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,185评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,535评论 2 343

推荐阅读更多精彩内容

  • 官方文档地址 Android包含Open Graphics Library(OpenGL®)库,特别是OpenGL...
    sjj_dot阅读 2,689评论 0 10
  • OpenGL ES Android包含支持高性能2D和3D图形绘制开源库(OpenGL),尤其是OpenGL ES...
    Ricky_Zeng阅读 3,655评论 0 10
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,472评论 25 707
  • 本文首发于个人博客:Lam's Blog - 【OpenGL ES】入门及绘制一个三角形,文章由MarkDown语...
    格子林ll阅读 7,248评论 2 18
  • 生活不止眼前的苟且,还有诗和远方。远方除了遥远,一无所有。远方一无所有,却能给我安慰。
    弗梧儿阅读 130评论 0 0