How to paint 2D Interface over 3D render

Tutorials concerning the OpenGL® ES cross-platform API for full-function 2D and 3D graphics on the Google-Android platform.

How to paint 2D Interface over 3D render

Postby SkyNet800 » Wed Apr 01, 2009 5:08 pm

Hello.

I´m making a 3D Game (rally game ;D) .

At this time, I´m trying to paint a 2D Interface over a 3D rendered scene, but when I try to create the Cavas, using "mySurfaceHolder.lockCanvas", this method returns null. It´s like if Opengl locks surface and I can´t access to it.

Does anybody knows how can I do that?
SkyNet800
Junior Developer
Junior Developer
 
Posts: 20
Joined: Tue Feb 24, 2009 11:44 am

Top

Postby B_Thax » Tue Apr 07, 2009 1:03 pm

Normally a 2D surface in OpenGL or Direct X is just a plane drawn after all your 3D work is done. Also OpenGL can priorities some pixels against others using the same depth-value. Have a look at Nehe OpenGL (http://nehe.gamedev.net/) to see how he did it.

If I find some code I'm using to render a 2D scene I'll post it.
User avatar
B_Thax
Junior Developer
Junior Developer
 
Posts: 13
Joined: Thu Jul 17, 2008 5:55 pm
Location: Palma de Mallorca

Postby SkyNet800 » Wed Apr 15, 2009 11:30 am

At last,i´ve done it by texturizing 3D TRIANGLES, but using some modifications:


First I take real screen size by this function located at Surface class:

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. onSizeChanged(int w, int h, int oldw, int oldh)
  2.  
  3.    {
  4.  
  5.         if(w != 0 && h != 0)
  6.  
  7.         {
  8.  
  9.                 screenW = w;
  10.  
  11.                 screenH = h;
  12.  
  13.         }
  14.  
  15.   }
  16.  
  17.  
Parsed in 0.032 seconds, using GeSHi 1.0.8.4


Then, once painted all 3D game, I can paint 2D INTERFACE setting up GL10:

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. // Reset projection matrix:
  2.  
  3.    gl.glMatrixMode (GL10.GL_PROJECTION);
  4.  
  5.    gl.glLoadIdentity ();
  6.  
  7.  
  8.  
  9.    // Then change render type to orthogonal to prevent perspective using real screen size  (1 pixel = 1 unit)
  10.  
  11.    gl.glOrthof (0f, screenW, screenH, 0f, 0f,1f);
  12.  
  13.  
  14.  
  15.    // Reset modelview
  16.  
  17.    gl.glMatrixMode (GL10.GL_MODELVIEW);
  18.  
  19.    gl.glLoadIdentity ();
  20.  
  21.  
  22.  
  23.    // And at last, I eliminate DEPH TEST to prevent triangle ordering
  24.  
  25.    gl.glDisable(GL10.GL_DEPTH_TEST);
Parsed in 0.032 seconds, using GeSHi 1.0.8.4


Now I can paint all 3D elements:

All elements have to had its own triangles to be texturized, but this triangles should be defined in 2D:

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. // Points coords:
  2.  
  3.    float[] coords =
  4.  
  5.    {
  6.  
  7.        // X, Y
  8.  
  9.       20            ,         10,
  10.  
  11.       20                ,          0,
  12.  
  13.         0               ,          0,
  14.  
  15.         0               ,        10
  16.  
  17.   };
  18.  
  19.  
  20.  
  21.    //Texture coords
  22.  
  23.    float[] texturCoords = new float[]
  24.  
  25.    {
  26.  
  27.                 1f      ,         1f,
  28.  
  29.                 1f      ,  0.005f,
  30.  
  31.           0.005f        ,  0.005f,
  32.  
  33.           0.005f        ,     1f
  34.  
  35.    };
  36.  
  37.  
  38.  
  39.    // Triangle Strip definition:
  40.  
  41.    float[] vertex_strip = {1,0,2,3};
Parsed in 0.037 seconds, using GeSHi 1.0.8.4



then you should create buffers (coordsBuffer,textureBuffer,triangleStripBuffer), and then you can call all paint functions.

This is an example to paint only a 2D image texturized BUT USING "real pixel" size.

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. gl.glActiveTexture  (GL10.GL_TEXTURE0);
  2.  
  3.    gl.glBindTexture     (GL10.GL_TEXTURE_2D, textureIndex);
  4.  
  5.    gl.glFrontFace               (GL10.GL_CW);
  6.  
  7.  
  8.  
  9.    gl.glPushMatrix();
  10.  
  11.  
  12.  
  13.    //  Place element:
  14.  
  15.    gl.glTranslatef              (x, y, 0); // X and Y are real pixel coords
  16.  
  17.  
  18.  
  19.    // Set VERTEX buffer (see that we specify 2 coords per element instead 3 because we have defined coords as 2 elements
  20.  
  21.    gl.glVertexPointer   (2, GL10.GL_FLOAT, 0, coordsBuffer);
  22.  
  23.    gl.glTexCoordPointer(2, GL10.GL_FLOAT, 0,  textureBuffer );
  24.  
  25.    gl.glDrawElements    (GL10.GL_TRIANGLE_STRIP, vertex_strip.length, GL10.GL_UNSIGNED_SHORT, triangleStripBuffer);
  26.  
  27.    gl.glPopMatrix();
Parsed in 0.037 seconds, using GeSHi 1.0.8.4


Thats all.
SkyNet800
Junior Developer
Junior Developer
 
Posts: 20
Joined: Tue Feb 24, 2009 11:44 am

Top

Return to Android 2D/3D Graphics - OpenGL Tutorials

Who is online

Users browsing this forum: Google Feedfetcher and 2 guests