android平臺下OpenGL ES 3.0繪製立方體的幾種方式

OpenGL ES 3.0學習實踐

呼叫glDrawArrays(GL_TRIANGLES, 0, 6)將繪製兩個三角形：一個三角形由元素索引(0, 1, 2)指定，另一個三角形由元素索引(3, 4, 5)指定。
呼叫glDrawArrays(GL_TRIANGLE_STRIP，0, 5)將繪製3個三角形：一個由元素索引(0, 1, 2)指定，第二個三角形由元素索引(2, 1, 3)指定，最後一個三角形由元素索引(2, 3, 4)指定。

基於線段的方式

基於之前的工程專案，新建LineCubeRenderer.java類

/**
 * @anchor: andy
 * @date: 2018-11-09
 * @description:
 */
public class LineCubeRenderer implements GLSurfaceView.Renderer {

    private final FloatBuffer vertexBuffer;

    private int mProgram;

    private static final int POSITION_COMPONENT_COUNT = 3;

    /**
     * 點的座標
     */
    private float[] vertexPoints = new float[]{
            0.25f, 0.25f, 0.0f,  //V0
            -0.75f, 0.25f, 0.0f, //V1
            -0.75f, -0.75f, 0.0f, //V2
            0.25f, -0.75f, 0.0f, //V3

            0.75f, -0.25f, 0.0f, //V4
            0.75f, 0.75f, 0.0f, //V5
            -0.25f, 0.75f, 0.0f, //V6
            -0.25f, -0.25f, 0.0f, //V7

            -0.25f, 0.75f, 0.0f, //V6
            -0.75f, 0.25f, 0.0f, //V1

            0.75f, 0.75f, 0.0f, //V5
            0.25f, 0.25f, 0.0f, //V0

            -0.25f, -0.25f, 0.0f, //V7
            -0.75f, -0.75f, 0.0f, //V2

            0.75f, -0.25f, 0.0f, //V4
            0.25f, -0.75f, 0.0f //V3
    };

    public LineCubeRenderer() {
        //分配記憶體空間,每個浮點型佔4位元組空間
        vertexBuffer = ByteBuffer.allocateDirect(vertexPoints.length * 4)
                .order(ByteOrder.nativeOrder())
                .asFloatBuffer();
        //傳入指定的座標資料
        vertexBuffer.put(vertexPoints);
        vertexBuffer.position(0);
    }

    @Override
    public void onSurfaceCreated(GL10 gl, EGLConfig config) {
        //設定背景顏色
        GLES30.glClearColor(0.5f, 0.5f, 0.5f, 0.5f);
        //編譯
        final int vertexShaderId = ShaderUtils.compileVertexShader(ResReadUtils.readResource(R.raw.vertex_linecube_shader));
        final int fragmentShaderId = ShaderUtils.compileFragmentShader(ResReadUtils.readResource(R.raw.fragment_linecube_shader));
        //連結程式片段
        mProgram = ShaderUtils.linkProgram(vertexShaderId, fragmentShaderId);
        //使用程式片段
        GLES30.glUseProgram(mProgram);

        GLES30.glVertexAttribPointer(0, POSITION_COMPONENT_COUNT, GLES30.GL_FLOAT, false, 0, vertexBuffer);

        GLES30.glEnableVertexAttribArray(0);

    }

    @Override
    public void onSurfaceChanged(GL10 gl, int width, int height) {
        GLES30.glViewport(0, 0, width, height);
    }

    @Override
    public void onDrawFrame(GL10 gl) {
        GLES30.glClear(GLES30.GL_COLOR_BUFFER_BIT);

        //指定線寬
        GLES30.glLineWidth(5);

        GLES30.glDrawArrays(GLES30.GL_LINE_LOOP, 0, 4);

        GLES30.glDrawArrays(GLES30.GL_LINE_LOOP, 4, 4);

        GLES30.glDrawArrays(GLES30.GL_LINES, 8, 8);

    }
}

頂點著色器

#version 300 es
layout (location = 0) in vec4 vPosition;
out vec4 vColor;
void main() {
     gl_Position  = vPosition;
     gl_PointSize = 10.0;
     vColor = vec4(0.8,0.8,0.8,1.0);
}

片段著色器

#version 300 es
precision mediump float;
in vec4 vColor;
out vec4 fragColor;
void main() {
     fragColor = vColor;
}

輸出如下：

上面的座標點註釋已經很清楚了，可以對照下面這張圖來理解對應的座標

基於頂點法繪製立方體

/**
 * @anchor: andy
 * @date: 2018-11-09
 * @description:
 */
public class ColorCubeRenderer implements GLSurfaceView.Renderer {

    private final FloatBuffer vertexBuffer, colorBuffer;

    private int mProgram;

    private static final int VERTEX_POSITION_SIZE = 3;

    private static final int VERTEX_COLOR_SIZE = 4;

    /**
     * 點的座標
     */
    private float[] vertexPoints = new float[]{
            //背面矩形
            0.75f, 0.75f, 0.0f, //V5
            -0.25f, 0.75f, 0.0f, //V6
            -0.25f, -0.25f, 0.0f, //V7
            0.75f, 0.75f, 0.0f, //V5
            -0.25f, -0.25f, 0.0f, //V7
            0.75f, -0.25f, 0.0f, //V4

            //左側矩形
            -0.25f, 0.75f, 0.0f, //V6
            -0.75f, 0.25f, 0.0f, //V1
            -0.75f, -0.75f, 0.0f, //V2
            -0.25f, 0.75f, 0.0f, //V6
            -0.75f, -0.75f, 0.0f, //V2
            -0.25f, -0.25f, 0.0f, //V7

            //底部矩形
            0.75f, -0.25f, 0.0f, //V4
            -0.25f, -0.25f, 0.0f, //V7
            -0.75f, -0.75f, 0.0f, //V2
            0.75f, -0.25f, 0.0f, //V4
            -0.75f, -0.75f, 0.0f, //V2
            0.25f, -0.75f, 0.0f, //V3

            //正面矩形
            0.25f, 0.25f, 0.0f,  //V0
            -0.75f, 0.25f, 0.0f, //V1
            -0.75f, -0.75f, 0.0f, //V2
            0.25f, 0.25f, 0.0f,  //V0
            -0.75f, -0.75f, 0.0f, //V2
            0.25f, -0.75f, 0.0f, //V3

            //右側矩形
            0.75f, 0.75f, 0.0f, //V5
            0.25f, 0.25f, 0.0f, //V0
            0.25f, -0.75f, 0.0f, //V3
            0.75f, 0.75f, 0.0f, //V5
            0.25f, -0.75f, 0.0f, //V3
            0.75f, -0.25f, 0.0f, //V4

            //頂部矩形
            0.75f, 0.75f, 0.0f, //V5
            -0.25f, 0.75f, 0.0f, //V6
            -0.75f, 0.25f, 0.0f, //V1
            0.75f, 0.75f, 0.0f, //V5
            -0.75f, 0.25f, 0.0f, //V1
            0.25f, 0.25f, 0.0f  //V0
    };


    //立方體的頂點顏色
    private float[] colors = {
            //背面矩形顏色
            1f, 0f, 1f, 1f,
            1f, 0f, 1f, 1f,
            1f, 0f, 1f, 1f,
            1f, 0f, 1f, 1f,
            1f, 0f, 1f, 1f,
            1f, 0f, 1f, 1f,

            //左側矩形顏色
            0f, 1f, 0f, 1f,
            0f, 1f, 0f, 1f,
            0f, 1f, 0f, 1f,
            0f, 1f, 0f, 1f,
            0f, 1f, 0f, 1f,
            0f, 1f, 0f, 1f,

            //底部矩形顏色
            1f, 0f, 0.5f, 1f,
            1f, 0f, 0.5f, 1f,
            1f, 0f, 0.5f, 1f,
            1f, 0f, 0.5f, 1f,
            1f, 0f, 0.5f, 1f,
            1f, 0f, 0.5f, 1f,

            //正面矩形顏色
            0.2f, 0.3f, 0.2f, 1f,
            0.2f, 0.3f, 0.2f, 1f,
            0.2f, 0.3f, 0.2f, 1f,
            0.2f, 0.3f, 0.2f, 1f,
            0.2f, 0.3f, 0.2f, 1f,
            0.2f, 0.3f, 0.2f, 1f,

            //右側矩形顏色
            0.1f, 0.2f, 0.3f, 1f,
            0.1f, 0.2f, 0.3f, 1f,
            0.1f, 0.2f, 0.3f, 1f,
            0.1f, 0.2f, 0.3f, 1f,
            0.1f, 0.2f, 0.3f, 1f,
            0.1f, 0.2f, 0.3f, 1f,

            //頂部矩形顏色
            0.3f, 0.4f, 0.5f, 1f,
            0.3f, 0.4f, 0.5f, 1f,
            0.3f, 0.4f, 0.5f, 1f,
            0.3f, 0.4f, 0.5f, 1f,
            0.3f, 0.4f, 0.5f, 1f,
            0.3f, 0.4f, 0.5f, 1f
    };

    public ColorCubeRenderer() {
        //分配記憶體空間,每個浮點型佔4位元組空間
        vertexBuffer = ByteBuffer.allocateDirect(vertexPoints.length * 4)
                .order(ByteOrder.nativeOrder())
                .asFloatBuffer();
        //傳入指定的座標資料
        vertexBuffer.put(vertexPoints);
        vertexBuffer.position(0);

        //分配記憶體空間,每個浮點型佔4位元組空間
        colorBuffer = ByteBuffer.allocateDirect(colors.length * 4)
                .order(ByteOrder.nativeOrder())
                .asFloatBuffer();
        //傳入指定的資料
        colorBuffer.put(colors);
        colorBuffer.position(0);
    }

    @Override
    public void onSurfaceCreated(GL10 gl, EGLConfig config) {
        //設定背景顏色
        GLES30.glClearColor(0.5f, 0.5f, 0.5f, 0.5f);
        //編譯
        final int vertexShaderId = ShaderUtils.compileVertexShader(ResReadUtils.readResource(R.raw.vertex_colorcube_shader));
        final int fragmentShaderId = ShaderUtils.compileFragmentShader(ResReadUtils.readResource(R.raw.fragment_colorcube_shader));
        //連結程式片段
        mProgram = ShaderUtils.linkProgram(vertexShaderId, fragmentShaderId);
        //使用程式片段
        GLES30.glUseProgram(mProgram);

        GLES30.glVertexAttribPointer(0, VERTEX_POSITION_SIZE, GLES30.GL_FLOAT, false, 0, vertexBuffer);
        //啟用位置頂點屬性
        GLES30.glEnableVertexAttribArray(0);


        GLES30.glVertexAttribPointer(1, VERTEX_COLOR_SIZE, GLES30.GL_FLOAT, false, 0, colorBuffer);
        //啟用顏色頂點屬性
        GLES30.glEnableVertexAttribArray(1);

    }

    @Override
    public void onSurfaceChanged(GL10 gl, int width, int height) {
        GLES30.glViewport(0, 0, width, height);

    }

    @Override
    public void onDrawFrame(GL10 gl) {
        GLES30.glClear(GLES30.GL_COLOR_BUFFER_BIT);

        GLES30.glDrawArrays(GLES30.GL_TRIANGLES, 0, 36);

    }
}

輸出顯示如下：

聰明的你一定發現了，其實繪製立方體我們只需要繪製外層的三個面就可以了，去掉頂點位置和顏色屬性中的，背面，左側以及底部相關的屬性，只保留最外層的三個可見面，執行試試看，結果也是一樣

基於索引法繪製立方體

/**
 * @anchor: andy
 * @date: 2018-11-09
 * @description: 基於索引法繪製立方體
 */
public class IndicesCubeRenderer implements GLSurfaceView.Renderer {

    private final FloatBuffer vertexBuffer, colorBuffer;

    private final ShortBuffer indicesBuffer;

    private int mProgram;

    private static final int VERTEX_POSITION_SIZE = 3;

    private static final int VERTEX_COLOR_SIZE = 4;

    /**
     * 點的座標
     */
    private float[] vertexPoints = new float[]{
            //正面矩形
            0.25f, 0.25f, 0.0f,  //V0
            -0.75f, 0.25f, 0.0f, //V1
            -0.75f, -0.75f, 0.0f, //V2
            0.25f, -0.75f, 0.0f, //V3

            //背面矩形
            0.75f, -0.25f, 0.0f, //V4
            0.75f, 0.75f, 0.0f, //V5
            -0.25f, 0.75f, 0.0f, //V6
            -0.25f, -0.25f, 0.0f //V7
    };

