android opengl es 蒙版效果

呃，其实都是纹理的基本使用方法。只是多了下面这两行代码

gl.glBlendFunc(GL10.GL_DST_COLOR, GL10.GL_ZERO);

gl.glBlendFunc(GL10.GL_ONE, GL10.GL_ONE);

不多说了，看代码。

(1)Activity类

 

 

package sim.feel;

import android.app.Activity;
import android.content.res.Resources;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.opengl.GLSurfaceView;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.Window;
import android.view.WindowManager;

public class Mask extends Activity {
    private MyRenderer myRenderer = new MyRenderer();
    private GLSurfaceView glSurfaceView;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // 设置无标题栏
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        // 设置全屏显示
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
                WindowManager.LayoutParams.FLAG_FULLSCREEN);
        LoadImage.load(getResources());
        glSurfaceView = new GLSurfaceView(this);
        glSurfaceView.setRenderer(myRenderer);
        setContentView(glSurfaceView);
    }

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        return myRenderer.onKeyDown(keyCode, event);
    }
}

// 载入图片
class LoadImage {
    public static Bitmap image1;
    public static Bitmap image2;
    public static Bitmap logo;
    public static Bitmap mask1;
    public static Bitmap mask2;

    public static void load(Resources res) {
        image1 = BitmapFactory.decodeResource(res, R.drawable.image1);
        image2 = BitmapFactory.decodeResource(res, R.drawable.image2);
        logo = BitmapFactory.decodeResource(res, R.drawable.logo);
        mask1 = BitmapFactory.decodeResource(res, R.drawable.mask1);
        mask2 = BitmapFactory.decodeResource(res, R.drawable.mask2);
    }
}

(2)Renderer类

 

package sim.feel;

import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.FloatBuffer;
import java.nio.IntBuffer;

import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;

import android.opengl.GLSurfaceView.Renderer;
import android.opengl.GLUtils;
import android.view.KeyEvent;

public class MyRenderer implements Renderer {
    // 是否使用“掩码”
    private boolean masking = true;
    // 绘制一个场景
    private boolean scene;
    // 保存5个纹理标志
    private int texture[] = new int[5];
    // 滚动纹理
    private float roll;
    // vertex
    private float[] vertex = new float[12];
    // vertexBuffer
    private FloatBuffer vertexBuffer;
    // texCoord
    private float texCoord[] = new float[8];
    // texCoordBuffer
    private FloatBuffer texCoordBuffer;

    // LoadBuffer
    public void loadBuffer() {
        ByteBuffer vertexByteBuffer = ByteBuffer
                .allocateDirect(vertex.length * 4);
        vertexByteBuffer.order(ByteOrder.nativeOrder());
        vertexBuffer = vertexByteBuffer.asFloatBuffer();
        vertexBuffer.put(vertex);
        vertexBuffer.position(0);

        ByteBuffer texCoordByteBuffer = ByteBuffer
                .allocateDirect(texCoord.length * 4);
        texCoordByteBuffer.order(ByteOrder.nativeOrder());
        texCoordBuffer = texCoordByteBuffer.asFloatBuffer();
        texCoordBuffer.put(texCoord);
        texCoordBuffer.position(0);
    }

    // 加载纹理
    public void loadTexture(GL10 gl) {
        // 启用纹理
        gl.glEnable(GL10.GL_TEXTURE_2D);
        // 创建纹理
        IntBuffer textureBuffer = IntBuffer.allocate(5);
        gl.glGenTextures(5, textureBuffer);
        texture = textureBuffer.array();

        // 绑定纹理
        gl.glBindTexture(GL10.GL_TEXTURE_2D, texture[0]);
        // 生成纹理
        GLUtils.texImage2D(GL10.GL_TEXTURE_2D, 0, LoadImage.image1, 0);
        // 线性滤波
        gl.glTexParameterx(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MIN_FILTER,
                GL10.GL_LINEAR);
        gl.glTexParameterx(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MAG_FILTER,
                GL10.GL_LINEAR);

        gl.glBindTexture(GL10.GL_TEXTURE_2D, texture[1]);
        GLUtils.texImage2D(GL10.GL_TEXTURE_2D, 0, LoadImage.image2, 0);
        gl.glTexParameterx(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MIN_FILTER,
                GL10.GL_LINEAR);
        gl.glTexParameterx(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MAG_FILTER,
                GL10.GL_LINEAR);

        gl.glBindTexture(GL10.GL_TEXTURE_2D, texture[2]);
        GLUtils.texImage2D(GL10.GL_TEXTURE_2D, 0, LoadImage.logo, 0);
        gl.glTexParameterx(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MIN_FILTER,
                GL10.GL_LINEAR);
        gl.glTexParameterx(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MAG_FILTER,
                GL10.GL_LINEAR);

        gl.glBindTexture(GL10.GL_TEXTURE_2D, texture[3]);
        GLUtils.texImage2D(GL10.GL_TEXTURE_2D, 0, LoadImage.mask1, 0);
        gl.glTexParameterx(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MIN_FILTER,
                GL10.GL_LINEAR);
        gl.glTexParameterx(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MAG_FILTER,
                GL10.GL_LINEAR);

        gl.glBindTexture(GL10.GL_TEXTURE_2D, texture[4]);
        GLUtils.texImage2D(GL10.GL_TEXTURE_2D, 0, LoadImage.mask2, 0);
        gl.glTexParameterx(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MIN_FILTER,
                GL10.GL_LINEAR);
        gl.glTexParameterx(GL10.GL_TEXTURE_2D, GL10.GL_TEXTURE_MAG_FILTER,
                GL10.GL_LINEAR);
    }

    @Override
    public void onDrawFrame(GL10 gl) {
        // loadBuffer
        loadBuffer();
        // 清除深度缓存与屏幕
        gl.glClear(GL10.GL_DEPTH_BUFFER_BIT | GL10.GL_COLOR_BUFFER_BIT);

        // 选择Logo纹理
        gl.glBindTexture(GL10.GL_TEXTURE_2D, texture[2]);
        // 开启顶点纹理设置
        gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
        gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
        // 给texCoordBuffer与vertexBuffer设置顶点
        gl.glVertexPointer(3, GL10.GL_FLOAT, 0, vertexBuffer);
        gl.glTexCoordPointer(2, GL10.GL_FLOAT, 0, texCoordBuffer);
        gl.glLoadIdentity();
        // 向屏幕里移入2个单位
        gl.glTranslatef(0.0f, 0.0f, -2.0f);
        // 呃，还要沿x旋转180度图片才是正的，烦o(-"-)o
        gl.glRotatef(180, 1.0f, 0.0f, 0.0f);

        // 下面代码绘制一个3*3即9个正方形，并为它描上纹理
        // texCoordBuffer put
        texCoordBuffer.clear();
        texCoordBuffer.put(0.0f);
        texCoordBuffer.put(-roll + 0.0f);

        texCoordBuffer.put(3.0f);
        texCoordBuffer.put(-roll + 0.0f);

        texCoordBuffer.put(0.0f);
        texCoordBuffer.put(-roll + 3.0f);

        texCoordBuffer.put(3.0f);
        texCoordBuffer.put(-roll + 3.0f);

        // 我的理解为以-2到-1,-1到0,0到1这些点来组成每个正方体
        // vertexBuffer put
        vertexBuffer.clear();
        vertexBuffer.put(-1.1f);
        vertexBuffer.put(-1.1f);
        vertexBuffer.put(0.0f);

        vertexBuffer.put(1.1f);
        vertexBuffer.put(-1.1f);
        vertexBuffer.put(0.0f);

        vertexBuffer.put(-1.1f);
        vertexBuffer.put(1.1f);
        vertexBuffer.put(0.0f);

        vertexBuffer.put(1.1f);
        vertexBuffer.put(1.1f);
        vertexBuffer.put(0.0f);

        // 正式绘制了
        gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, 4);

