基本原理
1. 多次繪制，單紋理單元
之前我們在第三節(jié)基礎(chǔ)圖形繪制的時(shí)候有推導(dǎo)出一個(gè)結(jié)論：
上面的示例圖中严衬，在onDrawFrame里笆呆，同時(shí)繪制了點(diǎn)、線腰奋、三角形劣坊，也就是多次調(diào)用glDrawArrays嘀倒，并且繪制出來了局冰。 我們暫時(shí)定義glDrawArrays是進(jìn)行一次圖元組裝康二，也就是繪制一個(gè)圖層，那么一次onDrawFrame只繪制一幀沫勿，而這一幀可以繪制多種圖元味混，多個(gè)圖層诫惭。 也就是：一次只繪制一幀，但是一幀可以繪制多個(gè)圖層馆衔。
所以我們要繪制多個(gè)紋理怨绣，可以通過多次調(diào)用glDrawArrays繪制紋理頂點(diǎn)的方式來實(shí)現(xiàn)。這樣就是一張一張圖片按先后順序篮撑，一層一層地畫到當(dāng)前的一幀畫面上去。
2. 單次繪制邪财，多紋理單元
上一節(jié)紋理繪制講到质欲，OpenGL中可以同時(shí)操作的紋理單元是16個(gè)，那么我們可以利用多個(gè)紋理單元來進(jìn)行繪制同一個(gè)圖層怎憋，從而達(dá)到目的九昧。
代碼實(shí)現(xiàn)
單紋理單元
init {
// 加載2個(gè)頂點(diǎn)坐標(biāo)數(shù)據(jù)，避免繪制2個(gè)紋理重疊
mVertexData = BufferUtil.createFloatBuffer(POINT_DATA)
mVertexData2 = BufferUtil.createFloatBuffer(POINT_DATA2)
mTexVertexBuffer = BufferUtil.createFloatBuffer(TEX_VERTEX)
}
override fun onSurfaceCreated(gl: GL10?, config: EGLConfig?) {
// 加載2個(gè)紋理數(shù)據(jù)
mTextureBean = TextureHelper.loadTexture(context, R.drawable.pikachu)
mTextureBean2 = TextureHelper.loadTexture(context, R.drawable.tuzki)
}
override fun onDrawFrame(glUnused: GL10) {
GLES20.glClear(GL10.GL_COLOR_BUFFER_BIT)
drawPikachu()
drawTuzki()
}
private fun drawPikachu() {
mVertexData.position(0)
GLES20.glVertexAttribPointer(mAPositionLocation, POSITION_COMPONENT_COUNT,
GLES20.GL_FLOAT, false, 0, mVertexData)
GLES20.glEnableVertexAttribArray(mAPositionLocation)
// 設(shè)置當(dāng)前活動(dòng)的紋理單元為紋理單元0
GLES20.glActiveTexture(GLES20.GL_TEXTURE0)
// 將紋理ID綁定到當(dāng)前活動(dòng)的紋理單元上
GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, mTextureBean!!.textureId)
GLES20.glUniform1i(uTextureUnitLocation, 0)
GLES20.glDrawArrays(GLES20.GL_TRIANGLE_FAN, 0, POINT_DATA.size / POSITION_COMPONENT_COUNT)
}
private fun drawTuzki() {
mVertexData2.position(0)
GLES20.glVertexAttribPointer(mAPositionLocation, POSITION_COMPONENT_COUNT,
GLES20.GL_FLOAT, false, 0, mVertexData2)
GLES20.glEnableVertexAttribArray(mAPositionLocation)
// 綁定新的紋理ID到已激活的紋理單元上
GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, mTextureBean2!!.textureId)
GLES20.glDrawArrays(GLES20.GL_TRIANGLE_FAN, 0, POINT_DATA.size / POSITION_COMPONENT_COUNT)
}
代碼和上一節(jié)基本相同癌别，Shader文件不變蹋笼，最大的區(qū)別在onDrawFrame的時(shí)候，綁了2次紋理圾笨，調(diào)用了2次glDrawArrays繪制不同的紋理逊谋。
多紋理單元
precision mediump float;
varying vec2 v_TexCoord;
uniform sampler2D u_TextureUnit1;
uniform sampler2D u_TextureUnit2;
void main() {
vec4 texture1 = texture2D(u_TextureUnit1, v_TexCoord);
vec4 texture2 = texture2D(u_TextureUnit2, v_TexCoord);
if (texture1.a != 0.0) {
gl_FragColor = texture1;
} else {
gl_FragColor = texture2;
}
}
通過上面這樣設(shè)置Fragment，就可以實(shí)現(xiàn)紋理1和紋理2的疊加效果控制板鬓。
接下來再講解下如何綁定多個(gè)紋理單元的相關(guān)信息。
private fun drawPikachu() {
GLES20.glActiveTexture(GLES20.GL_TEXTURE0)
GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, pikachuBean!!.textureId)
GLES20.glUniform1i(textureLocation1, 0)
}
private fun drawTuzki() {
GLES20.glActiveTexture(GLES20.GL_TEXTURE1)
GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, tuzkiBean!!.textureId)
GLES20.glUniform1i(textureLocation2, 1)
}
這種方式的優(yōu)點(diǎn)是可以控制多個(gè)紋理的關(guān)系镀迂，做出復(fù)雜的效果唤蔗。缺點(diǎn)是多個(gè)紋理單元的頂點(diǎn)坐標(biāo)必須是一樣的窟赏。
拓展閱讀
參考
見Android OpenGL ES學(xué)習(xí)資料所列舉的博客、資料棍掐。
GitHub代碼工程
本系列課程所有相關(guān)代碼請參考我的GitHub項(xiàng)目GLStudio拷况。
課程目錄
本系列課程目錄詳見 簡書 - Android OpenGL ES教程規(guī)劃
