How to Make a Simple iOS and Android Game with Corona Tutorial
This is a post by Tutorial Team Member Greg Pugh, author of the Colin Turtle children’s eBook app series. You can also find him on Google+. You have probably seen some stories on the news and on the web about kids that are developing mobile apps at an early age. Often they use the Corona […] By .
Sign up/Sign in
With a free Kodeco account you can download source code, track your progress, bookmark, personalise your learner profile and more!
Create accountAlready a member of Kodeco? Sign in
Sign up/Sign in
With a free Kodeco account you can download source code, track your progress, bookmark, personalise your learner profile and more!
Create accountAlready a member of Kodeco? Sign in
Contents
How to Make a Simple iOS and Android Game with Corona Tutorial
35 mins
- Getting Started
- Choosing a Text Editor
- Being Resourceful
- Building Our Settings
- Configuring Your Config File
- Onto the Main Event
- Care to Comment?
- Status Bar? We Don’t Need No Steenkin’ Status Bar!
- Let’s Get Down with Physics
- Constantly Writing Variables
- Giving the Player Feedback
- Bring Balloons to the Party
- Two Walls and a Ceiling
- Let’s Play Ball(oon)!
- It’s the Final Countdown
- Why Won’t These Balloons Pop?!
- Where to Go From Here?
Onto the Main Event
Now create another file in your text editor and save it as main.lua in the BalloonPop folder.
Start the Applications\Corona SDK\Corona SDK Simulator, and then navigate to File > Open. Browse to the BalloonPop folder, and open the main.lua file you just created.
Navigate to “Window > View As” in the Corona SDK Simulator menu to view your application running on different devices. For now, use the iPhone simulator.
At this point, you should be seeing a black screen! How exciting! You’re obviously thinking “What gives? I created three code files for this?!” Patience, grasshopper, there’s more going on in the simulator than meets the eye! :]
When main.lua was opened, the simulator ran the app in landscape mode, based on the configuration setting you created in build.settings. The simulator is also displaying a 320×480 screen at 60 frames per second – again as per the settings in config.lua.
The only problem is that there’s just nothing to display yet! :] Time for you to put something up on the screen as a reward for all of the work you’ve done so far!
Open main.lua in your text editor and paste in the following:
local background = display.newImage("images/clouds.png");
The code above creates a local variable (hence the “local” keyword) named background and assigns a new image to display. “display” in this case refers to the device screen. In Corona, the display object has many methods, such as “newImage” which can be used to add elements to be displayed on screen.
Save your changes. The Corona simulator should automatically detect the changes and prompt you to relaunch the simulator. When you do, you’ll see your new background image in all of its glory!
Note: One thing to remember is that semicolons are not necessary at the end of a line in Lua coding. Many programmers tend to use them anyway since they’re commonplace in many other coding languages, but if you forget them, it won’t have any effect on your application.
Note: One thing to remember is that semicolons are not necessary at the end of a line in Lua coding. Many programmers tend to use them anyway since they’re commonplace in many other coding languages, but if you forget them, it won’t have any effect on your application.
Care to Comment?
As you continue adding more code to your Corona project, you’ll want to comment various sections so that you can remember what you did later!
To add comments in Lua, use double dashes for single line comments. For block comments, use –[[ Comment here –]]. You’ll be using comments a lot in this tutorial so that you’ll know exactly what each piece of code does.
To get a feel for comments, change your first line of code to read:
-- Display a background image
--[[ Here we are inserting
a background image of clouds --]]
local background = display.newImage("images/clouds.png");
The code above shows both a single line comment (the first line) and a multi-line block comment (the second and third lines). A multi-line comment can continue over several lines, and the comment will continue until you hit the comment-end marker, which is –]].
Status Bar? We Don’t Need No Steenkin’ Status Bar!
The background image shows up nicely. However, on iOS devices, you’re stuck with the status bar covering part of our image!
Hide the status bar by adding the following code to the beginning of main.lua:
-- Hide status bar
display.setStatusBar(display.HiddenStatusBar);
When you re-launch the simulator, the status bar is now hidden.
Let’s Get Down with Physics
So in just two lines of code, you have a background image displayed, and the status bar hidden. Not too bad at all! :]
Now it’s time to add in a complex physics system so your game will support gravity and physics simulations. Sound like a scary proposition?
Actually, you can do this with one line of code! Add the following to the end of main.lua:
local physics = require("physics");
And that’s it! Add in a comment line above the line you just added for good measure:
-- Generate Physics Engine
local physics = require("physics");
Constantly Writing Variables
As you’ve seen so far, Lua coding is pretty straightforward. Time to kick it up a notch! :]
Add the following code to the end of main.lua:
-- 1. Enable drawing mode for testing, you can use "normal", "debug" or "hybrid"
physics.setDrawMode("normal")
-- 2. Enable multitouch so more than 1 balloon can be touched at a time
system.activate("multitouch");
-- 3. Find device display height and width
_H = display.contentHeight;
_W = display.contentWidth;
-- 4. Number of balloons variable
balloons = 0;
-- 5. How many balloons do we start with?
numBalloons = 100;
-- 6. Game time in seconds that we'll count down
startTime = 20;
-- 7. Total amount of time
totalTime = 20;
-- 8. Is there any time left?
timeLeft = true;
-- 9. Ready to play?
playerReady = false;
-- 10. Generate math equation for randomization
Random = math.random;
-- 11. Load background music
local music = audio.loadStream("sounds/music.mp3");
-- 12. Load balloon pop sound effect
local balloonPop = audio.loadSound("sounds/balloonPop.mp3");
Note: Be sure to save your changes to main.lua after each edit – just in case!
Note: Be sure to save your changes to main.lua after each edit – just in case!
Each commented line in the above code briefly explains what each line does, but here’s a more detailed explanation of the changes above, one-by-one:
- This will make more sense when you apply physics to the balloons; for now leave the draw mode set to “normal”.
- This enables the detection of multiple touches at once, letting the user pop more than one balloon at a time in your game. However, the Corona Simulator currently does not support multitouch. So you’ll only be able to test multitouch on an actual device.
- These are constant values you’ll use to keep track of the device’s screen width and height. As every device will vary in size, it is easier to place objects on screen using relative placement versus absolute.
- This keeps track of the current number of balloons. You will start with 0 balloons and generate more balloons as the game loads.
- When the game is fully loaded, the game will start with 100 balloons that the user has to pop in an allotted amount of time.
- This is the amount of time that the player will have to pop as many balloons as possible. This will be the countdown time.
- Since the startTime will be constantly counting down each second, you will keep track of how much total time the player had to begin with.
- The player will start with time remaining on the countdown time, so this variable is true when there is time left. If the countdown reaches 0, the variable will be set to false.
- The game is not ready to play if the balloons are still loading, so this is initially set to false. When the balloons are finished loading, you set playerReady equal to true.
- You want the balloons to generate randomly along the x-axis, so you need a way to generate random values. Set up a pointer to the random function of the math library and name it “Random”.
- When the app starts you will need to load the music avoid sound lagging. The variable “music” will load a background music track included in the source files.
- A game is no fun without sound effects! So you load a sound effect here to play when the balloons are popped.