Creating 2D Car Racing Game in Android: 4. Adding Player Car and Controller Graphics

In the part 3 how we have added road texture on OpenGL surface, In this part we will see how we to add more graphics with their scale and position setups on OpenGL SurfaceView.
You can continue from this part by download project file from part 3 source and import it in eclipse.
So let’s start adding graphics.

Topics Covered

Importing player car and controller graphics

To add the Player Car and Controllers, first we need to import graphics into the our project. So, drag the all needed graphics into res>drawable-nodpi folder. i.e. player_car.png, accelerator.png and breaks.png.

Creating 2D Car Racing Game in Android
Creating 2D Car Racing Game in Android
Creating 2D Car Racing Game in Android

Creating Player Car Class

Create the player car class named TexCar and extend it by Texture class. Now Define its texture[] array and set the values of the array.

Adding Player Car on GLSurfaceView

Open the from project and define a constant for Player Car Graphics resource.

If you noticed, to define width and height we are using scalef() method of GL10 class. That means if I wanted to define perfect square on screen using scalef(), how I can do this.
Let’s say a rectangle has scale x is 0.5 and scale y is 0.5 of the screen. Because of our phones and tablets screens are not square. In that case we well get the result as rectangle even we input same value to the both side of the rectangle to get perfect square. Because it will assign height and width by 50% of the screen. See the figure below.

Creating 2D Car Racing Game in Android

This means if we will try to draw the square image(128 x 128) on screen by passing same scale values of x and y and we will get the result as stretched image.
To solve this issue we have to write some math. So define the method getProportionateHeight() into and the logic to get proportionate height.

Now open the and Define variable car as TexCar.

Add following code snippet under onSurfaceCreated() method to load Car texture.

Now create DrawCar() function.

Notice the fourth line of code. We have called Global.getProportionateHeight(0.15f) method from Global class to get proportionate height of the car by passing y scale value of car texture as x scale value.
Now just call DrawCar() function into onDrawFrame() Class
And Run the project. Creating 2D Car Racing Game in Android

You will find the car graphics displayed properly.

Deciding Controllers Placement Position

Before placing Player controllers to control car we have to decide position of controls. In this scenario we have two controllers. i.e. Brake and Accelerator. But we can’t use these two controller by single hand/finger. For that we have to hold the phone by both hands and use the controllers by both hands thumbs.

Looking to the road background the position of the Brake will be Bottom right of the screen and the For Accelerator the Bottom Left corner will be better.

Creating Car Brakes and Accelerator Class

Now create the Car Brakes and Accelerator Class same as Car Class.
Because of the similar structure of the both class we will make on one class for both. So create class name TexController.

Adding Car Brakes and Accelerator on GLSurfaceView

Now define graphics constants for Brakes and Accelerator Graphics under

Go to the and Define two variables for Brakes and Accelerator as TexController

Now add following code snippets to load Brakes and Accelerator graphics under onSurfaceCraeted() function.

Create DrawBreaks() and DrawAccel() functions.

And finally call the above defined function into onDrawFrame() function.
Run the project and see the result. Creating 2D Car Racing Game in Android

Download Part 4 Source

4 replies

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *