美文网首页138号安心小屋消零专题
(1)案例一:绘制三角形

(1)案例一:绘制三角形

作者: 大旺旺的弟弟小旺旺 | 来源:发表于2021-06-30 06:48 被阅读0次

想几个问题:绘制三角形,需要三个顶点,顶点我们使用属性指定,属性的指定我们使用数组结构还是结构数组,那么需不需要放入到顶点缓存区。我们创建的片元和片段着色器精度是float还是其他,需要做矩阵变换。
问题一:
需要三个顶点,那么我们绘制如下位置的三角形

0.5f,  0.5f, 0.0f, // top
- 0.5f, -0.5f, 0.0f, // bottom left
0.5f, -0.5f, 0.0f  // bottom right

想象一下图形,想完了……。
需要将数据变为本地格式,这里有个概念大头和小头,主要是java和本地的差距。需要做以下操作:

ByteBuffer bb = ByteBuffer.allocateDirect(triangleCoords.length * 4);
bb.order(ByteOrder.nativeOrder());
vertexBuffer = bb.asFloatBuffer();
vertexBuffer.put(triangleCoords);
vertexBuffer.position(0);

问题二:我们放不放顶点缓存区。
不放,好,那没事 。
问题三:数组结构还是结构数组
数组结构了,只有一个属性,等需要变色的时候在加吧。
问题四:精度?
片元我们使用默认,片段使用float,可以着色器写了?没有,写着色器。

    private final String vertexShaderCode =
            "attribute vec4 vPosition;" +
                    "void main() {" +
                    "  gl_Position = vPosition;" +  //顶点位置
                    "}";

    private final String fragmentShaderCode =
            "precision mediump float;" +
                    "void main() {" +
                    "  gl_FragColor = vec4(1,1,1,1);" + //输出白色
                    "}";

问题5:需不需要做矩阵变换?
不需要,那就这样了。

绘制

绘制的时候就拿出基本套路。
1.创建着色器
2.加载程序
3.编译
4.创建程序
5.附着程序
6.链接使用
7.找出属性位置
8.设置值
9.绘制。

public class Triangle extends BaseGameScreen {
    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;" +
                    "}";

    static final int COORDS_PER_VERTEX = 3;
    private FloatBuffer vertexBuffer;
    static float triangleCoords[] = {
            0.5f,  0.5f, 0.0f, // top
            -0.5f, -0.5f, 0.0f, // bottom left
            0.5f, -0.5f, 0.0f  // bottom right
    };

    //顶点个数
    private final int vertexCount = triangleCoords.length / COORDS_PER_VERTEX;
    //顶点之间的偏移量
    private final int vertexStride = COORDS_PER_VERTEX * 4; // 每个顶点四个字节
    //设置颜色,依次为红绿蓝和透明通道
    float color[] = { 1.0f, 1.0f, 1.0f, 1.0f };
    private int mPositionHandle;
    private int mColorHandle;
    float d = 0.01F;
    public Triangle(){

    }

    public void create(){
        ByteBuffer bb = ByteBuffer.allocateDirect(
                triangleCoords.length * 4);
        bb.order(ByteOrder.nativeOrder());
        vertexBuffer = bb.asFloatBuffer();
        vertexBuffer.put(triangleCoords);
        vertexBuffer.position(0);

        int vertexShader = loadShader(GLES20.GL_VERTEX_SHADER,vertexShaderCode);
        int fragmentShader = loadShader(GLES20.GL_FRAGMENT_SHADER,fragmentShaderCode);
        mProgram = GLES20.glCreateProgram();
        GLES20.glAttachShader(mProgram,vertexShader);
        GLES20.glAttachShader(mProgram,fragmentShader);
        GLES20.glLinkProgram(mProgram);
        //程序加入到环境里面
        GLES20.glUseProgram(mProgram);
//        检查是否有效
        GLES20.glValidateProgram(mProgram);
        mPositionHandle = GLES20.glGetAttribLocation(mProgram, "vPosition");
        mColorHandle = GLES20.glGetUniformLocation(mProgram, "vColor");
    }


    @Override
    public void surfaceChange(int width, int height) {
        GLES20.glViewport(0,0,width,height);
    }

    @Override
    public void dispose() {

    }


    @Override
    public void render() {
        //获取位置句柄   属性句柄

        GLES20.glEnableVertexAttribArray(mPositionHandle);
        //准备三角形的坐标数据
        GLES20.glVertexAttribPointer(
                mPositionHandle,
                COORDS_PER_VERTEX,
                GLES20.GL_FLOAT,
                false,
                vertexStride,
                vertexBuffer);
        //获取片元着色器的vColor成员的句柄

        color[1] = color[1]-d;
        if (color[1]<=0||color[1]>=1){
            d=-d;
        }
        //设置绘制三角形的颜色
        GLES20.glUniform4fv(mColorHandle, 1, color, 0);
        //绘制三角形
        GLES20.glDrawArrays(GLES20.GL_TRIANGLES, 0, vertexCount);
        //禁止顶点数组的句柄
        GLES20.glDisableVertexAttribArray(mPositionHandle);
    }

}

绘制基本都是这个套路。

相关文章

  • OpenGL入门案例

    此案例是绘制一个三角形,相当于hello word的入门级案例 绘制前,先了解几个简单的知识点 1. 工具类 着色...

  • 005 - OpenGL绘制三角形案例

    案例主要目的是绘制一个三角形,在蓝色背景下绘制一个红色的三角形 OpenGL在Mac Xcode的搭建: ,还不知...

  • OpenGL-你好,正方形

    案例练习,在窗口绘制一个正方形,并且用方向键控制移动 如果你是初学者,请先阅读 案例--绘制三角形,这篇文章里会对...

  • Metal案例:绘制三角形

    效果图如下: 在Metal案例分析中我们已经介绍过了Metal案例的构建流程。其实绘制三角形案例中,大致流程是一致...

  • (1)案例一:绘制三角形

    想几个问题:绘制三角形,需要三个顶点,顶点我们使用属性指定,属性的指定我们使用数组结构还是结构数组,那么需不需要放...

  • OpenGL-你好,三角形

    案例练习:在窗口绘制一个三角形 进行次案例练习之前,请确保已经搭建好 OpenGL环境 ! 并导入头文件 首先熟悉...

  • 绘制三角形,矩形,圆形

    绘制三角形 绘制矩形 绘制圆形

  • canvas画矩形圆形直线三角形

    开发笔记之-canvas画矩形圆形直线三角形 1.页面如下: 2.绘制长方形 3.绘制圆 4.绘制三角形 5.绘制...

  • OpenGL渲染

    1. 渲染过程中产生的问题 我们绘制的一个由很多三角形组成的实体对象,第一个绘制的三角形可能会被后面绘制的三角形覆...

  • Hello OpenGL--002:会移动的三角形

    所要实现的效果图: 想要实现这种效果我们分为两步,1、绘制出一个三角形, 2、让三角形动起来。 一、三角形的绘制 ...

网友评论

    本文标题:(1)案例一:绘制三角形

    本文链接:https://www.haomeiwen.com/subject/cwcxultx.html