Game Dev with Android
A{} N{} D{} R{} O{} I{} D
Game Dev with Libdgx



Nutrition & Food |Learn Travel Spanish Free | Electric Kick Scooters - News, HowTos, Todays Deals!


Homepage | Tutorials | Blog



March 2025

Libgdx with Android For Game Dev

Game Dev Tutorial : Implement SwitchScreen, Action class, Actions Sequence, Sound class, Label, Stage, Actor, getResources, getString, getInstance, if statements, set Custom Logo
Game Dev -All Game Dev Tutorials

App Project Name: Bitcoin Adventure

About the Game App
In this game dev tutorial, we create a four screen app, and on screen two we include the game action; an action sequence to simulate a Bitcoin transaction. Screen one is the home screen, with four menu buttons and a header image, and, screens three, and four are screens with information about the game, and about digital currency. Each screen has clickable links that goto another screen. Screens 3, and 4, have an EXIT logo at top of screen, and, screen 2, has an Exit Screen logo at top of screen. The user can exit the app from screen one.

Bitcoin Transaction Simulation
The simulation includes 4 images, with sound, and all are synced and timed by using Action class, action Runnable, along with Actor, Stage. To start the action, we have created a clickable button that reads 'Play Game', on screen 1. When user taps the Play Game button, they goto screen 2, and the Bitcoin action begins. First, a Label displaying text is shown on the screen, then it fades out and the four images are displayed, in sync of each other. Each image has text written on it to provide information about the transaction as it progresses. The action sequence is for a number of seconds, and then, the action concludes, when the last image, of a new Bitcoin, displays on the game screen, along with the text, 'New Bitcoin'. We used a custom font to get the font color, size, and style we wanted.

Code Classes, Methods

This tutorial includes many code scenarios we have learned in the previous tutorials. In this tutorial, we are going to implement them into a game that requires working with Actions, ClickListeners, Actors, and Stage, Sound, Label, and to navigate amongst the game screens we are going to use SwitchScreen. To add individual color to screen one of our game, we can also use case method to implement the proper color.

MainActivity.java - MyGdxGame.java

Additionally, for this tutorial, we will also add some code at MainActivity.java, and connect that code with MyGdxGame.java. In any Android mobile game we create from our game template(in AIDE), the MainActivity.java is required because it contains the config code that creates our game screen file, MyGdxGame.java. But other than that it is not really required from a game code perspective.

However, if you want to add something into your mobile game code that requires the MainActivity.java, like from the 'gdx-game-android' folders, let's say, the strings.xml file, at gdx-game-android/res/values/strings.xml; then you must add the appropriate code to MainActivity.java, so it can communicate with the gdx game code at 'gdx-game' folders, like at our 'gdx-game/src/MyGdxGame.java' file,that we code our game in.
Although the android folder reads as 'gdx-game-android', it is actually a non game android folder containing Android game resources, and, as you know from reading our tutorials, all game images are placed at the android resources folder at 'gdx-game-android/assets/mygameimage.png. So, it is sort of confusing, because although one creates the other, there are not actually in sync for all the coding features you might want to utilize. So, in this game code, we are going to add some additional code to MainActivity.java, so we can work with 'strings.xml' file, of 'gdx-game-android'.

I should also note here, that this is the app project folder hierachy when using the AIDE code editor, which is what I use to code my game apps, however, I am not sure how the folder hierachy works in Android Studio, which can also work with Libgdx and Android to create game apps. I do know that a lot of things are easier to code when working with Android Studio, like the dependencies you might need to include in your game code, but other than that, I cannot say if this situation, would be a more straightforward code scenario or not.

Create an Instance
So, in most cases, we must create an 'instance' of what we want to do in the MainActivity.java, and then declare that in the MyGdxGame.java code in some way that gets the code for us from MainActivity class. That is what we are going to do with this code for our game text on screens 3, and 4. We add the text into the 'strings.xml' file, and code an instance for that at MainActivity, so we can then declare that instance in MyGdxgame.java, and get the text to display on our game screen. That is how we can get MyGdxGame.java to receive the code from MainActivity, the code 'instance' we are going to create.
We can find MyGdxGame.java at, 'gdx-game/src/MyGdxGame.java; and MainActivity.java at, 'gdx-game-android/src/MainActivity.java

Strings.xml
Instead of using Label for the text on screens 3, and 4, and including the code directly in MyGdxGame.java; we are going to add that text to the strings.xml file in 'gdx-game-android' folder. The strings.xml file is an android file, commonly used when coding for a non game android app. But here, we want to use it for our text because we have a lot of text, and using the strings.xml file, is a better way to keep the code decluttered. You can use Label for the same text, but it would take a lot of space in your MyGdxGame.java file code. You can find the strings.xml file at, 'Gdx-game-android/res/values/strings.xml'.

.classpath

Because we want MainActivity.java, and MyGdxGame.java, to receive code from each other, we must make sure they can do that. In your file hierachy of your app project, and within 'gdx-game', and 'gdx-game-android', there is a .classpath file for each. We must open each of these files, and check the line that reads exported for 'gdx-game', and 'gdx-game-android'.

In 'gdx-game' folder at .classpath file , look for the exported entry that reads:
/gdx-game-android, which means the game can receive code from the non game android (gdx-game-android), which makes sense since MainActivity.java has the config files necessary to create MyGdxGame.java, our game screen.

However, by default, it is not added at the .classpath file for the folder 'gdx-game-android', meaning, our file MyGdxGame.java cannot receive code from MainActivity.java, but we know MainActivity.java can send code to MyGdxGame.java, because MainActivity has the config code that creates MyGdxGame.java file. To remedy this, we just need to make sure each of the folders has the others folder name added at the .classpath file, for each. As soon as you goto the folder 'gdx-game', you can see the .classpath file. Just click on it to open it in the code editor. The same goes for 'gdx-game-android'.
So, we just need to add the 'exported' entry at the 'gdx-game-android, that says exported .../gdx-game. Now, non game android(gdx-game-android), can receive code from game android(gdx-game), or simply said, they can send and receive code with each other.

Just copy wording from the exported line at 'gdx-game', and add it to 'gdx-game-android',.classpath file, but word it as 'gdx-game'. Once both files have the exported line entry, select save. Now the app code should build without issue, because each has access to the necessary folder and code.

Add Text, Font

Usually when we add text to our game screen for headings or info we just use the default font(bitmapfont) for small text, and include a Label for more styling features, or perhaps, we include a custom font for even more features like color, size, and its' style.

Custom fonts have all these features pre made, and they can also be sized if required, so they are quite useful in any game setting. For this app, we are going to use a custom font to get the color we want; green, and a particular style, and certain size of font. We can also include code for the default system bitmapfont, just in case we need to add some small size text in any of the game screens. For the default system font, you can set the font color as you want. Bitmapfont, and custom fonts are first coded in the Create method of your game, and then added wherever you require them in your game screens.

For the system default font, just add it to code with its' variable, name, and then draw it to screen with 'batch.draw'; and for custom font you can add it to your Label style, and draw it to the game screen, with stage.draw, since Label can be added to the stage just like any game image or sound, by using Actor. To learn more about custom fonts, goto our Tutorial, 'Game Fonts: Add Custom Fonts'.

With this game, we have four screens, and two of those will have lots of text to display. So, using a Label, is going to mean we have to put all the text in the MyGdxGame.java code, and that will take up a lot of code space, and add clutter to the code.

Custom Game Logo


The other new code we want to introduce in this tutorial, is to add a custom logo for this game app. Usually the little green android logo is shown as the app logo once you RUN and Install your app on your Android device. The code to update our game logo is at the 'gdx-game-android' folder hierachy. You can easily add your own logo, by replacing the logo name at the AndroidManifest.xml, with the name of the custom logo you want to use instead. To find the AndroidManifest, go to 'Gdx-game-android/AndroidManifest.xml'

