Libgdx with Android For Game Dev
Game Dev Tutorial : Create and Navigate Three Game Screens
Game Dev -All Game Dev Tutorials
With this tutorial, we are going to create three separate game screens, and navigate amongst them by tapping on the text on each screen. We are going to use a simple way to implement this, with an enum Screen code class, and writing some boolean logic code with if and else if statements. The actual rendering, the executing of the code, is processed with switch case code, at the Render method. For our text we want to display on each game screen, we are going to use the system default - arial, which is easy to implement with the BitmapFont class member.
All code for this tutorial is at the Example Code section on this page. You can see the action of this tutorial example at the App Shot video gif.
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
Click Create; Game Screens 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
with - video gif
Navigate Game Screens
Imports and Game Class - At imports, we include the standard imports which are added for us when we created our 'template game app', and we also add those for any functions, classes, or methods, we are going to code, so we include imports for 'InputAdapter', 'Spritebatch', 'BitMapFont'. And, we include our 'ApplicationAdapter' class code.
Variables - At variables we must add all the class members and named variables we intend to use in our code. So, first include the Class Member and then our named variable of it.
For this we include the member SpriteBatch we name the variable as batch; and member BitMapFont - we named as font; and we must also declare our Screen enum class - defining the screen names we want to include in the code. You can name these as you like: TITLE, MAIN_GAME, GAME_OVER,(note these are all capped).
Create - at the Create method, we are adding the new instances of Spritebatch, and BitMapFont, and setting color and size for the font. And, set the 'inputProcesor' with a new 'inputAdapter' instance. This is what handles the click event, so if we don't include this code then nothing happens when the text on the game screen is tapped.
Also at Create method, we write some code with logic for each of the Screen code calls - when the text on each screen is tapped, where do we want the user to go; what screen do we want to display next.
For this, we include some 'boolean code', with the 'if', and 'else if' statements. Boolean code is a basic 'true' or 'false' answer; and by including if statements, we can write our 'logic' so the answer is either true or false.
So, we want to say - if the user clicks the text on the TITLE screen; then the 'if' statement is 'true'(yes they clicked on the text), then next show them the 'MAIN_GAME' screen, and when the user clicks the text on the 'MAIN_GAME' screen, true again, then display the 'GAME_OVER' screen, and when they click on the text on the 'GAME_OVER' screen, true again, then display or take them to the Title screen again. So, actually, with this, we created a sort of loop effect, because each link takes us to the next screen in the loop of three game screens. You can add as many game screens as you want with 'eNum Screen' class, and by tapping the text on each game screen the user would just keep looping around all the game screens.
As you look at the code for the if, else if statements, you see each screen name variable shown, and what happens once the screen text is tapped. If we are on the current screen - Screen.TITLE, then we goto screen.MAIN_GAME(the game action screen), and if its' current screen MAIN_GAME, we go to GAME_OVER screen. Using eNum Screen in this manner, we can easily code to navigate the various screens we want to include in our game. This boolean code we write does not execute the code, it creates the new instances of what we want to do. The actual code execution takes place in the Render method.
Render - In the Render method we are going to use a Switch - Case function, to execute the screen interactions. It follows the same coding logic as our Boolean code; if they tap the screen text they goto the next named screen.
Next, in Render method, we want to draw our text to each screen by using the font.draw, and also set their position on the game screens with width and height(x,y) parameters. Because we want the text to display at the same location on each game screen we set the width and height values as 55,400, for each screen. - 55 is width across the bottom of the game screen, and 400 is the height along the height of the game screen. The actual font we are using for this is the game default which is arial, and easy to implement with the BitMapFont class member. You can also use your own customized fonts which you can create with various font style generators and skins.
Dispose - At the Dispose method, we dispose of the game assets with the batch.dispose, and font.dispose, code calls.
To display text to the game screens, we used the Libgdx default font type- Bitmapfont. With batch, we can easily get our text drawn to the game screens.
This type of screen implementation is great for simple type games, where you don't have a lot of complicated game screens with lots of coding. For those types of mobile games, a different screen class method might be more useful. Libgdx's Game class is better suited to larger games, or games with complex code scenarios. In our next tutorial, we will learn about the Switch Screen method, of Game class, and how to code several game screens with its' included properties and functions.
Game Dev -All Game Dev Tutorials
App Project Name: Game Screens
With this tutorial, we are going to create three separate game screens, and navigate amongst them by tapping on the text on each screen. We are going to use a simple way to implement this, with an enum Screen code class, and writing some boolean logic code with if and else if statements. The actual rendering, the executing of the code, is processed with switch case code, at the Render method. For our text we want to display on each game screen, we are going to use the system default - arial, which is easy to implement with the BitmapFont class member.
All code for this tutorial is at the Example Code section on this page. You can see the action of this tutorial example at the App Shot video gif.
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, Game_Screens(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.game_screens_example'.Click Create; Game Screens 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
with - video gif
Navigate Game Screens
Code For This Tutorial
For this tutorial lesson, we are adding code for the methods and functions; imports, game class, variables(class members), create, render, and dispose.Imports and Game Class - At imports, we include the standard imports which are added for us when we created our 'template game app', and we also add those for any functions, classes, or methods, we are going to code, so we include imports for 'InputAdapter', 'Spritebatch', 'BitMapFont'. And, we include our 'ApplicationAdapter' class code.
Variables - At variables we must add all the class members and named variables we intend to use in our code. So, first include the Class Member and then our named variable of it.
For this we include the member SpriteBatch we name the variable as batch; and member BitMapFont - we named as font; and we must also declare our Screen enum class - defining the screen names we want to include in the code. You can name these as you like: TITLE, MAIN_GAME, GAME_OVER,(note these are all capped).
Create - at the Create method, we are adding the new instances of Spritebatch, and BitMapFont, and setting color and size for the font. And, set the 'inputProcesor' with a new 'inputAdapter' instance. This is what handles the click event, so if we don't include this code then nothing happens when the text on the game screen is tapped.
Also at Create method, we write some code with logic for each of the Screen code calls - when the text on each screen is tapped, where do we want the user to go; what screen do we want to display next.
For this, we include some 'boolean code', with the 'if', and 'else if' statements. Boolean code is a basic 'true' or 'false' answer; and by including if statements, we can write our 'logic' so the answer is either true or false.
So, we want to say - if the user clicks the text on the TITLE screen; then the 'if' statement is 'true'(yes they clicked on the text), then next show them the 'MAIN_GAME' screen, and when the user clicks the text on the 'MAIN_GAME' screen, true again, then display the 'GAME_OVER' screen, and when they click on the text on the 'GAME_OVER' screen, true again, then display or take them to the Title screen again. So, actually, with this, we created a sort of loop effect, because each link takes us to the next screen in the loop of three game screens. You can add as many game screens as you want with 'eNum Screen' class, and by tapping the text on each game screen the user would just keep looping around all the game screens.
As you look at the code for the if, else if statements, you see each screen name variable shown, and what happens once the screen text is tapped. If we are on the current screen - Screen.TITLE, then we goto screen.MAIN_GAME(the game action screen), and if its' current screen MAIN_GAME, we go to GAME_OVER screen. Using eNum Screen in this manner, we can easily code to navigate the various screens we want to include in our game. This boolean code we write does not execute the code, it creates the new instances of what we want to do. The actual code execution takes place in the Render method.
Render - In the Render method we are going to use a Switch - Case function, to execute the screen interactions. It follows the same coding logic as our Boolean code; if they tap the screen text they goto the next named screen.
Next, in Render method, we want to draw our text to each screen by using the font.draw, and also set their position on the game screens with width and height(x,y) parameters. Because we want the text to display at the same location on each game screen we set the width and height values as 55,400, for each screen. - 55 is width across the bottom of the game screen, and 400 is the height along the height of the game screen. The actual font we are using for this is the game default which is arial, and easy to implement with the BitMapFont class member. You can also use your own customized fonts which you can create with various font style generators and skins.
Dispose - At the Dispose method, we dispose of the game assets with the batch.dispose, and font.dispose, code calls.
Summary
In this tutorial, we implemented three game screens with eNum Screen class, and added some Boolean logic code with if, else if statements to facilitate the switching of the screens. And, to Render or execute this, we used the Switch Case code function at the Render method.To display text to the game screens, we used the Libgdx default font type- Bitmapfont. With batch, we can easily get our text drawn to the game screens.
This type of screen implementation is great for simple type games, where you don't have a lot of complicated game screens with lots of coding. For those types of mobile games, a different screen class method might be more useful. Libgdx's Game class is better suited to larger games, or games with complex code scenarios. In our next tutorial, we will learn about the Switch Screen method, of Game class, and how to code several game screens with its' included properties and functions.
EXAMPLE CODE - Code For This Tutorial.
JUST copy and paste to update your code.
JUST copy and paste to update your code.