Opengl ES(五):响应触控事件

###

我们已经学习了opengl ES画图的框架,成功改变了背景颜色、绘制了一个三角形,并学会了怎么去改变图像显示比例和虚拟摄像机的位置。但仅仅是显示一张图片,我们没有必要去写那么多代码,接下来就是怎么来交互。在之前已经完成的框架下,完成这个过程就比较简单了。

前情回顾

Opengl ES(一):第一个例子

Opengl ES(二):画一个三角形之创造一个三角形

Opengl ES(三):画一个三角形之显示到屏幕

Opengl ES(四):设置projection和camera views

###

目前已经完成的代码在Opengl ES(四):设置projection和camera views的最后面,这里就不再贴出了。

我们先来尝试然三角形动起来。

###

其实不用多说,之前Renderer下面的方法我们自然而然就能想到怎么让画面动起来了,只要在onDrawFrame()这个方法下将每一帧绘制的参数进行修改不就完了。

事实上确实这么简单,比如我们来完成一个让三角形转起来的动作。

这个过程本质就是每一帧让三角形旋转一点点,旋转变换对应着一个矩阵,opengl也提供了创造旋转矩阵的接口

setRotateM

public static void setRotateM (float[] rm, 
                int rmOffset, 
                float a, 
                float x, 
                float y, 
                float z)

Creates a matrix for rotation by angle a (in degrees) around the axis (x, y, z).

Parameters
rmfloat: returns the result

 

rmOffsetint: index into rm where the result matrix starts

 

afloat: angle to rotate in degrees

 

xfloat: X axis component

 

yfloat: Y axis component

 

zfloat: Z axis component

这个接口相对于之前投影和设置摄像机的接口就十分简单易懂了, 只需要提供一个旋转角度,和旋转所绕的轴的向量,然后这些信息会被封装在我们传入的浮点数组中,浮点数组依然是16的大小,偏移量依然为0。

为了连续旋转,我们可以利用当前时间来实现,因为时间是等间隔变化的。

private float[] rotationMatrix = new float[16];
Override
public void onDrawFrame(GL10 gl) {
    ...

    // 利用现在时间实现0-360取值循环
    long time = SystemClock.uptimeMillis() % 4000L;
    float angle = 0.090f * ((int) time);
    Matrix.setRotateM(rotationMatrix, 0, angle, 0, 0, -1.0f);
}

这时候rotationMatrix就i是旋转作用矩阵了,再利用之前的方法,将它整合到同一个变换矩阵vPMatrix中,然后传给绘制接口draw()绘制图像即可。这时onDrawFrame()的代码便是这样。

@Override
    public void onDrawFrame(GL10 gl) {
        //把窗口颜色用刚刚设定的值(glClearColor)刷洗
        GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT);
        //设置camera views
        Matrix.setLookAtM(viewMatrix, 0, 0, 0, -3, 0f, 0f, 0f, 0f, 1.0f, 0.0f);
        //将两个矩阵合成一个
        Matrix.multiplyMM(vPMatrix, 0, projectionMatrix, 0, viewMatrix, 0);
        // 利用现在时间实现0-360取值循环
        long time = SystemClock.uptimeMillis() % 4000L;
        float angle = 0.090f * ((int) time);
        Matrix.setRotateM(rotationMatrix, 0, angle, 0, 0, -1.0f);
        //再次合并变换矩阵
        Matrix.multiplyMM(vPMatrix, 0, vPMatrix, 0, rotationMatrix, 0);
        //调用绘制接口画图
//        mTriangle.draw();
        mTriangle.draw(vPMatrix);
    }

###完整代码

这时运行程序,就可以看见一个自己旋转的三角形了,我们将目前完整的代码贴出

Triangle类,没有任何修改。

import android.opengl.GLES20;

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

public class Triangle {

    private FloatBuffer vertexBuffer;
    public final int mProgram;
    private int positionHandle;
    private int vPMatrixHandle;
    private int colorHandle;
    private final int vertexCount = triangleCoords.length / COORDS_PER_VERTEX;  //how many vertex
    private final int vertexStride = COORDS_PER_VERTEX * 4; // 4 bytes per vertex