Actions, Sounds, ClickListeners, Screen Colors, SwitchScreen

All else coded in this tutorial, has been previously learned in our game dev tutorials, the difference being this game has lots of code, and more action scenes have to be synced to work together. A great way to keep track of your code, and what's what, is to add comments at each code section. Makes it easier to read the code, and to find things quicker. Using
//add code comments like this
, is easy to do, and, since your game code will eventually include larger codesets, using comments is good practice.

Game Image Backgrounds

When preparing your game images for your game, you can remove background colors, so they can blend in with any screen color. There are plenty of free online websites, that allow you to remove the background from your images, and some, allow you to edit the background color and have additonal features you can select to add, all for free. Some do limit the size of the image, but for your game images, except for the game logo, most images are small, so this should not be a problem. Once I remove the background, I usually rename them to a name that makes sense to me, like, myImage-reb.png; the reb, lets me know I have removed the background from the image, and it can be used on any color screen.

Example Code
All code for this tutorial is at the Example Code section on this page, which can be copied and pasted into your code editor.

App Shot
At App Shot, you can see a shot of the game(screen one).

FYI: The code from this game dev tutorial is compatible with Android Studio with the Libgdx component. Read more about Android Studio and Libgdx Here

Create our Game App Screen

We are creating a new app for this tutorial. First, we must create our new mobile game app, so in AIDE, at the AppProject file hierachy, Choose Create New Project, select Mobile Game, and New Mobile Game; then add the App name, Bitcoin Adventure(Note: no spaces in the app name(can use _ ), or you can add spaces after you create it; Just Goto: the 'AppProject' folder; just select the App Name, and then select rename). Next, add the package name, 'com.aac.my_bitcoin_adventure'.

Click Create; Bitcoin Adventure game app is created, and the MyGdxGame.java page opens in your AIDE coding editor.


For more info on navigating files and using the AIDE coding editor, goto Tutorial 1.



App Shot - Portrait 5.8" Game Screen
Bitcoin Adventure

Bitcoin Adventure


and, can also view the app action with our video at this link: Our Game Dev Videos(shorts) on Google

Code For This Tutorial

For this tutorial, we must include the imports, game class(MyGdxGame.java), class members(with variables), create method, render method, dispose method. And, include any additional classes and methods we require for this tutorial. We are using 'SwitchScreen' class so we include that code, and the 'int' variable for it 'currentScreen =0;'. We create a new instance of SwitchScreen in our Create method code.

Screen 1

At screen 1, case 0, we include our Menu buttons that let us goto other sections in our game app. So, we included images for these buttons: Play Game, About Game, About Crypto, Exit The App. All these buttons I made, using a free logo creation tool online. These websites are plentiful, and most have good guides to make image or icon creation simple and fun.
Once made, I then cropped and resized for a 5.8" game screen size. You can have them larger than you actually need, then just set their size in code. So, 400 to 550 wide is good for this size screen, and for height, whatever text you plan to add, will determine their height also. Make sure your text is large enough to be read, so usually 40 -60 is good, again, for a 5.8 size screen. Our tutorial, 'Adding Image Fonts', gives a good read on best text sizes for a 5.8" game screen.

Once all the images(game assets) have been coded for screen 1, then we can add a click listener to each of them so we can click any of the buttons and goto another game screen. Here we have, Play Game - goes to the game action; About Game - give a text spiel about the game; About Crypto - gives a text spiel about Crypto, generally speaking; and Exit Game App - exits the user from the app.

Variables At variables we include the class members and then our named variables for each one. Because this is a large codeset, we have lots of class members and their variables. At Example Code section, you can see them. Comments have been added to make the code easier to understand.

Create - At create method, we include the new instances of all the class members we are coding for this tutorial, and you can see those at the 'Create' method, at the Example Code section. Important here, is that we create new 'instances' of all the code methods we want to implement, including the 'SwitchScreen' method. This next code creates the SwitchScreen method instance.