    /**
     * 定義索引
     */
    private short[] indices = {
            //背面
            5, 6, 7, 5, 7, 4,
            //左側
            6, 1, 2, 6, 
              
           
              
              
            
            相關推薦
			   
            
            
            
 

    

    
    android平臺下OpenGL ES 3.0繪製立方體的幾種方式
       
 
  
  
 OpenGL ES 3.0學習實踐 
  
  android平臺下OpenGL ES 3.0從零開始 
  android平臺下OpenGL ES 3.0繪製純色背景 
  android平臺下OpenGL ES 3.0繪製圓點、直線和三角形 
  android平臺下OpenGL E 

  
 

    

    
    android平臺下OpenGL ES 3.0繪製純色背景
       
 
  
  
 OpenGL ES 3.0學習實踐 
  
  android平臺下OpenGL ES 3.0從零開始 
  android平臺下OpenGL ES 3.0繪製純色背景 
  android平臺下OpenGL ES 3.0繪製圓點、直線和三角形 
  android平臺下OpenGL E 

  
 

    

    
    android平臺下OpenGL ES 3.0繪製彩色三角形
       
 
  
  
 OpenGL ES 3.0學習實踐 
  
  android平臺下OpenGL ES 3.0從零開始 
  android平臺下OpenGL ES 3.0繪製純色背景 
  android平臺下OpenGL ES 3.0繪製圓點、直線和三角形 
  android平臺下OpenGL E 

  
 

    

    
    android平臺下OpenGL ES 3.0繪製圓點、直線和三角形
       
 
  
  
 OpenGL ES 3.0學習實踐 
  
  android平臺下OpenGL ES 3.0從零開始 
  android平臺下OpenGL ES 3.0繪製純色背景 
  android平臺下OpenGL ES 3.0繪製圓點、直線和三角形 
  android平臺下OpenGL E 

  
 

    

    
    android平臺下OpenGL ES 3.0從零開始
       
 
  
  
 OpenGL ES 3.0學習實踐 
  
  android平臺下OpenGL ES 3.0從零開始 
  android平臺下OpenGL ES 3.0繪製純色背景 
  android平臺下OpenGL ES 3.0繪製圓點、直線和三角形 
  android平臺下OpenGL E 

  
 

    

    
    android平臺下OpenGL ES 3.0從矩形中看矩陣和座標系
       
 
  
  
 OpenGL ES 3.0學習實踐 
  
  android平臺下OpenGL ES 3.0從零開始 
  android平臺下OpenGL ES 3.0繪製純色背景 
  android平臺下OpenGL ES 3.0繪製圓點、直線和三角形 
  android平臺下OpenGL E 

  
 

    

    
    android平臺下OpenGL ES 3.0著色語言基礎知識(下)
       
 
  
  
 OpenGL ES 3.0學習實踐 
  
  android平臺下OpenGL ES 3.0從零開始 
  android平臺下OpenGL ES 3.0繪製純色背景 
  android平臺下OpenGL ES 3.0繪製圓點、直線和三角形 
  android平臺下OpenGL E 

  
 

    

    
    android平臺下OpenGL ES 3.0例項詳解頂點屬性、頂點陣列
       
 
  
  
 OpenGL ES 3.0學習實踐 
  
  android平臺下OpenGL ES 3.0從零開始 
  android平臺下OpenGL ES 3.0繪製純色背景 
  android平臺下OpenGL ES 3.0繪製圓點、直線和三角形 
  android平臺下OpenGL E 

  
 

    

    
    android平臺下OpenGL ES 3.0例項詳解頂點緩衝區物件(VBO)和頂點陣列物件(VAO)
       
 
  
  
 OpenGL ES 3.0學習實踐 
  
  android平臺下OpenGL ES 3.0從零開始 
  android平臺下OpenGL ES 3.0繪製純色背景 
  android平臺下OpenGL ES 3.0繪製圓點、直線和三角形 
  android平臺下OpenGL E 

  
 

    

    
    android平臺下OpenGL ES 3.0使用GLSurfaceView對相機Camera預覽實時處理
       
 
  
  
 OpenGL ES 3.0學習實踐 
  
  android平臺下OpenGL ES 3.0從零開始 
  android平臺下OpenGL ES 3.0繪製純色背景 
  android平臺下OpenGL ES 3.0繪製圓點、直線和三角形 
  android平臺下OpenGL E 

  
 

    

    
    android平臺下OpenGL ES 3.0使用TextureView對相機Camera預覽實時處理
       
 
  
  
 OpenGL ES 3.0學習實踐 
  
  android平臺下OpenGL ES 3.0從零開始 
  android平臺下OpenGL ES 3.0繪製純色背景 
  android平臺下OpenGL ES 3.0繪製圓點、直線和三角形 
  android平臺下OpenGL E 

  
 

    

    
    android平臺下OpenGL ES 3.0實現2D紋理貼圖顯示bitmap
       
 
  
  
 OpenGL ES 3.0學習實踐 
  
  android平臺下OpenGL ES 3.0從零開始 
  android平臺下OpenGL ES 3.0繪製純色背景 
  android平臺下OpenGL ES 3.0繪製圓點、直線和三角形 
  android平臺下OpenGL E 

  
 

    

    
    android平臺下OpenGL ES 3.0從矩形中看矩陣和正交投影
      
							
							
							OpenGL ES 3.0學習實踐

目錄

繪製矩形
新建一個矩形渲染器：
public class RectangleRenderer implements GLSurfaceView.Renderer

定義頂點著色器：
#version 300 es
l 

  
 

    

    
    Android 為例編寫一個 OpenGL ES 3.0 例項，Native & Java 兩種實現
       
 
  
  
 一、簡介 
  
  通過這個 Sample，你將瞭解到 Android 中是怎麼使用 OpenGL ES 
  通過繪製一個簡單的靜態三角形，來簡單入門和了解它大致的流程（類似於 HelloWorld 工程） 
  介紹使用 Native 層 和 Java 層 兩種方式來分別實現 
  

  
 

    

    
    一個簡單的OpenGL ES 3.0 示例 （Android NDK jni）
      
                
OpenGL ES 3.0 上的一個三角形例子，網上可以下載到android skd 版（java）和 android ndk (c&c++版）
為了瞭解一下JNI，於是寫了如下小程式。
這個例子是使用jni, java中呼叫c中的程式碼完成三角形的渲染, 其中sh 

  
 

    

    
    Android 平臺下OpenGL繪製立方體（2）
      
							
							
							圖形類 ——本文用所引法繪製

構造方中初始化資料 和渲染器 
 private void initData() { 
        //獲得 頂點 顏色 和 索引的緩衝資料 
        //頂點 
        verBuffer = getFloa 

  
 

    

    
    android studio | openGL es 3.0增強現實（AR）開發 (1) 建立一個openGL es 3.0開發環境
      
							
							
							1.什麼是NDK，什麼是JNI？



NDK：Native Development Kit（原生開發工具包）, NDK允許使用者使用類似C / C++之類的原生程式碼語言執行部分程式。它包括下面的部分（1）從C / C++生成原生程式碼庫所需要的工具和buil 

  
 

    

    
    Android使用OpenGL ES 3.0實現隨手指旋轉3D立方體
      
							
							
							OpenGL ES在做普通應用方面3D使用的不多，但有時候實現一些有趣的功能也是蠻不錯的。畫立方體的的demo網上已經很多了，這次我們就實現一個隨手指旋轉的立方體，這個demo基本可以瞭解各個座標系轉換矩陣的使用了。 
先看一下最終效果： 
 
話不多說，直接上 

  
 

    

    
    Android 平臺下OpenGL繪製立方體（1）
      
							
							
							寫在文前的話

回顧Opengl繪製圖形的開發步驟

1.新建自己的View 實現 GLSurfaceView 
2.初始化著色器Render

1）設定Opengl 版本 非必需



2）設定著色器

3）設定渲染模式



4）實現 onSurfaceCr 

  
 

    

    
    Android平臺下OpenGL圖形編程
      alloc   arch   jsb   config   ble   _array   itl   conf   graphics   http://blog.csdn.net/jason0539/article/details/9164885
https://developer.android.com/

android平臺下OpenGL ES 3.0繪製立方體的幾種方式

OpenGL ES 3.0學習實踐

目錄

繪製圖元的幾個方法

基於線段的方式

基於頂點法繪製立方體

基於索引法繪製立方體

android平臺下OpenGL ES 3.0繪製立方體的幾種方式

android平臺下OpenGL ES 3.0繪製純色背景

android平臺下OpenGL ES 3.0繪製彩色三角形

android平臺下OpenGL ES 3.0繪製圓點、直線和三角形

android平臺下OpenGL ES 3.0從零開始

android平臺下OpenGL ES 3.0從矩形中看矩陣和座標系

android平臺下OpenGL ES 3.0著色語言基礎知識(下)

android平臺下OpenGL ES 3.0例項詳解頂點屬性、頂點陣列

android平臺下OpenGL ES 3.0例項詳解頂點緩衝區物件(VBO)和頂點陣列物件(VAO)

android平臺下OpenGL ES 3.0使用GLSurfaceView對相機Camera預覽實時處理

android平臺下OpenGL ES 3.0使用TextureView對相機Camera預覽實時處理

android平臺下OpenGL ES 3.0實現2D紋理貼圖顯示bitmap

android平臺下OpenGL ES 3.0從矩形中看矩陣和正交投影

Android 為例編寫一個 OpenGL ES 3.0 例項，Native & Java 兩種實現

一個簡單的OpenGL ES 3.0 示例（Android NDK jni）

Android 平臺下OpenGL繪製立方體（2）

android studio | openGL es 3.0增強現實（AR）開發 (1) 建立一個openGL es 3.0開發環境

Android使用OpenGL ES 3.0實現隨手指旋轉3D立方體

Android 平臺下OpenGL繪製立方體（1）

Android平臺下OpenGL圖形編程