    //shader代码​
    private final String vertexShaderCode =
            "uniform mat4 uMVPMatrix;" +
                    "attribute vec4 vPosition;" +
                    "void main() {" +
//                    "  gl_Position = vPosition;"+
                    " gl_Position = uMVPMatrix * vPosition; " +
                    "}";
    private final String fragmentShaderCode =
            "precision mediump float;" +
                    "uniform vec4 vColor;" +
                    "void main() {" +
                    "  gl_FragColor = vColor;" +
                    "}";

    // 数组中每个顶点的坐标数(即维数)
    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
    };
    // 颜色信息,分别是RGB和alpha通道的归一化值
    float color[] = { 0.63671875f, 0.76953125f, 0.22265625f, 1.0f };

    public Triangle() {
        /**
         * 将顶点数据传入Buffer
         */
        // 初始化顶点数据Buffer
        ByteBuffer bb = ByteBuffer.allocateDirect(
                // (一个float型4字节)
                triangleCoords.length * 4);
        // 字节序使用native order
        bb.order(ByteOrder.nativeOrder());

        // 将ByteBuffer转换为浮点型FloatBuffer
        vertexBuffer = bb.asFloatBuffer();
        // 将顶点数据添加到Buffer
        vertexBuffer.put(triangleCoords);
        // Buffer位置调整到开头
        vertexBuffer.position(0);
        /**
         * 创建shader并链接到程序
         */
        int vertexShader = MyGLRenderer.loadShader(GLES20.GL_VERTEX_SHADER,
                vertexShaderCode);
        int fragmentShader = MyGLRenderer.loadShader(GLES20.GL_FRAGMENT_SHADER,
                fragmentShaderCode);

        // 创建空的Opengl ES program
        mProgram = GLES20.glCreateProgram();
        // 将顶点着色器加入program
        GLES20.glAttachShader(mProgram, vertexShader);
        // 将片元着色器加入program
        GLES20.glAttachShader(mProgram, fragmentShader);
        // 创造opengl ES可执行的文件
        GLES20.glLinkProgram(mProgram);
    }
    public void draw(float[] mvpMatrix) {
        // 将program添加到Opengl ES环境
        GLES20.glUseProgram(mProgram);
        // 获取mProgram中vPosition的句柄(顶点数据)
        positionHandle = GLES20.glGetAttribLocation(mProgram, "vPosition");
        // 启用顶点属性
        GLES20.glEnableVertexAttribArray(positionHandle);

        // 顶点坐标的处理方式,参数依次为索引值(刚刚获取的句柄),数据维数(顶点即3维)
        // 数据类型(float),当被访问时固定点数值是否需要归一化(false)
        // 步长,即连续顶点偏移量(COORDS_PER_VERTEX * 4),
        // 起始位置在缓冲区的偏移量(vertexBuffer)
        GLES20.glVertexAttribPointer(positionHandle, COORDS_PER_VERTEX,
                GLES20.GL_FLOAT, false,
                vertexStride, vertexBuffer);

        // 获取mProgram中vColor的句柄(颜色数据)
        colorHandle = GLES20.glGetUniformLocation(mProgram, "vColor");
        // 传入颜色矩阵
        GLES20.glUniform4fv(colorHandle, 1, color, 0);
        /**
         * 添加projection和camera views作用
         */
        // 获得uMVPMatrix矩阵(我们用来变换作用)的句柄
        vPMatrixHandle = GLES20.glGetUniformLocation(mProgram, "uMVPMatrix");
        // 将之前设置好的矩阵信息传到uMVPMatrix矩阵
        GLES20.glUniformMatrix4fv(vPMatrixHandle, 1, false, mvpMatrix, 0);

        // 绘制三角形
        GLES20.glDrawArrays(GLES20.GL_TRIANGLES, 0, vertexCount);
        // 禁用顶点属性
        GLES20.glDisableVertexAttribArray(positionHandle);
    }
}

Renderer,利用时间循环在0-360取值,然后调用接口创建了旋转矩阵,并将旋转矩阵的作用合并到一个矩阵中。其他部分没有改变。 

