注:本文翻譯自Google官方的Android Developers Training文檔,譯者技術一般,由于喜愛安卓而產生了翻譯的念頭,純屬個人興趣愛好。
原文鏈接: http://developer.android.com/training/graphics/opengl/draw.html
在你定義了需要OpenGL繪制的形狀之后,你可能希望繪制它們。使用OpenGL ES 2.0繪制圖形可能會比你想象當中花費更多的代碼,因為API中提供了大量對于圖形處理流程的控制。
這節課將解釋如何使用OpenGL ES 2.0接口畫出在上一節課中定義的圖形。
一). 初始化形狀
在你開始繪畫之前,你需要初始化并加載你期望繪制的圖形。除非你所使用的形狀結構(原始坐標)在執行過程中發生了變化,不然的話你應該在渲染器的 onSurfaceCreated() 方法中初始化它們,這樣做是處于內存和執行效率的考量。
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程式當中,它用來繪制形狀。下面的代碼展示了你可以用來畫一個圖形的基本著色器:
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程式對象中,然后執行連接。在你的繪制對象的構造函數里做這些事情,這樣上述步驟就只用執行一次。
Note:
編譯OpenGL ES著色器及連接操作對于CPU周期和處理時間而言,消耗是巨大的,所以你應該避免重復執行這些事情。如果你在執行期間不知道你的著色器內容,那么你應該在構建你的應用時,確保它們值創建了一次,并且緩存以備后續使用。
public class Triangle() { ... int vertexShader = loadShader(GLES20.GL_VERTEX_SHADER, vertexShaderCode); int fragmentShader = loadShader(GLES20.GL_FRAGMENT_SHADER, fragmentShaderCode); mProgram = GLES20.glCreateProgram(); // create empty OpenGL ES Program GLES20.glAttachShader(mProgram, vertexShader); // add the vertex shader to program GLES20.glAttachShader(mProgram, fragmentShader); // add the fragment shader to program GLES20.glLinkProgram(mProgram); // creates OpenGL ES program executables }
至此,你已經完全準備好添加實際的調用來繪制你的圖形了。使用OpenGl ES繪制圖形需要你定義一些變量來告訴渲染流程你需要畫什么以及如何去畫。既然繪制屬性會根據形狀的不同而發生變化,把繪制邏輯包含在形狀類里面將是一個不錯的主意。
為圖形創建一個“ draw() ”方法。這個代碼為形狀的頂點著色器和形狀著色器設置了位置和顏色值,進而執行繪圖功能:
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()方法就可以了。當你運行這個應用時,它看上去會像是這樣:
圖1. 不使用投影或者相機視圖畫出來的三角形
在這個代碼樣例中,還存在一些問題。首先,它無法給你的朋友帶來什么深刻的印象。其次,這個三角形看上去有一些扁,另外當你改變屏幕方向時,它的形狀也會隨之改變。形狀發生形變的原因是因為對象的頂點沒有根據顯示 GLSurfaceView 的屏幕區域的比例進行修正。你可以在下一節課中使用投影(projection)或者相機視圖(camera view)來解決這個問題。
最后,這個三角形是靜止的,這看上去有些無聊。在 Adding Motion 課程當中(后續課程),你會讓這個形狀發生旋轉,并使用一些OpenGL ES圖形處理流程的更加新奇的用法。
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索:z360901061

微信掃一掃加我為好友
QQ號聯系: 360901061
您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對您有幫助就好】元
