Catch Me – Part 1

Hello Future Game Developers!

This post series is closely related to Corona Coin Drop, but with a twist. Instead of using the accelerometer to control the character, Catch Me will allow the player to tap and drag the character across the screen to catch falling coins.

This game series does not use Corona’s built-in scene management library. I’ve opted to keep this game tutorial to two parts and in doing so, I’ve decided to keep everything within main.lua. For games that are published on the app stores, I strongly recommend you use composer. To learn how to use the scene management library, please read through the Corona Coin Drop series.

 

Before You Start

You will need a new project setup with Corona SDK. You can do this by downloading Corona SDK, clicking on New Project, and create a project using the blank template. Use the phone preset of 320×480 when you create your template.

screenshot-2016-11-29-16-08-36

main.lua

With your project setup, open main.lua in your favorite text editor. I prefer to use Sublime Text, but feel free to use the text editor of your choice.

The first item will take care of is hiding the status bar. Enter this line as the first line of your code:

display.setStatusBar( display.HiddenStatusBar )

Next, we will be using physics to drop coins and for collision detection. We’ll also use the default gravity set by Corona. These next two lines will require in the physics library and start the physics engine.

local physics = require "physics"
physics.start()

Then, we will create a table that will store our coins and this will allow us to reference them later on. I like to track the coins individually so I’ll put in a variable called coinsCounter and start it at 0.

local coins = {}
 local coinsCounter = 0

We continue on by adding in our graphic elements of the background, the ground, and the player. The background is a still background image with some white clouds on it. The ground and the player consist of individual graphics but both have a physics object attached to them.

Our ground object is a physics object with the body type of static. A static body type does not move under simulation and acts as if it’s floating in the same position. This type of body is generally used for ground objects or objects that don’t generally move.

The player object is using the default physics body type of dynamic. Dynamic body types respond fully to physics and can bounce around the screen. We want our player to respond to physics so we can detect when coins collide with our player.

local background = display.newImage("images/background.png", 320, 480)
 background.x = display.contentWidth*0.5
 background.y = display.contentHeight*0.5

local ground = display.newImage("images/ground.png", 320, 70)
 ground.x = display.contentWidth*0.5
 ground.y = display.contentHeight
 physics.addBody(ground, "static")

local player = display.newImage("images/player.png", 66, 92)
 player.y = 360
 player.id = "player"
 physics.addBody(player)

With our graphics set up, we’ll create 3 functions next – createCoin(), player:touch(), and the onCollision function. These functions will be fully explained in Part 2, but as a quick overview: createCoin() will create coins that drop from the sky. player:touch() will respond to touch events on the player (a dragging movement in our case). And the onCollision() function will be triggered when a coin collides with the player.

local function createCoin()
end

function player:touch( event )
end

local function onCollision( event )
end

And in wrapping up Part 1 of Catch Me, we create a timer and two event listeners. The first timer will call the function createCoin() every 1.5 seconds and will continue until cancelled.

The player:addEventListener() turns on a listener that will respond to touch events on the player. For example, when the player image is touched, the function player:touch() is called.

The last function here starts the collision detection system. I’m using a global detection system so the function onCollision() will be triggered when two physics objects collide.

timer.performWithDelay(1500, createCoin, 0)
player:addEventListener( "touch", player )
Runtime:addEventListener( "collision", onCollision )

In Part 2 of this game tutorial series, we’ll go into more depth of the three functions we created here and breathe life into our game.

Daniel Williams

Leave a Reply

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