import android.opengl.GLES20;
import android.opengl.GLSurfaceView;
import android.opengl.Matrix;
import android.os.SystemClock;

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

public class MyGLRenderer implements GLSurfaceView.Renderer {
    private Triangle mTriangle;
    private final float[] vPMatrix = new float[16];
    private final float[] projectionMatrix = new float[16];
    private final float[] viewMatrix = new float[16];
    private float[] rotationMatrix = new float[16];

    //shader加载方法,返回编译好的shader
    public static int loadShader(int type, String shaderCode){
        // 创建顶点着色器的type是 GLES20.GL_VERTEX_SHADER
        // 创建片元着色器的type是 GLES20.GL_FRAGMENT_SHADER
        int shader = GLES20.glCreateShader(type);

        // 传递着色器代码并编译着色器
        GLES20.glShaderSource(shader, shaderCode);
        GLES20.glCompileShader(shader);

        return shader;
    }

    @Override
    public void onSurfaceCreated(GL10 gl, EGLConfig config) {
        //设置背景颜色,参数是RGB和alpha通道值的归一值,即范围为0-1,我设置的是橙色
        GLES20.glClearColor(1.0f, 0.6f, 0f, 1.0f);
        mTriangle = new Triangle();
    }

    @Override
    public void onSurfaceChanged(GL10 gl, int width, int height) {
        //调整窗口大小
        GLES20.glViewport(0, 0, width, height);
        /**
         * projection matrix
         */
        float ratio = (float) width / height;
        Matrix.frustumM(projectionMatrix, 0, -ratio, ratio, -1, 1, 2.5f, 30);
    }

    @Override
    public void onDrawFrame(GL10 gl) {
        //把窗口颜色用刚刚设定的值(glClearColor)刷洗
        GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT);
        //设置camera views
        Matrix.setLookAtM(viewMatrix, 0, 0, 0, -3, 0f, 0f, 0f, 0f, 1.0f, 0.0f);
        //将两个矩阵合成一个
        Matrix.multiplyMM(vPMatrix, 0, projectionMatrix, 0, viewMatrix, 0);
        // 利用现在时间实现0-360取值循环
        long time = SystemClock.uptimeMillis() % 4000L;
        float angle = 0.090f * ((int) time);
        Matrix.setRotateM(rotationMatrix, 0, angle, 0, 0, -1.0f);
        //再次合并变换矩阵
        Matrix.multiplyMM(vPMatrix, 0, vPMatrix, 0, rotationMatrix, 0);
        //调用绘制接口画图
//        mTriangle.draw();
        mTriangle.draw(vPMatrix);
    }
}

 GLSurfaceView类,没有改动。

import android.content.Context;
import android.opengl.GLSurfaceView;
import android.view.MotionEvent;

public class MyGLSurfaceView extends GLSurfaceView {
    private final MyGLRenderer renderer;
    public MyGLSurfaceView(Context context) {
        super(context);
        //设置版本
        setEGLContextClientVersion(2);
        //创建Renderer实例
        renderer = new MyGLRenderer();
        //将GLRenderer和GLSurfaceView连接
        setRenderer(renderer);
    }
}

MainActivity类,没有改动。

import android.opengl.GLSurfaceView;
import android.os.Bundle;

import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {
    private GLSurfaceView gLView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //创建GLSurfaceView实例
        gLView = new MyGLSurfaceView(this);
        //连接GLSurfaceView
        setContentView(gLView);
    }
}

###实现触控事件响应

简单的几行添加我们就实现了三角形的旋转,那么我们能然三角形的旋转受人来控制吗?

很显然,我们只需要接收触控屏幕的事件,再根据触控位置设置旋转角度,即将上面利用时间取值控制角度改成利用触控位置控制角度即可。

在GLSurfaceView中有响应屏幕触控事件的方法onTouchEvent(),这个方法应该是继承自View类。

onTouchEvent

public boolean onTouchEvent (MotionEvent event)

Implement this method to handle touch screen motion events.

Parameters
eventMotionEvent: The motion event.

 

Returns
booleanTrue if the event was handled, false otherwise.

