64x64 icon dark hosting
Get a Tuts+ subscription for just $45! Deploy New Relic now to claim.
Advertisement

Create a Physics-Based Puzzle Game - Adding Interaction

by

This is the second installment in our Corona SDK physics puzzle tutorial. In today's tutorial, we'll add to our interface and our game interaction. Read on!


Also available in this series:

  1. Create a Physics-Based Puzzle Game - Interface Creation
  2. Create a Physics-Based Puzzle Game - Adding Interaction

Where We Left Off. . .

Make sure to read the first part of the tutorial to fully understand and prepare for this tutorial.


1. Start Button Listeners

This function adds the necessary listeners to the TitleView buttons.


2. Show Credits

The credits screen is shown when the user taps the about button. A tap listener is added to the credits view to remove it.


3. Hide Credits

When the credits screen is tapped, it'll be tweened out of the stage and removed.


4. Show Game View

When the play button is tapped, the title view is tweened and removed to reveal the game view. There are a lot of parts involved in this view so we'll split them up in the next step.


5. Instructions Message

The following lines add the instructions message. We'll show it for two seconds and then fade it out.


6. Floor

This code creates a rectangle in the bottom of the stage to use as a floor.


7. Level Boxes

This part handles the level creation. It starts by creating the boxes in the stage. We'll learn more about this function in the next few steps.


8. Ball

This code adds the ball to the level.


9. Physics

Here we add physics to the floor and the ball.


10. Add Box Function

The next function uses three parameters to create a box object. You can specify the type of box in the first parameter and its position in the next two. With this method you can create complex levels using just a few lines of code. It'll add physics to the new box as well as a tap listener.


11. Remove Box

This function removes the target box when it's tapped.


12. Collisions

We'll use this code to see if the ball collides with the goal box and call an alert if it's true.


13. Alert

The alert function creates an alert view, animates it, and ends the game.


14. Call Main Function

In order to start the game, the Main function needs to be called. We'll do that with the following code in place.


15. Loading Screen

The default.png file is an image that will be displayed right when you start the application. It will automatically be added by the Corona compiler when you add it to your project source folder.


16. Icon

Using the graphics you created before, you can create a nice icon. The icon size for the non-retina iPhone icon is 57x57px, but the retina version is 114x114px and the iTunes store requires a 512x512px version. I suggest creating the 512x512 version first and scaling down for the other sizes.

It doesn't need to have rounded corners or a transparent glare. iTunes and the iPhone will do that for you.


17. Testing in Simulator

It's time to do the final test. Open the Corona Simulator, browse to your project folder, and click open. If everything works as expected, you are ready for the final step!


18. Build

In the Corona Simulator go to File > Build and select your target device. Fill out the required data and click build. Wait a few seconds and your app will be ready for device testing and submission for distribution!


Conclusion

In this series, we learned about physics behaviour, tap listeners, and collisions. These are skills that can be really useful in a wide number of games.

Experiment with the final result and try to make your own custom version of the game!

I hope you liked this series and found it helpful. Thank you for reading!

Advertisement