Corona SDK: Create an Alphabet Soup Game - Interaction

This is the second installment in our Corona SDK Alphabet Soup Game tutorial. In today's tutorial, we'll add to our interface and start coding the game interaction. Read on!

Step 1: Declare Functions

Declare all functions as local at the start.

Step 2: Constructor

Next we'll create the function that will initialize all the game logic:

Step 3: Add Title View

Now we place the TitleView in the stage and call a function that will add the tap listeners to the buttons.

Step 4: Start Button Listeners

This function adds the necesary listeners to the TitleView buttons.

Step 5: 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.

Step 6: Hide Credits

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

Step 7: Show Game View

When the Start button is tapped, the title view is tweened and removed revealing the game view.

Step 8: Game Listeners

This code adds tap listeners to the game background, and these will be used to draw the selection line and identify the selected letters.

Step 9: Build Soup Function

One of the main functions of the game; this will browse the Map table to create all the textfields and place them in the stage, continue to the next step to see its behavior.

Step 10: Create Character TextFields

A double for is used to identify the elements in the Map table, one for the horizontal values and one for the vertical. The code will create a textfield for every value found in the table and then place them in the stage.

Step 11: Display Random Letters

The chosen words are already in the table, and the rest of the values are filled by 0's at the moment. The following lines change those 0's to a random letter.

Step 12: Add Words List

This code creates two textfields that will contain the list of values to find and the values already found.

Step 13: Draw Selection Line

A semi transparent line will be used to highlight the letters in the stage, in the next function this line is created and added to the stage.

Step 14: Code Review

Here is the full code written in this tutorial alongside comments to help you identify each part:

Next Time...

In the next and final part of the series, we'll handle the letter identification, display the words already found, and the final steps to take prior to release like app testing, creating a start screen, adding an icon and, finally, building the app. Stay tuned for the final part!



Related Articles