Making a Blackjack Game in Corona - Creating the Interface

In this tutorial I'll be showing you how to create a Blackjack game for the iPad using the Corona SDK. Let's get started!

Want to learn how this game was designed? This tutorial series is based on the work of Andrei Marius, who originally published an in-depth Illustrator tutorial demonstrating how to design the game on Vectortuts+.


1. New Project

Open the Corona Simulator and choose "New Project".


On the screen that follows, choose the following settings.

Project Settings

Press the "Next" button, then choose open in editor. This will open "Main.lua" in your default text editor.


2. Project Configuration

Open "Config.lua" delete everything and change it to the following.

This sets the project's default width, height, scale, and FPS. The "letterBox" scale setting means the app will scale up in both directions as uniformly as possible, and if necessary show the game "Letter Boxed", like you see in some DVD movies.


3. Hiding the Status Bar

We don't want the status bar showing in our app, so enter the following in "Main.lua"


4. Local Variables

Add the following beneath the code you entered in the step above.

These are all of the variables we'll be using in this game. Read the comments to understand what they're for.


5. Setup()

The setup function will be called when the app first loads. Enter the following beneath the code you entered in the step above.

Now call the setup function right below where you declared it.


6. SetupCoins()

Add the following above where you are calling Setup() in the step above.

This sets up our money images and adds a betAmount key.

Now call this function inside Setup().


7. SetupButtons()

Add the following beneath the setupCoins() function you declared in the step above.

This sets up our buttons and makes them all invisible.

Call this function inside Setup().


8. SetupTextFields()

Add the following beneath the setupButtons() function you entered in the step above.

This sets up the TextFields and sets the text color to black.

Add this to the Setup() function.


9. SetupGroups()

Add the following beneath the setupTextFields() function.

This sets up the groups that will be used to hold the cards and the money the player bets

Add this to the Setup() function just like you've been doing in the previous steps.


10. Check Progress

If you test the app, you should see the interface running properly.

Game Interface

11. AddListeners()

Add the following beneath the setupGroups() function.

This adds touch listeners to our interface elements so that the user can interact with them. We need to create the functions that will be called when the user clicks on them.


12. BetHandler()

Enter the following beneath the addListeners() function.

This function will handle the betting. It'll make sure that the user doesn't try to bet more than he has in his bank.


13. Deal()

Enter the following beneath the code you entered in the step above.

This function is where the heart of the game lies. All of the logic of the game will be handled in this function.


14. Hit()

Add the following beneath the deal() function.

This function will be called when the user presses the "hit" button.


15. Stand()

Enter the following beneath the code you entered in the step above.

When the player decides to stand, this function will be called.


16. CreateDeck()

Add the following beneath the createDeck() function.

This resets the deck table and creates a fresh deck. It runs through each value in the suits table and appends the number 1 through 13 to them. We set the variable tempCard equal to the result, then insert it into the deck table.

Now call this in the Setup() function.

We'll be getting some random cards from the deck, so ensure that it's truly random we'll need to seed the random generator. If we don't do this, every time the game starts it'll generate the same randomness. Add the following createDeck().

Conclusion

This brings part one of this tutorial to a close. In the next part of the series we will begin incorporating the gameplay. Thanks for reading. Stay tuned for part two!

Tags:

Comments

Related Articles