我们可以在GLSurfaceView下写出

@Override
public boolean onTouchEvent(MotionEvent e) {
    //获取触控位置
    float x = e.getX();
    float y = e.getY();

    return true;
}

每当有触控事件,这个方法就会响应,我们就能够获得触控的位置。那么接下来怎么处理就是我们根据需求自己设计的了。

那么我们接下来根据常见的旋转交互方式来设计一个算法

通常来讲,我们在屏幕上超一个方向旋转,那么三角形朝一个方向转动。

所以我们需要测定一个滑动的状态,也就是需要求出连续两个状态之间的变化过程,那么我们就先定义之前的状态(之前触摸的位置)和现在的状态(现在触摸的位置,我们已经定义成了x和y)

private float previousX;
private float previousY;
@Override
public boolean onTouchEvent(MotionEvent e) {
    //获取触控位置
    float x = e.getX();
    float y = e.getY();

    return true;
}

另外,MotionEvent类中提供了状态判定,可以帮我们更准确的操作。

我们需要的滑动操作对应着MotionEvent.ACTION_MOVE,他能检测到我们在屏幕上按下并且移动了的状态。

ACTION_MOVE

public static final int ACTION_MOVE

Constant for getActionMasked(): A change has happened during a press gesture (between ACTION_DOWN and ACTION_UP). The motion contains the most recent point, as well as any intermediate points since the last down or move event.

Constant Value: 2 (0x00000002)

所以我们添加一个switch来判定是否是我们需要处理的状态改变。我们在case MotionEvent.ACTION_MOVE:下进行操作

private float previousX;
private float previousY;
@Override
public boolean onTouchEvent(MotionEvent e) {
    //获取触控位置
    float x = e.getX();
    float y = e.getY();

    switch (e.getAction()) {
        case MotionEvent.ACTION_MOVE:

    }
    return true;
}

 显然我们需要计算出前一位置和后一位置的差,来判定是往哪个方向旋转。

我们需要将情况稍微归纳整理一下,这里直接给出一种判定方法:

如果在上半部分,向左划是逆时针,向右划是顺时针;在下半部分则相反。

如果在左半部分,向下划是逆时针,向上划是顺时针;在右半部分则相反。

所以我们判定前先要获取窗口的上下和左右中间界限值,窗口大小是随时会改变的,所以每次都判定前都进行查询,好在View类中有可以使用的方法getHeight()和getWidth(),我们直接使用即可。

我们选取某一区为基准,然后另一区取反即可。就好像物理学中方向的定义一样,正负号只是一个划分。

然后很显然,我们将两个状态的变换量dx和dy加起来,他们的符号也可以作为一个划分。

我们再设置一个旋转速率TOUCH_SCALE_FACTOR,(dx+dy)*TOUCH_SCALE_FACTOR即为我们旋转的角度。

然后再编写个方法,将这个角度传给Renderer来绘制即可。

最后方法如下,renderer.setAngle和renderer.getAngle就是我们用来传输旋转角度的方法。previousX和previousY就是上一时刻的触控位置。其中requestRender()是GLSurfaceView提供的一个方法,我们可以利用setRenderMode方法设置渲染的模式,如果设置为RENDERMODE_WHEN_DIRTY模式,只有当surface创立和调用requestRender()时才会渲染画面,这极大提升了我们画图的效率。

所以我们还需要在GLSurfaceView类的构造函数最后(设置了Renderer之后),添加一句

        // 修改Render模式
        setRenderMode(GLSurfaceView.RENDERMODE_WHEN_DIRTY);
private final float TOUCH_SCALE_FACTOR = 180.0f / 900;
private float previousX;
private float previousY;
@Override
    public boolean onTouchEvent(MotionEvent e) {
        //获取触控位置
        float x = e.getX();
        float y = e.getY();
        switch (e.getAction()) {
            case MotionEvent.ACTION_MOVE:

                float dx = x - previousX;
                float dy = y - previousY;
                // 以下半部分为基准
                if (y > getHeight() / 2) {
                    dx = dx * -1 ;
                }
                // 以右半部分为基准
                if (x < getWidth() / 2) {
                    dy = dy * -1 ;
                }
                renderer.setAngle(
                        renderer.getAngle() -
                                ((dx + dy) * TOUCH_SCALE_FACTOR));
                requestRender();
        }
        previousX = x;
        previousY = y;
        return true;
    }

