Esempio di disegno di un triangolo su GLSurfaceView in OpenGL e uso di proiezione e vista della telecamera in Android

Questo esempio descrive come disegnare un triangolo su GLSurfaceView utilizzando OpenGL su Android e come utilizzare i metodi di proiezione e vista della camera. Condividiamo questo con tutti voi per riferimento, come segue:

Definire un triangolo

OpenGL ci permette di definire gli oggetti utilizzando coordinate tridimensionali. Prima di disegnare un triangolo, dobbiamo definire le coordinate di ciascun punto. Di solito utilizziamo array per memorizzare le coordinate dei vertici.

OpenGL ES predefinisce [0,0,0] (X,Y,Z) al centro di GLSurfaceView, [1,1,0] nell'angolo in alto a destra, [-1,-1,0] nell'angolo in basso a sinistra.

Disegnare un triangolo

Prima di disegnare un triangolo, dobbiamo comunicare a OpenGL che stiamo utilizzando un array di vertici. Solo dopo di ciò possiamo utilizzare la funzione di disegno per disegnare il triangolo.

实验步骤：

1. Aggiungere una nuova classe Triangolo

代码如下：

public class Triangolo {
  public Triangle()}}
  {
     float triangleCoords[] = {
          // X, Y, Z Questo è un triangolo equilatero
          -0.5f, -0.25f, 0,
           0.5f, -0.25f, 0,
           0.0f, 0.559016994f, 0
        };
        // Inizializza il buffer di cache dei vertici del triangolo
        ByteBuffer vbb = ByteBuffer.allocateDirect(
            // (numero di valori di coordinate * 4 byte per float)
            triangleCoords.length * 4);
        vbb.order(ByteOrder.nativeOrder());// Usa l'ordine dei byte della periferica hardware
        triangleVB = vbb.asFloatBuffer(); // Crea un buffer di float da ByteBuffer
        triangleVB.put(triangleCoords); // Aggiungi le coordinate dei vertici al buffer di cache
        triangleVB.position(0); // Porta il buffer di cache a leggere il primo coordinate
  }
  public void draw(GL10 gl)
  {
    gl.glColor4f(0.63671875f, 0.76953125f, 0.22265625f, 0.0f); // Imposta il colore corrente
    gl.glVertexPointer(3, GL10.GL_FLOAT, 0, triangleVB);// Imposta i vertici
    gl.glDrawArrays(GL10.GL_TRIANGLES, 0, 3);// Disegna un triangolo
  }
  private FloatBuffer triangleVB;
}

2. Aggiungi al tipo myGLRenderer un membro privato privateTriangle mTriangle e inizializzalo nel costruttore.

代码如下：

public myGLRenderer()
{
    mTriangle = new Triangle();
}

3. Aggiungi il metodo glEnableClientState() alla fine della funzione onSurfaceCreated() della classe myGLRenderer per abilitare l'array dei vertici.

代码如下：

@Override
public void onSurfaceCreated(GL10 gl, EGLConfig config) {
    // TODO Auto-generated method stub
    gl.glClearColor(0.5f, 0.5f, 0.5f, 1.0f);
    gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
}

4. 在myGLRenderer类的onDrawFrame()函数最后添加三角形绘制方法。

代码如下：

@Override
public void onDrawFrame(GL10 gl) {
    // TODO Auto-generated method stub
    gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);
    mTriangle.draw(gl);
}

这样，我们便完成了一个平面三角形的绘制。但我们发现这个三角形并不像我们定义的那样是一个等边三角形，这是由于OpenGL总假设我们的屏幕是一个正方形，这样在绘制的时候最终图形会随着屏幕长宽比例的不同而被拉伸。为了得到正确的显示，我们需要将图形投影到正确的位置。这一功能我们在下一节进行实现。

Android设备屏幕通常不是正方形的，而OpenGL总是默认地将正方形坐标系投影到这一设备上，这就导致图形无法按真实比例显示。要解决这一问题，我们可以使用OpenGL 的投影模式和相机视图将图形的坐标进行转换以适应不同的设备显示。

实验步骤：

1. 修改myGLRenderer类的onSurfaceCreated()函数来启用GL10.GL_PROJECTION模式，计算屏幕的长宽比并使用这一比例来转换物体的坐标。

代码如下：

@Override
public void onSurfaceChanged(GL10 gl, int width, int height) {
    // TODO Auto-generated method stub
    gl.glViewport(0, 0, width, height);
    float ratio = (float) width / height;
    gl.glMatrixMode(GL10.GL_PROJECTION); // 设置当前矩阵为投影矩阵
    gl.glLoadIdentity(); // 重置矩阵为初始值
    gl.glFrustumf(-ratio, ratio, -1, 1, 3, 7); // 根据长宽比设置投影矩阵
}

2. 修改myGLRenderer的onDrawFrame()方法，启用MODELVIEW模式，并使用GLU.gluLookAt()来设置视点。

代码如下：

@Override
public void onDrawFrame(GL10 gl) {
  // TODO Auto-generated method stub
    gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);
    // Impostare la matrice corrente come modello di vista
    gl.glMatrixMode(GL10.GL_MODELVIEW);
    gl.glLoadIdentity();  // reimpostare la matrice al suo stato predefinito
    // Impostare il punto di vista
    GLU.gluLookAt(gl, 0, 0, -5, 0f, 0f, 0f, 0f, 1.0f, 0.0f);
    mTriangle.draw(gl);
}

In questo modo, le proporzioni dei grafici che disegniamo sono sempre corrette, non vengono stirate e deformati dall'impatto dei dispositivi.

Chi è interessato a ulteriori contenuti su Android può consultare le nostre sezioni speciali: 'Concetti di elaborazione di immagini e grafica su Android', 'Manuale di introduzione e avanzamento di sviluppo Android', 'Riassunto delle tecniche di debug e soluzioni dei problemi comuni su Android', 'Riassunto delle tecniche di operazione multimediale su Android (audio, video, registrazione, ecc.)', 'Riassunto dell'uso dei componenti di base su Android', 'Riassunto delle tecniche di View su Android', 'Riassunto delle tecniche di layout su Android' e 'Riassunto dell'uso dei controlli su Android'.

Spero che il contenuto di questo articolo possa essere utile per la progettazione di applicazioni Android.

Così, le proporzioni dei grafici che disegniamo sono sempre corrette, non vengono stirate e deformati dall'impatto dei dispositivi.