能够定义要在 OpenGL ES 视图环境中绘制的形状是创建高端图形作品的第一步。在没有掌握 OpenGL ES 期望您如何定义图形对象的一些基本知识的情况下，使用 OpenGL ES 绘制可能有些棘手。
本课介绍了相对于 Android 设备屏幕的 OpenGL ES 坐标系，以及定义形状、形状面、三角形和方形的基础知识。
定义三角形
通过 OpenGL ES，您可以使用三维空间中的坐标定义绘制的对象。因此，要绘制三角形，您必须先定义其坐标。在 OpenGL 中，执行此操作的典型方式是为坐标定义浮点数的顶点数组。为了最大限度地提高工作效率，您可以将这些坐标写入 ByteBuffer 中，它会传递到 OpenGL ES 图形管道进行处理。
Kotlin
// number of coordinates per vertex in this array
const val COORDS_PER_VERTEX = 3
var triangleCoords = floatArrayOf( // in counterclockwise order:
0.0f, 0.622008459f, 0.0f, // top
-0.5f, -0.311004243f, 0.0f, // bottom left
0.5f, -0.311004243f, 0.0f // bottom right
)
class Triangle {
// Set color with red, green, blue and alpha (opacity) values
val color = floatArrayOf(0.63671875f, 0.76953125f, 0.22265625f, 1.0f)
private var vertexBuffer: FloatBuffer =
// (number of coordinate values * 4 bytes per float)
ByteBuffer.allocateDirect(triangleCoords.size * 4).run {
// use the device hardware's native byte order
order(ByteOrder.nativeOrder())
// create a floating point buffer from the ByteBuffer
asFloatBuffer().apply {
// add the coordinates to the FloatBuffer
put(triangleCoords)
// set the buffer to read the first coordinate
position(0)
}
}
}
Java
public class Triangle {
private FloatBuffer vertexBuffer;
// number of coordinates per vertex in this array
static final int COORDS_PER_VERTEX = 3;
static float triangleCoords[] = { // in counterclockwise order:
0.0f, 0.622008459f, 0.0f, // top
-0.5f, -0.311004243f, 0.0f, // bottom left
0.5f, -0.311004243f, 0.0f // bottom right
};
// Set color with red, green, blue and alpha (opacity) values
float color[] = { 0.63671875f, 0.76953125f, 0.22265625f, 1.0f };
public Triangle() {
// initialize vertex byte buffer for shape coordinates
ByteBuffer bb = ByteBuffer.allocateDirect(
// (number of coordinate values * 4 bytes per float)
triangleCoords.length * 4);
// use the device hardware's native byte order
bb.order(ByteOrder.nativeOrder());
// create a floating point buffer from the ByteBuffer
vertexBuffer = bb.asFloatBuffer();
// add the coordinates to the FloatBuffer
vertexBuffer.put(triangleCoords);
// set the buffer to read the first coordinate
vertexBuffer.position(0);
}
}
默认情况下，OpenGL ES 会假定一个坐标系，其中 [0,0,0] (X,Y,Z) 指定 GLSurfaceView 帧的中心，[1,1,0] 指定帧的右上角，而 [-1,-1,0] 指定帧的左下角。如需查看此坐标系的图示，请参阅 OpenGL ES 开发者指南。
请注意，此形状的坐标是按照逆时针顺序定义的。绘制顺序非常重要，因为它定义了哪一边是形状的正面（您通常想要绘制的那一面），哪一边是背面（您可以使用 OpenGL ES 面剔除功能选择不绘制的那一面）。如需详细了解面和剔除功能，请参阅 OpenGL ES 开发者指南。
定义方形
在 OpenGL 中定义三角形非常简单，但如果您希望定义稍微复杂一点的图形呢？假设定义方形呢？有多种方式可以执行此操作，但在 OpenGL ES 中绘制此类形状的典型方式是使用两个绘制在一起的三角形：
图 1. 使用两个三角形绘制一个方形。
同样，对于表示该形状的两个三角形，您应按逆时针顺序定义顶点，并将这些值放入 ByteBuffer 中。为了避免两次定义这两个三角形共用的两个坐标，请使用绘制列表告知 OpenGL ES 图形管道如何绘制这些顶点。下面是此形状的代码：
Kotlin
// number of coordinates per vertex in this array
const val COORDS_PER_VERTEX = 3
var squareCoords = floatArrayOf(
-0.5f, 0.5f, 0.0f, // top left
-0.5f, -0.5f, 0.0f, // bottom left
0.5f, -0.5f, 0.0f, // bottom right
0.5f, 0.5f, 0.0f // top right
)
class Square2 {
private val drawOrder = shortArrayOf(0, 1, 2, 0, 2, 3) // order to draw vertices
// initialize vertex byte buffer for shape coordinates
private val vertexBuffer: FloatBuffer =
// (# of coordinate values * 4 bytes per float)
ByteBuffer.allocateDirect(squareCoords.size * 4).run {
order(ByteOrder.nativeOrder())
asFloatBuffer().apply {
put(squareCoords)
position(0)
}
}
// initialize byte buffer for the draw list
private val drawListBuffer: ShortBuffer =
// (# of coordinate values * 2 bytes per short)
ByteBuffer.allocateDirect(drawOrder.size * 2).run {
order(ByteOrder.nativeOrder())
asShortBuffer().apply {
put(drawOrder)
position(0)
}
}
}
Java
public class Square {
private FloatBuffer vertexBuffer;
private ShortBuffer drawListBuffer;
// number of coordinates per vertex in this array
static final int COORDS_PER_VERTEX = 3;
static float squareCoords[] = {
-0.5f, 0.5f, 0.0f, // top left
-0.5f, -0.5f, 0.0f, // bottom left
0.5f, -0.5f, 0.0f, // bottom right
0.5f, 0.5f, 0.0f }; // top right
private short drawOrder[] = { 0, 1, 2, 0, 2, 3 }; // order to draw vertices
public Square() {
// initialize vertex byte buffer for shape coordinates
ByteBuffer bb = ByteBuffer.allocateDirect(
// (# of coordinate values * 4 bytes per float)
squareCoords.length * 4);
bb.order(ByteOrder.nativeOrder());
vertexBuffer = bb.asFloatBuffer();
vertexBuffer.put(squareCoords);
vertexBuffer.position(0);
// initialize byte buffer for the draw list
ByteBuffer dlb = ByteBuffer.allocateDirect(
// (# of coordinate values * 2 bytes per short)
drawOrder.length * 2);
dlb.order(ByteOrder.nativeOrder());
drawListBuffer = dlb.asShortBuffer();
drawListBuffer.put(drawOrder);
drawListBuffer.position(0);
}
}
通过此示例，您可以简单了解如何使用 OpenGL 绘制比较复杂的形状。通常，您会使用各种三角形绘制对象。在下一节课中，您将学习如何在屏幕上绘制这些形状。