        // 启用混合和禁用深度测试
        gl.glEnable(GL10.GL_BLEND);
        gl.glDisable(GL10.GL_DEPTH_TEST);
        // 是否启用"掩码"，其实就是由图片组成的一个纹理，这里是texture[4]对应mask2.png
        if (masking) {
            // 使用黑白"掩码"(texture[4])混合屏幕颜色
            gl.glBlendFunc(GL10.GL_DST_COLOR, GL10.GL_ZERO);
        }

        // 绘制那一层为true绘制第二层，否则绘制第一层
        if (scene) {
            // 移入屏幕1个单位
            gl.glTranslatef(0.0f, 0.0f, -1.0f);
            // 沿Z轴旋转
            gl.glRotatef(roll * 360, 0.0f, 0.0f, 0.0f);

            // "掩码是否打开"
            if (masking) {
                // 选择一个"掩码"
                gl.glBindTexture(GL10.GL_TEXTURE_2D, texture[4]);
                texCoordBuffer.clear();
                texCoordBuffer.put(0.0f);
                texCoordBuffer.put(0.0f);

                texCoordBuffer.put(1.0f);
                texCoordBuffer.put(0.0f);

                texCoordBuffer.put(0.0f);
                texCoordBuffer.put(0.1f);

                texCoordBuffer.put(1.0f);
                texCoordBuffer.put(1.0f);

                vertexBuffer.clear();

                vertexBuffer.put(-1.1f);
                vertexBuffer.put(-1.1f);
                vertexBuffer.put(0.0f);

                vertexBuffer.put(1.1f);
                vertexBuffer.put(-1.1f);
                vertexBuffer.put(0.0f);

                vertexBuffer.put(-1.1f);
                vertexBuffer.put(1.1f);
                vertexBuffer.put(0.0f);

                vertexBuffer.put(1.1f);
                vertexBuffer.put(1.1f);
                vertexBuffer.put(0.0f);

                gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, 4);
            }
            // 如果没有选择掩码，我们的图像将与屏幕颜色混合
            // 反纹理2复制到屏幕
            gl.glBlendFunc(GL10.GL_ONE, GL10.GL_ONE);
            // 选择第二个纹理
            gl.glBindTexture(GL10.GL_TEXTURE_2D, texture[1]);

            texCoordBuffer.clear();
            texCoordBuffer.put(0.0f);
            texCoordBuffer.put(0.0f);

            texCoordBuffer.put(1.0f);
            texCoordBuffer.put(0.0f);

            texCoordBuffer.put(0.0f);
            texCoordBuffer.put(0.1f);

            texCoordBuffer.put(1.0f);
            texCoordBuffer.put(1.0f);

            vertexBuffer.clear();

            vertexBuffer.put(-1.1f);
            vertexBuffer.put(-1.1f);
            vertexBuffer.put(0.0f);

            vertexBuffer.put(1.1f);
            vertexBuffer.put(-1.1f);
            vertexBuffer.put(0.0f);

            vertexBuffer.put(-1.1f);
            vertexBuffer.put(1.1f);
            vertexBuffer.put(0.0f);

            vertexBuffer.put(1.1f);
            vertexBuffer.put(1.1f);
            vertexBuffer.put(0.0f);
            // 绘制啦
            gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, 4);
        } else {
            if (masking) {
                // 选择一个"掩码"
                gl.glBindTexture(GL10.GL_TEXTURE_2D, texture[3]);
                texCoordBuffer.clear();
                texCoordBuffer.put(roll + 0.0f);
                texCoordBuffer.put(0.0f);

                texCoordBuffer.put(roll + 4.0f);
                texCoordBuffer.put(0.0f);

                texCoordBuffer.put(roll + 0.0f);
                texCoordBuffer.put(4.0f);

                texCoordBuffer.put(roll + 4.0f);
                texCoordBuffer.put(4.0f);

                vertexBuffer.clear();

                vertexBuffer.put(-1.1f);
                vertexBuffer.put(-1.1f);
                vertexBuffer.put(0.0f);

                vertexBuffer.put(1.1f);
                vertexBuffer.put(-1.1f);
                vertexBuffer.put(0.0f);

                vertexBuffer.put(-1.1f);
                vertexBuffer.put(1.1f);
                vertexBuffer.put(0.0f);

                vertexBuffer.put(1.1f);
                vertexBuffer.put(1.1f);
                vertexBuffer.put(0.0f);

                gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, 4);
            }
            // 如果没有选择掩码，我们的图像将与屏幕颜色混合
            // 反纹理2复制到屏幕
            gl.glBlendFunc(GL10.GL_ONE, GL10.GL_ONE);
            // 选择第二个纹理
            gl.glBindTexture(GL10.GL_TEXTURE_2D, texture[0]);

            texCoordBuffer.clear();
            texCoordBuffer.put(roll + 0.0f);
            texCoordBuffer.put(0.0f);

            texCoordBuffer.put(roll + 4.0f);
            texCoordBuffer.put(0.0f);

            texCoordBuffer.put(roll + 0.0f);
            texCoordBuffer.put(4.0f);

            texCoordBuffer.put(roll + 4.0f);
            texCoordBuffer.put(4.0f);

            vertexBuffer.clear();

            vertexBuffer.put(-1.1f);
            vertexBuffer.put(-1.1f);
            vertexBuffer.put(0.0f);

            vertexBuffer.put(1.1f);
            vertexBuffer.put(-1.1f);
            vertexBuffer.put(0.0f);

            vertexBuffer.put(-1.1f);
            vertexBuffer.put(1.1f);
            vertexBuffer.put(0.0f);

            vertexBuffer.put(1.1f);
            vertexBuffer.put(1.1f);
            vertexBuffer.put(0.0f);
            // 又绘制了，呃。。。。
            gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, 4);
        }

        // 启用深度测试
        gl.glEnable(GL10.GL_DEPTH_TEST);
        // 禁用混合
        gl.glDisable(GL10.GL_BLEND);

        // 关闭顶点纹理设置
        gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
        gl.glDisableClientState(GL10.GL_TEXTURE_COORD_ARRAY);

        gl.glFinish();

        roll += 0.002f;
        if (roll > 1.0f) {
            roll -= 1.0f;
        }
    }

    @Override
    public void onSurfaceChanged(GL10 gl, int width, int height) {
        gl.glViewport(0, 0, width, height);
        if (height == 0) {
            height = 1;
        }
        float ratio = (float) width / height;
        gl.glMatrixMode(GL10.GL_PROJECTION);
        gl.glLoadIdentity();
        gl.glFrustumf(-ratio, ratio, -1, 1, 1, 100);
        gl.glMatrixMode(GL10.GL_MODELVIEW);
        gl.glLoadIdentity();
    }

    @Override
    public void onSurfaceCreated(GL10 gl, EGLConfig arg1) {
        // 加载纹理
        loadTexture(gl);
        // 黑色背景
        gl.glClearColor(0, 0, 0, 0);
        // 阴影平滑
        gl.glShadeModel(GL10.GL_SMOOTH);
        // 启用深度测试
        gl.glEnable(GL10.GL_DEPTH_TEST);
        // 建立深度缓存
        gl.glClearDepthf(1.0f);
        // 精细修正
        // gl.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, GL10.GL_NICEST);
    }

    public boolean onKeyDown(int keyCode, KeyEvent event) {
        switch (keyCode) {
        case KeyEvent.KEYCODE_DPAD_UP:
            masking = true;
            break;
        case KeyEvent.KEYCODE_DPAD_DOWN:
            masking = false;
            break;
        case KeyEvent.KEYCODE_DPAD_RIGHT:
            scene = true;
            break;
        case KeyEvent.KEYCODE_DPAD_LEFT:
            scene = false;
            break;
        }
        return true;
    }
}

 

效果图: