Android OpenGL ES 6. Draw by index

preface

In this section, we draw a more complex shape, as shown below.

The index map

The figures in the figure are labeled in the later stage, not drawn by GL.

Based on what we learned before, we know that this figure can be decomposed into four triangles, with numbers representing the vertices, respectively

• 0, 1, 2
• 0, 2, 3
• 0, 4, 1
• 3, 2, 5

In the program, each vertex corresponds to x and y coordinates, so our vertex array data needs to be declared as follows:

Private static final float[] POINT_DATA = {// 0, 1, 2-0.5f, -0.5f, 0.5f, -0.5f, 0.5f, // 0, 2, 3-0.5f, -0.5f, 0.5 f, f, 0.5-0.5 f to 0.5 f, / / 0, 4, 1-0.5 f to 0.5 f, 0 f, 1.0 f, f, 0.5-0.5 f, / / 3, 2, 5-0.5 f, f 0.5, 0.5 f, f 0.5, 0 f, 1.0 f, };Copy the code

So, the actual declared number of vertices is 4 * 3 = 12. Many of these vertices are repeatable, which leads to two problems:

1. Too much vertex data makes the code less readable and needs to be commented out every few lines
2. Duplicate vertex data, resulting in a waste of memory

This drawing method is called vertex drawing. This chapter will introduce a new technique: index drawing.

Code implementation

1. Define coordinates and indexes

Vertex data / * * * * / private static final float [] POINT_DATA = {0.5 f, 0.5 f, 0.5 f to 0.5 f, f 0.5, 0.5 f to 0.5 f, f 0.5, 0 f, 1.0 f to 1.0 f, 0 f,,}; /** * Array draw index: currently draw triangle, */ private static final short[] VERTEX_INDEX = {0, 1, 2, 0, 2, 3, 0, 4, 1, 3, 2, 5};Copy the code

The first float array here defines the coordinate position of each vertex.

The second array is of type short and defines the drawing order of the previous array. That is, 0 represents the data in group 0 of the POINT_DATA array (-0.5F, -0.5f). Again, we will later declare two points as one vertex, so index 0 is not the zeroth POINT_DATA[0], but the zeroth group.

2. Draw graphs

@Override public void onDrawFrame(GL10 glUnused) { GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT); // 1. Draw mode; 2. The length of data read from the array; 3. Format of loaded data; 4. Use glES20.gldrawelements (gles20.gl_Triangles, vertex_index.length, GLES20.gl_unsigned_short,) for the read data buffer. mVertexIndexBuffer); }Copy the code

Here a new method gles20.glDRAwelements is used, and the method parameters are respectively

1. Graphic drawing mode
2. Number of vertices drawn
3. The data format of the index
4. A Buffer of indexed data

Here is a review of the vertex method drawing method glES20.gldrawarrays, method parameters are respectively

1. Graphic drawing mode
2. The starting point from which data is read from vertex data (in points, not vectors)
3. Number of vertices drawn

3. Comparison between vertex method and index method

The way the index is declared, the code is much more readable, but how much better is the performance? First, we know that in GL, a Float is worth 4 bytes and a Short is worth 2 bytes.

So the 12 vertices declared in the preface, that is, the vertex method drawing method, takes up the memory space is:

12(number of vertices) * 2(group of x and y vectors) * 4(Float format bytes) = 96 bytes

The memory space occupied by index method is:

6(number of vertices) x 2(a group of x and Y vectors) x 4(Float bytes) + 12(index bytes) x 2(Short bytes) = 48 + 24 = 72 bytes

The graph vertex attributes drawn in this chapter are relatively single, with only vertex positions. If other vertex information such as color is included, the vertex method will occupy more memory.

Summarize the contrast between the two drawing methods.

reference

See the Android OpenGL ES learning materials list of blogs, information.

GitHub code Engineering

Please refer to my GitHub project GLStudio for all relevant code for this series of courses.

The course catalog

Android OpenGL ES tutorials are available in the Android OpenGL ES tutorial