鍍金池/ 教程/ Android/ 真正的 3D 圖形
                                          3D 繪圖基本概念
                                          概述
                                          真正的 3D 圖形
                                          添加顏色
                                          3D 坐標變換
                                          構造
                                          材質渲染

                                          真正的 3D 圖形

                                          前面的例子盡管使用了 OpenGL ES 3D 圖形庫,但繪制的還是二維圖形(平面上的正方形)。Mesh(網格,三角面)是構成空間形體的基本元素,前面的正方形也是有兩個 Mesh 構成的。本篇將介紹使用 Mesh 構成四面體,椎體等基本空間形體。

                                          Design 設計

                                          在使用 OpenGL 框架時一個好的設計原則是使用 “Composite Pattern”,本篇采用如下設計:

                                          http://wiki.jikexueyuan.com/project/opengl-es-basics/images/28.png" alt="" />

                                          Mesh

                                          首先定義一個基類 Mesh,所有空間形體最基本的構成元素為 Mesh(三角形網格) ,其基本定義如下:

                                          public class Mesh {
                                           // Our vertex buffer.
                                           private FloatBuffer verticesBuffer = null;
                                           // Our index buffer.
                                           private ShortBuffer indicesBuffer = null;
                                           // The number of indices.
                                           private int numOfIndices = -1;
                                           // Flat Color
                                           private float[] rgba
                                           = new float[] { 1.0f, 1.0f, 1.0f, 1.0f };
                                           // Smooth Colors
                                           private FloatBuffer colorBuffer = null;
                                           // Translate params.
                                           public float x = 0;
                                           public float y = 0;
                                           public float z = 0;
                                           // Rotate params.
                                           public float rx = 0;
                                           public float ry = 0;
                                           public float rz = 0;
                                           public void draw(GL10 gl) {
                                           // Counter-clockwise winding.
                                           gl.glFrontFace(GL10.GL_CCW);
                                           // Enable face culling.
                                           gl.glEnable(GL10.GL_CULL_FACE);
                                           // What faces to remove with the face culling.
                                           gl.glCullFace(GL10.GL_BACK);
                                           // Enabled the vertices buffer for writing and
                                           //to be used during
                                           // rendering.
                                           gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
                                           // Specifies the location and data format
                                           //of an array of vertex
                                           // coordinates to use when rendering.
                                           gl.glVertexPointer(3, GL10.GL_FLOAT, 0, verticesBuffer);
                                           // Set flat color
                                           gl.glColor4f(rgba[0], rgba[1], rgba[2], rgba[3]);
                                           // Smooth color
                                           if (colorBuffer != null) {
                                           // Enable the color array buffer to be
                                           //used during rendering.
                                           gl.glEnableClientState(GL10.GL_COLOR_ARRAY);
                                           gl.glColorPointer(4, GL10.GL_FLOAT, 0, colorBuffer);
                                           }
                                           gl.glTranslatef(x, y, z);
                                           gl.glRotatef(rx, 1, 0, 0);
                                           gl.glRotatef(ry, 0, 1, 0);
                                           gl.glRotatef(rz, 0, 0, 1);
                                           // Point out the where the color buffer is.
                                           gl.glDrawElements(GL10.GL_TRIANGLES, numOfIndices,
                                           GL10.GL_UNSIGNED_SHORT, indicesBuffer);
                                           // Disable the vertices buffer.
                                           gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
                                           // Disable face culling.
                                           gl.glDisable(GL10.GL_CULL_FACE);
                                           }
                                           protected void setVertices(float[] vertices) {
                                           // a float is 4 bytes, therefore
                                           //we multiply the number if
                                           // vertices with 4.
                                           ByteBuffer vbb
                                           = ByteBuffer.allocateDirect(vertices.length * 4);
                                           vbb.order(ByteOrder.nativeOrder());
                                           verticesBuffer = vbb.asFloatBuffer();
                                           verticesBuffer.put(vertices);
                                           verticesBuffer.position(0);
                                           }
                                           protected void setIndices(short[] indices) {
                                           // short is 2 bytes, therefore we multiply
                                           //the number if
                                           // vertices with 2.
                                           ByteBuffer ibb
                                           = ByteBuffer.allocateDirect(indices.length * 2);
                                           ibb.order(ByteOrder.nativeOrder());
                                           indicesBuffer = ibb.asShortBuffer();
                                           indicesBuffer.put(indices);
                                           indicesBuffer.position(0);
                                           numOfIndices = indices.length;
                                           }
                                           protected void setColor(float red, float green,
                                           float blue, float alpha) {
                                           // Setting the flat color.
                                           rgba[0] = red;
                                           rgba[1] = green;
                                           rgba[2] = blue;
                                           rgba[3] = alpha;
                                           }
                                           protected void setColors(float[] colors) {
                                           // float has 4 bytes.
                                           ByteBuffer cbb
                                           = ByteBuffer.allocateDirect(colors.length * 4);
                                           cbb.order(ByteOrder.nativeOrder());
                                           colorBuffer = cbb.asFloatBuffer();
                                           colorBuffer.put(colors);
                                           colorBuffer.position(0);
                                           }
                                          }  
                                          • setVertices 允許子類重新定義頂點坐標。
                                          • setIndices 允許子類重新定義頂點的順序。
                                          • setColor /setColors 允許子類重新定義顏色。
                                          • x,y,z 定義了平移變換的參數。
                                          • rx,ry,rz 定義旋轉變換的參數。

                                          Plane

                                          有了 Mesh 定義之后,再來構造 Plane,plane 可以有寬度,高度和深度,寬度定義為沿 X 軸方向的長度,深度定義為沿 Z 軸方向長度,高度為 Y 軸方向。

                                          http://wiki.jikexueyuan.com/project/opengl-es-basics/images/29.png" alt="" />

                                          Segments 為形體寬度,高度,深度可以分成的份數。 Segments 在構造一個非均勻分布的 Surface 特別有用,比如在一個游戲場景中,構造地貌,使的Z軸的值隨機分布在 -0.1 到 0.1 之間,然后給它渲染好看的材質就可以造成地圖凹凸不平的效果。

                                          http://wiki.jikexueyuan.com/project/opengl-es-basics/images/30.png" alt="" />

                                          上面圖形中 Segments 為一正方形,但在 OpenGL 中我們需要使用三角形,所有需要將 Segments 分成兩個三角形。為 Plane 定義兩個構造函數:

                                          // Let you decide the size of the plane but still only one segment.
                                          public Plane(float width, float height)
                                          // For alla your settings.
                                          public Plane(float width, float height, int widthSegments, int heightSegments)

                                          比如構造一個 1 unit 寬和 1 unit 高,并分成 4 個 Segments,使用圖形表示如下:

                                          http://wiki.jikexueyuan.com/project/opengl-es-basics/images/31.png" alt="" />

                                          左邊的圖顯示了 segments ,右邊的圖為需要創建的 Face(三角形)。

                                          Plane 類的定義如下:

                                          public class Plane extends Mesh {
                                           public Plane() {
                                           this(1, 1, 1, 1);
                                           }
                                           public Plane(float width, float height) {
                                           this(width, height, 1, 1);
                                           }
                                           public Plane(float width, float height, int widthSegments,
                                           int heightSegments) {
                                           float[] vertices
                                           = new float[(widthSegments + 1)
                                           * (heightSegments + 1) * 3];
                                           short[] indices
                                           = new short[(widthSegments + 1)
                                           * (heightSegments + 1)* 6];
                                           float xOffset = width / -2;
                                           float yOffset = height / -2;
                                           float xWidth = width / (widthSegments);
                                           float yHeight = height / (heightSegments);
                                           int currentVertex = 0;
                                           int currentIndex = 0;
                                           short w = (short) (widthSegments + 1);
                                           for (int y = 0; y < heightSegments + 1; y++) {
                                           for (int x = 0; x < widthSegments + 1; x++) {
                                           vertices[currentVertex] = xOffset + x * xWidth;
                                           vertices[currentVertex + 1] = yOffset + y * yHeight;
                                           vertices[currentVertex + 2] = 0;
                                           currentVertex += 3;
                                           int n = y * (widthSegments + 1) + x;
                                           if (y < heightSegments && x < widthSegments) {
                                           // Face one
                                           indices[currentIndex] = (short) n;
                                           indices[currentIndex + 1] = (short) (n + 1);
                                           indices[currentIndex + 2] = (short) (n + w);
                                           // Face two
                                           indices[currentIndex + 3] = (short) (n + 1);
                                           indices[currentIndex + 4] = (short) (n + 1 + w);
                                           indices[currentIndex + 5] = (short) (n + 1 + w - 1);
                                           currentIndex += 6;
                                           }
                                           }
                                           }
                                           setIndices(indices);
                                           setVertices(vertices);
                                           }
                                          }  

                                          Cube

                                          下面來定義一個正方體(Cube),為簡單起見,這個四面體只可以設置寬度,高度,和深度,沒有和 Plane 一樣提供 Segments 支持。

                                          public class Cube extends Mesh {
                                           public Cube(float width, float height, float depth) {
                                           width  /= 2;
                                           height /= 2;
                                           depth  /= 2;
                                           float vertices[] = { -width, -height, -depth, // 0
                                           width, -height, -depth, // 1
                                           width,  height, -depth, // 2
                                           -width,  height, -depth, // 3
                                           -width, -height,  depth, // 4
                                           width, -height,  depth, // 5
                                           width,  height,  depth, // 6
                                           -width,  height,  depth, // 7
                                           };
                                           short indices[] = { 0, 4, 5,
                                           0, 5, 1,
                                           1, 5, 6,
                                           1, 6, 2,
                                           2, 6, 7,
                                           2, 7, 3,
                                           3, 7, 4,
                                           3, 4, 0,
                                           4, 7, 6,
                                           4, 6, 5,
                                           3, 0, 1,
                                           3, 1, 2, };
                                           setIndices(indices);
                                           setVertices(vertices);
                                           }
                                          }  

                                          Group

                                          Group 可以用來管理多個空間幾何形體,如果把 Mesh 比作 Android 的 View ,Group 可以看作 Android 的 ViewGroup,Android 的 View 的設計也是采用的 “Composite Pattern”。

                                          Group 的主要功能是把針對 Group 的操作(如draw) 分發到 Group 中的每個成員對應的操作(如draw)。

                                          Group 定義如下:

                                          public class Group extends Mesh {
                                           private Vector<Mesh> children = new Vector<Mesh>();
                                           @Override
                                           public void draw(GL10 gl) {
                                           int size = children.size();
                                           for( int i = 0; i < size; i++)
                                           children.get(i).draw(gl);
                                           }
                                           /**
                                           * @param location
                                           * @param object
                                           * @see java.util.Vector#add(int, java.lang.Object)
                                           */
                                           public void add(int location, Mesh object) {
                                           children.add(location, object);
                                           }
                                           /**
                                           * @param object
                                           * @return
                                           * @see java.util.Vector#add(java.lang.Object)
                                           */
                                           public boolean add(Mesh object) {
                                           return children.add(object);
                                           }
                                           /**
                                           *
                                           * @see java.util.Vector#clear()
                                           */
                                           public void clear() {
                                           children.clear();
                                           }
                                           /**
                                           * @param location
                                           * @return
                                           * @see java.util.Vector#get(int)
                                           */
                                           public Mesh get(int location) {
                                           return children.get(location);
                                           }
                                           /**
                                           * @param location
                                           * @return
                                           * @see java.util.Vector#remove(int)
                                           */
                                           public Mesh remove(int location) {
                                           return children.remove(location);
                                           }
                                           /**
                                           * @param object
                                           * @return
                                           * @see java.util.Vector#remove(java.lang.Object)
                                           */
                                           public boolean remove(Object object) {
                                           return children.remove(object);
                                           }
                                           /**
                                           * @return
                                           * @see java.util.Vector#size()
                                           */
                                           public int size() {
                                           return children.size();
                                           }
                                          }  

                                          其它建議

                                          上面我們定義里 Mesh, Plane, Cube 等基本空間幾何形體,對于構造復雜圖形(如人物),可以預先創建一些通用的幾何形體,如果在組合成較復雜的形體。除了上面的基本形體外,可以創建如 Cone,Pryamid, Cylinder 等基本形體以備后用。

                                          http://wiki.jikexueyuan.com/project/opengl-es-basics/images/32.png" alt="" />

                                          本例示例代碼下載,顯示結果如下:

                                          http://wiki.jikexueyuan.com/project/opengl-es-basics/images/33.png" alt="" />

                                          上一篇:構造下一篇:3D 坐標變換
                                          人妻精品动漫h无码中字