//create switch screen instance
switchScreen(currentScreen);
and, this next code is how we create the Switch Screen class method
//create switch screen class
public void switchScreen(int screen) {
currentScreen = screen;
After these are coded, we can start to add the code to each screen for each screen that being; screen1 is 'case 0:', screen 2 is'case 1:', and so forth.
Case is how we declare each screen, and then navigate amongst them also, including to set their screen color, in the Render method.

To actually switch from one screen to the next or from the Buttons on screen 1(home screen), we have to set the click listener on each button and then include the code:
switchScreen(1), or switchScreen(2), or switchScreen(0),on the click listener for that button. If we want to goto screen one again, from any of the other screens, SwitchScreen class makes it easy to code and navigate the screens in your game app. And, you can create as many screens as you want. Just keep including them in code, and increment each case #, as you add another screen.

Screen 2

Screen 2, case 1:, has all the action for the Bitcoin Transaction, including the four game images, and the actions and sounds added to them. All we do is add each image to the Stage, as an Actor, and then we can add the Actions to them, and Runnable actions also, if we want to include sound, label, or a setVisible.

We set the images to sync one after the other by using the delay(), fadeIn,, and fadeOut code calls of Action class. The fourth image to display is the Image for the New Bitcoin, and text displays also, 'New Bitcoin'. After the action ends, the user can leave the action screen by tapping the 'Exit Game' button at top of game screen. This returns user to the home screen of the app, where they can Play Game again, or click any of the other buttons on the home screen. To exit screen 2, we included code that goes to switchScreen(0);back to screen one. This is how we navigate around the game screens, just add the switchscreen code with number for the screen you want to go to.

Screen 3, 4

Screens 3, and 4, have the text for the game screen, that we want to display. We added the text to the strings.xml file at Gdx-game-android/res/values/strings.xml You can add as many strings into the strings.xml file as you like. Just give each new string you create a unique name. To get the text to display within our game screens, we include this code at the MyGdxGame.java code. This code is getting the system to get the 'instance' we coded at MainActivity, and then get the resources folder, and then get the strings file, and then get the string for our text '(R.string.screen4_text);
The resources folder, .getResources(), is the long name for: res/, folder which is located at: 'gdx-game-android/res/values/strings.xml'. The 'get' is the code to get something, and here to want to get all the code from these coded files. If we were coding a non game app in Aide code editor for Android app, getting this info would be automatic, but because we are working with Libgdx, to code a game app android; it is not, and therefore, we must use all this code starting with MainActivity; create the 'instance' that will lead us to all the other code we need and the files we need to get it from. So, this is the line of code we need to add at MyGdxGame.java, where we want that text to display.
String screen4Text =
MainActivity.getInstance().getResources().getString
(R.string.screen4_text);

We want to add the text at the screen 3 in our game app, which is case 2, and also at screen 4 in our app, which is case 3. Each screen has their own unique text. So if we goto case 2, we can easily find the code, and same for case 3. The reference to the string text - screen4_text, at case 3, is the unique name we gave for the text in the strings.xml file. But now we also want to create a Label with that because we can add the label directly to our stage.

So, to do this, we create a String name from the 'screen4_text' from strings.xml, then we declare that as our new Label and give that another name; so for the text for screen 4 we named its' Label as: screen4Label, to keep it simple, then we can add that name as Actor to the Stage.
stage.addActor(screen4Label);
And, finally, we set a position, set a width, and setWrap for our Label, so the text will wrap around and not go outside of the screen bounds.Here's that code:

screen4Label.setPosition(4.680);
screen4Label.setWrap(true);
screen4Label.setWidth(680);


Once added to the Stage, Labels can take on actions, and be included with an action sequence. The Label added at screen 2, case 1, 'getProtocols', for the game action sequence, was added to the Stage as an Actor. Because of that, we were able to add it into the action for the Bitcoin transaction.

Making Code More Readable
To make my game assets more readable, I usually use my, the word my, before my Image declarations for an image asset, like myRobo. Since all game images have to be declared as an Image call, before being added as Actor to the Stage, I find this makes it much easier to find my images when going thru the code quickly.
In this game scenario for our actioned robot game asset on screen one, we have an image named 'robo-reb.png'. This image gets added to the game, loaded with the Texture call. Then I declare that as a Image call, and name my Image as myRobo. Then myRobo gets added to the stage as an Actor;
stage.addActor(myRobo). Because i use the same word 'my' for all my Image code calls, for an added image, I know i can easily see them when hurriedly trying to find one of them. This is moreso true, when your game app code has a large codeset like this app. You can implement your own simple method, that will make finding and editing code easier.

Actioning 'myRobo' Actor
The myRobo Image is on screen one of the app - at code case 0. It is a small sized robot that moves to the left and, then, back to the right on the game screen, while playing a short sound as it goes. This is an example of how you can add actionable assets anywhere in your game screens, with only using the Action class methods provided in Action class. To action this robot, we added actions that included delay, moveTo, and we also included a 'new Runnable' in that action code. Whenever you want to add sound to an Action sequence of Action class, we must use the 'new Runnable' code call, to action the sound.
This is the code to play the sound, the (0.2f) is the volume you can set for it, and adjust as you want.
soundChainBlock.play(0.2f)

Syncing and Timing Your Game Actions

When making game scenarios with lots of game images, you might want to use specific Action class methods to time them. Working with Action class, you can use methods like delay, fadeIn, fadeOut, all useful to implement your timing and syncing of game assets. The bitcoin action takes place on screen 2(case 1). Since we are using int currentScreen=0; as our variable for the switchScreen method, we use the case to navigate the switch and we know all case begin with numeric 0. So, screen 1 is case 0, screen 2 is case 1, and so forth.

Action the Bitcoin Transaction Sequence
For this app, I started with the first image, the validation image, and added the delay, fadeIn, moveTo, add sound, and then fadeOut. Also we included the 'new Runnable' code for the sound and setVisible code in that action sequence.

Then I added the next image, and tweaked its' fadeIn time, so it began after the first image was just fading out. It is not difficult to time your action scenes, but it does take time to get it just so. You can also add all your images, so they are all in the game code; but set their visibility to 'false', until you are ready to set action on them for timing, sound, labels, or any other Action class method you may want to use. To view them again on the screen, just set their visibility to 'true'. You can goto our previous tutorials on this, as we covered most of the Action class methods in previous tutorials.

How To: Custom Logo

At AndroidManifest.xml, at 'gdx-game-android/AndroidManifest.xml; we can set our new custom logo image, and you have to add the name to replace the name that is there at 'android:icon', and put the new logo into the 'gdx-game-android' folder at res/drawable-hdpi. You can add the same logo, different size to the other drawable folders but isn't necessary. If you are planning to target large android devices, then adding different size logos is a good idea. Make the one for 'drawable-hdpi' a 500x500 size. Android can still select that same image for different size devices. Vector images are good for this also.
To note: unlike our game images, the app custom icon image does not get put into the assets folder, but is added at the 'drawable-hdpi' folder, at 'gdx-game-android/res/drawable-hdpi/robo_icon_reb.png'

Render - At render method, we first clear the game screen, and then set our new screen color. If we are including more than one game screen, which we are for this tutorial, we also can set individual colors for each game screen, or have them all the same color. All game screen colors are set in the Render method. You can view that code at the Example Code section.
When working with several game screens, and multiple game screen colors, we can easily implement the 'switch' case function, to show the correct screen color for the game screen we are currently displaying.

Render method, is where we draw our game graphics to the screen. So this would include images, fonts, game characters, and the like. If we using Stage, we can draw them to stage with the 'stage.draw()' code call, otherwise, we can draw them with batch. For this tutorial, we can draw with Stage, since we added each of our class members as an Image with their named variable. Image can then be added as an Actor to the Stage, and then Stage can draw all the actors, with one call- 'stage.draw() '

Dispose - At dispose method, we get to dispose of all our game assets, to keep our game performance at its' best. If using Stage, we can dispose of all assets at once, with 'Stage.dispose();' code call, otherwise we can dispose of each variable directly.

Summary

Action Scene
In this tutorial, we learned how to create a four screen game app using SwitchScreen method of Game class, and, implement many additional game methods, and code calls. We created an action sequence for the Play Game experience, and then synced the timing of the four images in the Bitcoin action, to provide a seamless loop for the bitcoin transaction. We included several actions from Action class to implement our game play scene, including, delay, moveTo, fadeIn, fadeOut, and, also implemented the Runnable action to facilitate the sound, labels, and setVisible components, in the action sequences.

Add Text to Strings.xml
We added text to screens three and four by utilizing the strings.xml file at gdx-game-android/res/values/ , traditionally used as a non game app coded file, for adding any amount of text to the game screen. To do so, we set a class member and coded an 'instance' to MainActivity.java, so we could use some features of 'gdx-game-android' within our 'gdx-game' code. Then, we declared that same 'instance' at our MyGdxGame.java code, where we wanted the text to display, included in this code:
String screen4Text =
MainActivity.getInstance().getResources().getString(R.string.screen4_text);


By optimizing the code in MainActivity, we were able to use a feature of non game Android in our game, that allowed us to add an amount of text, and, keep it separate from our actual game code by including it in another file, while at the same time making this text(strings.xml) accessible.

Customized Game Logo: App Downloads
When you build your own game apps, you probably want to create your own game app logo. A good logo, can stand out, and be a plus for getting more downloads at the app stores. In this tutorial, we learned how to add a custom logo to the AndroidManifest.xml file.


EXAMPLE CODE - Code For This Tutorial.

JUST copy and paste to update your code.

To Select all Code, with Notations
CLick here


There are many App Project assets(images,font,sound) for this tutorial;
Use mouse to save the images,right click on mouse for the images; saves with the file name automatically. With Android device, click to Save, it saves them as a download. Put them into the app project at 'assets' folder once saved or downloaded. Put the app logo image at the 'drawable-hdpi' folder.

Image, custom app logo
App logo: 'robo_icon_reb.png'(500x500)
Save, put at 'drawable-hdpi' folder, robo logo

Images, screen 1
robot image: 'robo-reb.png'(256x256)
Save, robo reb

header: 'menu1Header-reb.png'
Save menu1Header
play game: 'playGame-reb.png'
Save playGame
about game: 'aboutGame-reb.png'
Save aboutGame
about crypto; 'aboutCrypto-reb.png
Save 'aboutCrypto'
exit app: 'exitApp-reb.png'

Save exitApp

Images, screen 2
bitcoin image, 'aBitcoin.jpg'
Save bitcoin

new block image, 'newBLock.jpg'
Save newBlock

mining image, 'Mining.jpg'
Save Mining

valadation image, 'vala-one.jpg'
Save vala

exit game image, 'exitGame-reb-f.png'
Save exitGame

exit screen image, 'exitScreen-reb.png'

Save exitScreen

Fonts
customized font, 'bitfont.fnt'
customized font png, 'bitfont.png'
Click here, Save this file as bitfont.fnt

Click on Image, save this image as bitfont.png


Sound files

Download/Save the sound file, load-images Click Here

Download/Save the sound file, newBitcoin Click Here

Download/Save each to your device, and add to the Assets folder in the AppProject hierachy at:

AppProjects/Bitcoin_Adventure/Gdx-game-android/assets/robo-reb.png

When we build our app code, the android build system will automatically find all these assets.




gamedev.zeootr.com - GameDev, All Rights Reserved.
All images posted on this Website are Copyrighted © Material.