传输角度方法编写就十分简单了,就是传个参。我们直接在Renderer中定义一个参数,然后编写传递这个参数的方法。

    public volatile float mAngle;
    //传递角度参数
    public float getAngle() {
        return mAngle;
    }
    public void setAngle(float angle) {
        mAngle = angle;
    }    public volatile float mAngle;

最后只需将onDrawFrame中旋转矩阵的角度参数由时间产生改成直接使用我们传递过来的角度mAngle

//        // 利用现在时间实现0-360取值循环
//        long time = SystemClock.uptimeMillis() % 4000L;
//        float angle = 0.090f * ((int) time);
//        Matrix.setRotateM(rotationMatrix, 0, angle, 0, 0, -1.0f);
        Matrix.setRotateM(rotationMatrix, 0, mAngle, 0, 0, -1.0f);

这时候就可以触控去旋转三角形了!

###完整代码

Triangle类

import android.opengl.GLES20;

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

public class Triangle {

    private FloatBuffer vertexBuffer;
    public final int mProgram;
    private int positionHandle;
    private int vPMatrixHandle;
    private int colorHandle;
    private final int vertexCount = triangleCoords.length / COORDS_PER_VERTEX;  //how many vertex
    private final int vertexStride = COORDS_PER_VERTEX * 4; // 4 bytes per vertex

    //shader代码​
    private final String vertexShaderCode =
            "uniform mat4 uMVPMatrix;" +
                    "attribute vec4 vPosition;" +
                    "void main() {" +
//                    "  gl_Position = vPosition;"+
                    " gl_Position = uMVPMatrix * vPosition; " +
                    "}";
    private final String fragmentShaderCode =
            "precision mediump float;" +
                    "uniform vec4 vColor;" +
                    "void main() {" +
                    "  gl_FragColor = vColor;" +
                    "}";

    // 数组中每个顶点的坐标数(即维数)
    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
    };
    // 颜色信息,分别是RGB和alpha通道的归一化值
    float color[] = { 0.63671875f, 0.76953125f, 0.22265625f, 1.0f };

    public Triangle() {
        /**
         * 将顶点数据传入Buffer
         */
        // 初始化顶点数据Buffer
        ByteBuffer bb = ByteBuffer.allocateDirect(
                // (一个float型4字节)
                triangleCoords.length * 4);
        // 字节序使用native order
        bb.order(ByteOrder.nativeOrder());

        // 将ByteBuffer转换为浮点型FloatBuffer
        vertexBuffer = bb.asFloatBuffer();
        // 将顶点数据添加到Buffer
        vertexBuffer.put(triangleCoords);
        // Buffer位置调整到开头
        vertexBuffer.position(0);
        /**
         * 创建shader并链接到程序
         */
        int vertexShader = MyGLRenderer.loadShader(GLES20.GL_VERTEX_SHADER,
                vertexShaderCode);
        int fragmentShader = MyGLRenderer.loadShader(GLES20.GL_FRAGMENT_SHADER,
                fragmentShaderCode);

        // 创建空的Opengl ES program
        mProgram = GLES20.glCreateProgram();
        // 将顶点着色器加入program
        GLES20.glAttachShader(mProgram, vertexShader);
        // 将片元着色器加入program
        GLES20.glAttachShader(mProgram, fragmentShader);
        // 创造opengl ES可执行的文件
        GLES20.glLinkProgram(mProgram);
    }
    public void draw(float[] mvpMatrix) {
        // 将program添加到Opengl ES环境
        GLES20.glUseProgram(mProgram);
        // 获取mProgram中vPosition的句柄(顶点数据)
        positionHandle = GLES20.glGetAttribLocation(mProgram, "vPosition");
        // 启用顶点属性
        GLES20.glEnableVertexAttribArray(positionHandle);

        // 顶点坐标的处理方式,参数依次为索引值(刚刚获取的句柄),数据维数(顶点即3维)
        // 数据类型(float),当被访问时固定点数值是否需要归一化(false)
        // 步长,即连续顶点偏移量(COORDS_PER_VERTEX * 4),
        // 起始位置在缓冲区的偏移量(vertexBuffer)
        GLES20.glVertexAttribPointer(positionHandle, COORDS_PER_VERTEX,
                GLES20.GL_FLOAT, false,
                vertexStride, vertexBuffer);

        // 获取mProgram中vColor的句柄(颜色数据)
        colorHandle = GLES20.glGetUniformLocation(mProgram, "vColor");
        // 传入颜色矩阵
        GLES20.glUniform4fv(colorHandle, 1, color, 0);
        /**
         * 添加projection和camera views作用
         */
        // 获得uMVPMatrix矩阵(我们用来变换作用)的句柄
        vPMatrixHandle = GLES20.glGetUniformLocation(mProgram, "uMVPMatrix");
        // 将之前设置好的矩阵信息传到uMVPMatrix矩阵
        GLES20.glUniformMatrix4fv(vPMatrixHandle, 1, false, mvpMatrix, 0);

        // 绘制三角形
        GLES20.glDrawArrays(GLES20.GL_TRIANGLES, 0, vertexCount);
        // 禁用顶点属性
        GLES20.glDisableVertexAttribArray(positionHandle);
    }
}

Renderer

import android.opengl.GLES20;
import android.opengl.GLSurfaceView;
import android.opengl.Matrix;
import android.os.SystemClock;

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

public class MyGLRenderer implements GLSurfaceView.Renderer {
    private Triangle mTriangle;
    private final float[] vPMatrix = new float[16];
    private final float[] projectionMatrix = new float[16];
    private final float[] viewMatrix = new float[16];
    private float[] rotationMatrix = new float[16];
    public volatile float mAngle;
    //传递角度参数
    public float getAngle() {
        return mAngle;
    }
    public void setAngle(float angle) {
        mAngle = angle;
    }

    //shader加载方法,返回编译好的shader
    public static int loadShader(int type, String shaderCode){
        // 创建顶点着色器的type是 GLES20.GL_VERTEX_SHADER
        // 创建片元着色器的type是 GLES20.GL_FRAGMENT_SHADER
        int shader = GLES20.glCreateShader(type);

        // 传递着色器代码并编译着色器
        GLES20.glShaderSource(shader, shaderCode);
        GLES20.glCompileShader(shader);

        return shader;
    }

    @Override
    public void onSurfaceCreated(GL10 gl, EGLConfig config) {
        //设置背景颜色,参数是RGB和alpha通道值的归一值,即范围为0-1,我设置的是橙色
        GLES20.glClearColor(1.0f, 0.6f, 0f, 1.0f);
        mTriangle = new Triangle();
    }

    @Override
    public void onSurfaceChanged(GL10 gl, int width, int height) {
        //调整窗口大小
        GLES20.glViewport(0, 0, width, height);
        /**
         * projection matrix
         */
        float ratio = (float) width / height;
        Matrix.frustumM(projectionMatrix, 0, -ratio, ratio, -1, 1, 2.5f, 30);
    }

    @Override
    public void onDrawFrame(GL10 gl) {
        //把窗口颜色用刚刚设定的值(glClearColor)刷洗
        GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT);
        //设置camera views
        Matrix.setLookAtM(viewMatrix, 0, 0, 0, -3, 0f, 0f, 0f, 0f, 1.0f, 0.0f);
        //将两个矩阵合成一个
        Matrix.multiplyMM(vPMatrix, 0, projectionMatrix, 0, viewMatrix, 0);
//        // 利用现在时间实现0-360取值循环
//        long time = SystemClock.uptimeMillis() % 4000L;
//        float angle = 0.090f * ((int) time);
//        Matrix.setRotateM(rotationMatrix, 0, angle, 0, 0, -1.0f);
        Matrix.setRotateM(rotationMatrix, 0, mAngle, 0, 0, -1.0f);
        //再次合并变换矩阵
        Matrix.multiplyMM(vPMatrix, 0, vPMatrix, 0, rotationMatrix, 0);
        //调用绘制接口画图
//        mTriangle.draw();
        mTriangle.draw(vPMatrix);
    }
}

