Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Displaying text (like score) which changes on each frame

Is there any easy way to display simple white text without any textures on the right top corner which changes on each frame in the class which implements Renderer, in onDrawFrame method? It's 2D, so there is no need to make any transformations, I believe. I've found many tutorials, but they all seem just too complex with too much code. Maybe it could be done just with a few lines of code? If that's not possible, what's the easiest way to do it without modifying too much of existing code? Please show complete code as I am a newbie.

like image 970
good_evening Avatar asked Mar 12 '13 19:03

good_evening


2 Answers

Renderer is an OpenGL method. OpenGL ES doesn't inherently support text. This leaves the following options:

  1. Use a texture, draw to it using Android's Canvas class.
  2. Use a library. This will most likely also draw to a texture as well.
  3. Create the text with polygons.

Since your question is asking for a solution that doesn't draw to a texture, then 1 and 2 are both out. And since you want something simple, 3 is also out. Leaving no good solutions.

An alternative to consider is to layer another view on top of the GLSurfaceView you are using. You can use a RelativeLayout to easily stack two views, one being a textview that you can anchor to the top right corner of the screen. Pseudocode below:

<RelativeLayout ... />
    <GLSurfaceView ... />
    <TextView ... />
</RelativeLayout>

This approach has the benefit of pulling you out of the OpenGL requirements to do your text. I've done this successfully on a couple of my apps.

like image 100
Grimmace Avatar answered Sep 19 '22 03:09

Grimmace


You may want to take a look at the API Demos project which comes with the Android SDK samples. There is a OpenGL Sprite Text sample which does exactly what you want.

You can see the demo by installing API Demos on emulator (or device) and navigating to: API Demos > Graphics > OpenGL ES > Sprite Text

Here is a screenshot:

enter image description here

The text at the bottom right corner of the screen is changed on each frame in onDrawFrame method of the Renderer.

You can find the source code in your Android SDK samples directory: ApiDemos\src\com\example\android\apis\graphics\spritetext

You'll need to copy few files into your project and with very few lines of code can achieve the same functionality.

Sample Application: I have created a sample application to demonstrate the same by reusing code from the API Demos project. You can get it from here - OpenGLText_eclipse_project.zip

In brief, you can reuse Grid.java, LabelMaker.java, NumericSprite.java completely. Then add few lines of code in your Renderer for using the above classes as shown in my TextRenderer.java

Here is how it looks with the score updating continuously.

enter image description here

Basically, rendering the score is as simple as this:

LabelMaker mLabels = new LabelMaker();

mLabels.initialize(gl);
mLabels.beginAdding(gl);
int mLabelMsPF = mLabels.add(gl, "Score:", mLabelPaint);
mLabels.endAdding(gl);

mLabels.beginDrawing(gl, mWidth, mHeight);
mLabels.draw(gl, 0, 0, mLabelMsPF);
mLabels.endDrawing(gl);

NumericSprite mNumericSprite = new NumericSprite();
mNumericSprite.setValue(16);
mNumericSprite.draw(gl, 0, 0, mWidth, mHeight);
like image 45
appsroxcom Avatar answered Sep 22 '22 03:09

appsroxcom