Android OpenGL ES plotting tutorial 3: Drawing Graphics

Android OpenGL ES plotting tutorial 3: Drawing Graphics
After defining the shapes to be drawn by OpenGL, you certainly want to draw them. Using OpenGL ES 2.0 to draw a graph may require more code than you think, because the API provides a large number of graphic rendering pipeline control interfaces.
This chapter describes how to use OpenGL ES 2.0 API to draw the shape defined in the previous chapter.
1. initialize the shape
Before you do any painting operations, you must initialize and load the shape of the Plan painting. Unless the structure (original coordinates) of the shape changes during execution, you should initialize them in the onSurfaceCreated () method in render to improve memory and execution efficiency.

Public void onSurfaceCreated (GL10 unused, EGLConfig config ){
...

// Initialize a triangle
MTriangle = new Triangle ();
// Initialize a square
MSquare = new Square ();
}

2. Draw shape
Using OpenGL ES 2.0 to draw a defined shape requires a lot of code, because you must provide a lot of details to the graphic rendering pipeline, especially, you need to define the following details:

Vertex Shader-OpenGL ES graphics code for rendering the vertices of a shape.
Vertex coloring tool-OpenGL ES graphics code for rendering shape vertices
Fragment Shader-OpenGL ES code for rendering the face of a shape with colors or textures.
Film element coloring tool-OpenGL ES graphic code for rendering a shape surface using color or texture
Program-An OpenGL ES object that contains the shaders you want to use for drawing one or more shapes.
Translated: Program-contains the OpenGL ES object used to draw the shape of the shadow.

You need at least one vertex shader to draw the shape, and one metadatabase to color the shape. These pasters must be compiled and added to OpenGL ES programs. The following is an example of how to draw a graph by defining the shader:

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;" +
"}";

The shader uses the OpenGL coloring language (GLSL) Code and must be compiled before it is used in the OpenGL ES environment. To compile the code, create a method in your renderer class:

Public static int loadShader (int type, String shaderCode ){

// Create a vertex shader type (gles‑gl _ VERTEX_SHADER)
// Or a fragment shader type (gles0000gl _ FRAGMENT_SHADER)
Int shader = GLES20.glCreateShader (type );

// Add the source code to the shader and compile it
GLES20.glShaderSource (shader, shaderCode );
GLES20.glCompileShader (shader );

Return shader;
}

To draw a graph, you must compile the shadow code, add them to the OpenGL ES programming object, link the program, and execute these operations in the constructor of the Drawing Object, so it will only be executed once.
Note: It is expensive to compile the OpenGL shader and link program in terms of CPU processing cycle and time, so you should avoid execution more than once. If you do not know the content of the shader at runtime, you should compile it only once when it is created, and then cache it for use.

Public class Triangle (){
...

Int vertexShader = loadShader (gles‑gl _ VERTEX_SHADER, vertexShaderCode );
Int fragmentShader = loadShader (gles‑gl _ FRAGMENT_SHADER, fragmentShaderCode );

MProgram = GLES20.glCreateProgram (); // create empty OpenGL ES Program
GLES20.glAttachShader (mProgram, vertexShader); // add the vertex shader to program
GLES20.glAttachShader (mProgram, fragmentShader); // add the fragment shader to program
GLES20.glLinkProgram (mProgram); // creates OpenGL ES program executables
}

At this time, you are ready to execute the actual drawing command. To use OpenGL ES for drawing, you need to specify some parameters to tell the rendering pipeline what to draw and how to draw. Because the drawing options can be distinguished by shapes, it is a good way to make your shape class contain the drawing logic.
Create the draw () method for painting. The following Code sets the position and color values of the vertex coloring tool and the sliced element coloring tool, and then executes the painting method.

Public void draw (){
// Add program to OpenGL ES environment
GLES20.glUseProgram (mProgram );

// Get handle to vertex shader's vPosition member
MPositionHandle = GLES20.glGetAttribLocation (mProgram, "vPosition ");

// Enable a handle to the triangle vertices
Gles20.glablevertexattribarray (mPositionHandle );

// Prepare the triangle coordinate data
GLES20.glVertexAttribPointer (mPositionHandle, COORDS_PER_VERTEX,
Gles‑gl _ FLOAT, false,
VertexStride, vertexBuffer );

// Get handle to fragment shader's vColor member
MColorHandle = GLES20.glGetUniformLocation (mProgram, "vColor ");

// Set color for drawing the triangle
GLES20.glUniform4fv (mColorHandle, 1, color, 0 );

// Draw the triangle
Gles‑gldrawarrays (gles‑gl _ TRIANGLES, 0, vertexCount );

// Disable vertex array
GLES20.glDisableVertexAttribArray (mPositionHandle );
}

When all these codes are used, you only need to call the draw method under the onDrawFrame () method of renderer to draw objects. The following is the execution result of the program:



This sample code has some problems. First, it won't impress your friends. Second, when the screen direction changes, the shape will change, a little squashed. The reason the shape is distorted is that the vertex of the object does not follow the ratio of the area displayed by GLSurfaceView on the screen. You can use the projection and camera view described in the next section to fix this problem.
Finally, this triangle is fixed and boring. In subsequent courses, you can learn how to rotate this shape to make OpenGL ES graphic pipelines more interesting.