GLSurfaceView类

import android.opengl.GLES20;
import android.opengl.GLSurfaceView;
import android.opengl.Matrix;
import android.os.SystemClock;

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

public class MyGLRenderer implements GLSurfaceView.Renderer {
    private Triangle mTriangle;
    private final float[] vPMatrix = new float[16];
    private final float[] projectionMatrix = new float[16];
    private final float[] viewMatrix = new float[16];
    private float[] rotationMatrix = new float[16];
    public volatile float mAngle;
    //传递角度参数
    public float getAngle() {
        return mAngle;
    }
    public void setAngle(float angle) {
        mAngle = angle;
    }

    //shader加载方法,返回编译好的shader
    public static int loadShader(int type, String shaderCode){
        // 创建顶点着色器的type是 GLES20.GL_VERTEX_SHADER
        // 创建片元着色器的type是 GLES20.GL_FRAGMENT_SHADER
        int shader = GLES20.glCreateShader(type);

        // 传递着色器代码并编译着色器
        GLES20.glShaderSource(shader, shaderCode);
        GLES20.glCompileShader(shader);

        return shader;
    }

    @Override
    public void onSurfaceCreated(GL10 gl, EGLConfig config) {
        //设置背景颜色,参数是RGB和alpha通道值的归一值,即范围为0-1,我设置的是橙色
        GLES20.glClearColor(1.0f, 0.6f, 0f, 1.0f);
        mTriangle = new Triangle();
    }

    @Override
    public void onSurfaceChanged(GL10 gl, int width, int height) {
        //调整窗口大小
        GLES20.glViewport(0, 0, width, height);
        /**
         * projection matrix
         */
        float ratio = (float) width / height;
        Matrix.frustumM(projectionMatrix, 0, -ratio, ratio, -1, 1, 2.5f, 30);
    }

    @Override
    public void onDrawFrame(GL10 gl) {
        //把窗口颜色用刚刚设定的值(glClearColor)刷洗
        GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT);
        //设置camera views
        Matrix.setLookAtM(viewMatrix, 0, 0, 0, -3, 0f, 0f, 0f, 0f, 1.0f, 0.0f);
        //将两个矩阵合成一个
        Matrix.multiplyMM(vPMatrix, 0, projectionMatrix, 0, viewMatrix, 0);
//        // 利用现在时间实现0-360取值循环
//        long time = SystemClock.uptimeMillis() % 4000L;
//        float angle = 0.090f * ((int) time);
//        Matrix.setRotateM(rotationMatrix, 0, angle, 0, 0, -1.0f);
        Matrix.setRotateM(rotationMatrix, 0, mAngle, 0, 0, -1.0f);
        //再次合并变换矩阵
        Matrix.multiplyMM(vPMatrix, 0, vPMatrix, 0, rotationMatrix, 0);
        //调用绘制接口画图
//        mTriangle.draw();
        mTriangle.draw(vPMatrix);
    }
}

MainActivity类


import android.opengl.GLSurfaceView;
import android.os.Bundle;

import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {
    private GLSurfaceView gLView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //创建GLSurfaceView实例
        gLView = new MyGLSurfaceView(this);
        //连接GLSurfaceView
        setContentView(gLView);
    }
}

###

至此这个系列主干线就完结了,其实这系列的教程是按照https://developer.android.google.cn/training/graphics/opengl来的。

把代码在这里再写一遍,一方面是原版有些地方过于简略,理解并不容易,这里可以做一些补充;另一方面也是当作自己做的一个学习笔记,把代码带着讲解性质写一遍和只是看几遍效果是完全不一样的。

###目录导航

Opengl ES(一):第一个例子

Opengl ES(二):画一个三角形之创造一个三角形

Opengl ES(三):画一个三角形之显示到屏幕

Opengl ES(四):设置projection和camera views

Opengl ES(五):响应触控事件

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值