開始正式學(xué)習(xí)OpenGL ES開發(fā)！
本博客是我在學(xué)習(xí)過程中做的記錄右蹦，也希望和各位分享我的學(xué)習(xí)過程诊杆，如有錯誤，歡迎留言指正何陆，共同學(xué)習(xí)晨汹。
定義輸入坐標(biāo)
開始繪制圖形之前，我們必須先給OpenGL輸入一些頂點數(shù)據(jù)甲献。OpenGL是一個3D圖形庫宰缤，所以我們在OpenGL中指定的所有坐標(biāo)都是3D坐標(biāo)（x、y和z）晃洒。OpenGL不是簡單地把所有的3D坐標(biāo)變換為屏幕上的2D像素；OpenGL僅當(dāng)3D坐標(biāo)在3個軸（x朦乏、y和z）上都為-1.0到1.0的范圍內(nèi)時才處理它球及。所有在所謂的標(biāo)準(zhǔn)化設(shè)備坐標(biāo)(Normalized Device Coordinates)范圍內(nèi)的坐標(biāo)才會最終呈現(xiàn)在屏幕上（在這個范圍以外的坐標(biāo)都不會顯示）。
由于我們希望渲染一個三角形呻疹，我們一共要指定三個頂點吃引，每個頂點都有一個3D位置。我們會將它們以標(biāo)準(zhǔn)化設(shè)備坐標(biāo)的形式（OpenGL的可見區(qū)域）定義為一個float數(shù)組刽锤。
private float[] vertexPoints = new float[]{
0.0f, 0.5f, 0.0f,
-0.5f, -0.5f, 0.0f,
0.5f, -0.5f, 0.0f
};
由于OpenGL是在3D空間中工作的镊尺，而我們渲染的是一個2D三角形，我們將它頂點的z坐標(biāo)設(shè)置為0.0并思。這樣子的話三角形每一點的深度都是一樣的庐氮，從而使它看上去像是2D的。
定義這樣的頂點數(shù)據(jù)以后宋彼，我們會把它作為輸入發(fā)送給圖形渲染管線的第一個處理階段：頂點著色器弄砍。它會在GPU上創(chuàng)建內(nèi)存用于儲存我們的頂點數(shù)據(jù)，還要配置OpenGL如何解釋這些內(nèi)存输涕，并且指定其如何發(fā)送給顯卡音婶。頂點著色器接著會處理我們在內(nèi)存中指定數(shù)量的頂點。
一旦你的頂點坐標(biāo)已經(jīng)在頂點著色器中處理過莱坎，它們就應(yīng)該是標(biāo)準(zhǔn)化設(shè)備坐標(biāo)了衣式，標(biāo)準(zhǔn)化設(shè)備坐標(biāo)是一個x、y和z值在-1.0到1.0的一小段空間。任何落在范圍外的坐標(biāo)都會被丟棄/裁剪碴卧，不會顯示在你的屏幕上弱卡。下面你會看到我們定義的在標(biāo)準(zhǔn)化設(shè)備坐標(biāo)中的三角形(忽略z軸)：
與通常的屏幕坐標(biāo)不同，y軸正方向為向上螟深，(0, 0)坐標(biāo)是這個圖像的中心谐宙，而不是左上角。最終你希望所有(變換過的)坐標(biāo)都在這個坐標(biāo)空間中界弧，否則它們就不可見了凡蜻。
分配本地內(nèi)存
因為OpenGL作為本地系統(tǒng)庫運行在系統(tǒng)中，虛擬機需要分配本地內(nèi)存垢箕，供其存取划栓。
public SimpleRenderer() {
//分配內(nèi)存空間,每個浮點型占4字節(jié)空間
vertexBuffer = ByteBuffer.allocateDirect(vertexPoints.length * 4)
.order(ByteOrder.nativeOrder())
.asFloatBuffer();
//傳入指定的坐標(biāo)數(shù)據(jù)
vertexBuffer.put(vertexPoints);
vertexBuffer.position(0);
}
頂點著色器
/**
* 頂點著色器
*/
private String vertextShader =
"#version 300 es\n" +
"layout (location = 0) in vec4 vPosition;\n" +
"void main() {\n" +
" gl_Position = vPosition;\n" + //
" gl_PointSize = 10.0;\n" +
"}\n";
輸入屬性的數(shù)組(一個名為vPosition的4分量向量)，layout (location = 0)表示這個變量的位置是頂點屬性0条获。
將vPosition輸入屬性拷貝到名為gl_Position的特殊輸出變量忠荞。
將浮點數(shù)據(jù)10.0拷貝到gl_PointSize的變量中。
片段著色器
/**
* 片段著色器
*/
private String fragmentShader =
"#version 300 es\n" +
"precision mediump float;\n" +
"out vec4 fragColor;\n" +
"void main() {\n" +
" fragColor = vec4(1.0,1.0,1.0,1.0);\n" +
"}\n";
聲明著色器中浮點變量的默認(rèn)精度帅掘。
著色器聲明一個輸出變量fragColor委煤，這個是一個4分量的向量。
表示將顏色值(1.0,1.0,1.0,1.0)修档，輸出到顏色緩沖區(qū)碧绞。
編譯著色器
/**
* 編譯
*
* @param type 頂點著色器:GLES30.GL_VERTEX_SHADER
* 片段著色器:GLES30.GL_FRAGMENT_SHADER
*/
private static int compileShader(int type, String shaderCode) {
//創(chuàng)建一個著色器
final int shaderId = GLES30.glCreateShader(type);
if (shaderId != 0) {
//加載到著色器
GLES30.glShaderSource(shaderId, shaderCode);
//編譯著色器
GLES30.glCompileShader(shaderId);
//檢測狀態(tài)
final int[] compileStatus = new int[1];
GLES30.glGetShaderiv(shaderId, GLES30.GL_COMPILE_STATUS, compileStatus, 0);
if (compileStatus[0] == 0) {
String logInfo = GLES30.glGetShaderInfoLog(shaderId);
System.err.println(logInfo);
//創(chuàng)建失敗
GLES30.glDeleteShader(shaderId);
return 0;
}
return shaderId;
} else {
//創(chuàng)建失敗
return 0;
}
}
創(chuàng)建 OpenGL 程序和著色器鏈接
/**
* 鏈接
*
* @param vertexShaderId 頂點著色器
* @param fragmentShaderId 片段著色器
*/
public static int linkProgram(int vertexShaderId, int fragmentShaderId) {
final int programId = GLES30.glCreateProgram();
if (programId != 0) {
//將頂點著色器加入到程序
GLES30.glAttachShader(programId, vertexShaderId);
//將片元著色器加入到程序中
GLES30.glAttachShader(programId, fragmentShaderId);
//鏈接著色器程序
GLES30.glLinkProgram(programId);
final int[] linkStatus = new int[1];
//驗證OpenGL程序是否可用
GLES30.glGetProgramiv(programId, GLES30.GL_LINK_STATUS, linkStatus, 0);
if (linkStatus[0] == 0) {
String logInfo = GLES30.glGetProgramInfoLog(programId);
System.err.println(logInfo);
GLES30.glDeleteProgram(programId);
return 0;
}
return programId;
} else {
//創(chuàng)建失敗
return 0;
}
}
繪制
準(zhǔn)備工作結(jié)束，下來就開始繪制圖形了吱窝。
public class SimpleRenderer implements GLSurfaceView.Renderer
實現(xiàn)GLSurfaceView.Renderer接口
onSurfaceCreated
@Override
public void onSurfaceCreated(GL10 gl10, EGLConfig eglConfig) {
//設(shè)置背景顏色
GLES30.glClearColor(0.5f, 0.5f, 0.5f, 0.5f);
// 編譯頂點著色器
final int vertexShaderId = compileShader(GLES30.GL_VERTEX_SHADER, vertextShader);
// 編譯片段著色器
final int fragmentShaderId = compileShader(GLES30.GL_FRAGMENT_SHADER, fragmentShader);
//在OpenGLES環(huán)境中使用程序
GLES30.glUseProgram(linkProgram(vertexShaderId, fragmentShaderId));
}
onSurfaceChanged
@Override
public void onSurfaceChanged(GL10 gl10, int width, int height) {
//設(shè)置視圖窗口
GLES30.glViewport(0, 0, width, height);
}
onDrawFrame
@Override
public void onDrawFrame(GL10 gl10) {
//把顏色緩沖區(qū)設(shè)置為我們預(yù)設(shè)的顏色
GLES30.glClear(GLES30.GL_COLOR_BUFFER_BIT);
//準(zhǔn)備坐標(biāo)數(shù)據(jù)
GLES30.glVertexAttribPointer(0, 3, GLES30.GL_FLOAT, false, 0, vertexBuffer);
//啟用頂點的句柄
GLES30.glEnableVertexAttribArray(0);
//繪制三個點
// GLES30.glDrawArrays(GLES30.GL_POINTS, 0, 3);
//繪制直線
// GLES30.glDrawArrays(GLES30.GL_LINE_STRIP, 0, 2);
// GLES30.glLineWidth(10);
//繪制三角形
GLES30.glDrawArrays(GLES30.GL_TRIANGLES, 0, 3);
//禁止頂點數(shù)組的句柄
GLES30.glDisableVertexAttribArray(0);
}
點 GLES30.GL_POINTS
線 GLES30.GL_LINE_STRIP
三角形 GLES30.GL_TRIANGLES
通過glDrawArrays方法來執(zhí)行最后的繪制讥邻，GL_POINTS代表繪制的類型（圖元類型），而參數(shù)0院峡，1則代表繪制的點的范圍兴使，它是一個左閉右開的區(qū)間。
常用圖元類型
| 圖元類型 | 描述 |
|---|---|
| GL_POINTS | 點精靈圖元照激，對指定的每個頂點進(jìn)行繪制发魄。 |
| GL_LINES | 繪制一系列不相連的線段。 |
| GL_LINE_STRIP | 繪制一系列相連的線段实抡。 |
| GL_LINE_LOOP | 繪制一系列相連的線段欠母，首尾相連。 |
| GL_TRIANGLES | 繪制一系列單獨的三角形吆寨。 |
| GL_TRIANGLE_STRIP | 繪制一系列相互連接的三角形赏淌。 |
| GL_TRIANGLE_FAN | 繪制一系列相互連接的三角形 |
完整代碼
public class SimpleRenderer implements GLSurfaceView.Renderer {
private float[] vertexPoints = new float[]{
0.0f, 0.5f, 0.0f,
-0.5f, -0.5f, 0.0f,
0.5f, -0.5f, 0.0f
};
private final FloatBuffer vertexBuffer;
/**
* 頂點著色器
*/
private String vertextShader =
"#version 300 es\n" +
"layout (location = 0) in vec4 vPosition;\n" +
"void main() {\n" +
" gl_Position = vPosition;\n" +
" gl_PointSize = 10.0;\n" +
"}\n";
/**
* 片段著色器
*/
private String fragmentShader =
"#version 300 es\n" +
"precision mediump float;\n" +
"out vec4 fragColor;\n" +
"void main() {\n" +
" fragColor = vec4(1.0,1.0,1.0,1.0);\n" +
"}\n";
public SimpleRenderer() {
//分配內(nèi)存空間,每個浮點型占4字節(jié)空間
vertexBuffer = ByteBuffer.allocateDirect(vertexPoints.length * 4)
.order(ByteOrder.nativeOrder())
.asFloatBuffer();
//傳入指定的坐標(biāo)數(shù)據(jù)
vertexBuffer.put(vertexPoints);
vertexBuffer.position(0);
}
@Override
public void onSurfaceCreated(GL10 gl10, EGLConfig eglConfig) {
GLES30.glClearColor(0f, 0f, 0f, 0f);
final int vertexShaderId = compileShader(GLES30.GL_VERTEX_SHADER, vertextShader);
final int fragmentShaderId = compileShader(GLES30.GL_FRAGMENT_SHADER, fragmentShader);
GLES30.glUseProgram(linkProgram(vertexShaderId, fragmentShaderId));
}
@Override
public void onSurfaceChanged(GL10 gl10, int width, int height) {
GLES30.glViewport(0, 0, width, height);
}
@Override
public void onDrawFrame(GL10 gl10) {
GLES30.glClear(GLES30.GL_COLOR_BUFFER_BIT);
//準(zhǔn)備坐標(biāo)數(shù)據(jù)
GLES30.glVertexAttribPointer(0, 3, GLES30.GL_FLOAT, false, 0, vertexBuffer);
//啟用頂點的句柄
GLES30.glEnableVertexAttribArray(0);
//繪制三個點
GLES30.glDrawArrays(GLES30.GL_LINE_LOOP, 0, 3);
//繪制直線
// GLES30.glDrawArrays(GLES30.GL_LINE_STRIP, 0, 2);
// GLES30.glLineWidth(10);
//繪制三角形
// GLES30.glDrawArrays(GLES30.GL_TRIANGLES, 0, 3);
//禁止頂點數(shù)組的句柄
GLES30.glDisableVertexAttribArray(0);
}
/**
* 編譯
*/
private static int compileShader(int type, String shaderCode) {
//創(chuàng)建一個著色器
final int shaderId = GLES30.glCreateShader(type);
if (shaderId != 0) {
//加載到著色器
GLES30.glShaderSource(shaderId, shaderCode);
//編譯著色器
GLES30.glCompileShader(shaderId);
//檢測狀態(tài)
final int[] compileStatus = new int[1];
GLES30.glGetShaderiv(shaderId, GLES30.GL_COMPILE_STATUS, compileStatus, 0);
if (compileStatus[0] == 0) {
String logInfo = GLES30.glGetShaderInfoLog(shaderId);
System.err.println(logInfo);
//創(chuàng)建失敗
GLES30.glDeleteShader(shaderId);
return 0;
}
return shaderId;
} else {
//創(chuàng)建失敗
return 0;
}
}
/**
* 鏈接
*/
public static int linkProgram(int vertexShaderId, int fragmentShaderId) {
final int programId = GLES30.glCreateProgram();
if (programId != 0) {
//將頂點著色器加入到程序
GLES30.glAttachShader(programId, vertexShaderId);
//將片元著色器加入到程序中
GLES30.glAttachShader(programId, fragmentShaderId);
//鏈接著色器程序
GLES30.glLinkProgram(programId);
final int[] linkStatus = new int[1];
GLES30.glGetProgramiv(programId, GLES30.GL_LINK_STATUS, linkStatus, 0);
if (linkStatus[0] == 0) {
String logInfo = GLES30.glGetProgramInfoLog(programId);
System.err.println(logInfo);
GLES30.glDeleteProgram(programId);
return 0;
}
return programId;
} else {
//創(chuàng)建失敗
return 0;
}
}
}
public class MainActivity extends AppCompatActivity {
private GLSurfaceView mGLSurfaceView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setupViews();
}
private void setupViews() {
mGLSurfaceView = new GLSurfaceView(this);
setContentView(mGLSurfaceView);
mGLSurfaceView.setEGLContextClientVersion(3);
GLSurfaceView.Renderer renderer = new SimpleRenderer();
mGLSurfaceView.setRenderer(renderer);
}
}
參考：
《OpenGL ES 3.0 編程指南第2版》
《OpenGL 編程指南》（原書第八版）
《OpenGL ES應(yīng)用開發(fā)實踐指南Android卷》
