Building a simple game using XAML/C#: Part 4 – Make it fun

At this point, you have a simple version of a “Simon” game that works: you can start, restart, win, and lose. That said, the game still lacks the pizazz that really could make it stand out as something fresh and the game still needs to keep the player’s score.

Who is keeping score?

There’s plenty of places that we could logically keep the score, but I’m going to opt for keeping it in the Game object. Make sure that you have added an integer for storing the score in the Game class. Next, we’ll have to figure out a way to increment it. First, we’ll add two simple accessor methods, addScore and getScore for incrementing and retrieving the score.

Next, we’ll have to figure out when we’ll be giving the player points. I like using the clicks on the game squares as the source for updating the score and also incrementing the score when the user completes a level.

Change your button click handlers to increment the score when the user clicks them and also add tons of points when the user completes a level.

Finally, we’ll have to update the score to show while the game is running. We’ll also update the current game level when we do this. The following methods will update the score and level text in the XAML.

If you build and run the game now, you will notice the score and level updates in the UI.

Where did I put that trap door…
To add a new twist to the game, let’s make to board spin around once the user reaches the 5th level. Before we get ahead of ourselves, let’s first figure out how to spin the board.

We will be adding a new method to the Game class which will let us rotate the board. First, add a variable that will be used to hold the current board rotation.

Game.cs ---------------
double boardRotation = 0.0;

Next, we’ll add a new method, rotateBoard that will take in a value for the number of degrees to rotate. The way that the rotation will have to work is that all of the squares will rotate about the middle of the board, like a pinwheel. The following image shows how the rotation will work for each of the squares:

In this rotation, the x and y center positions stay the same and the squares all are rotated about that center point. To perform the transformation, there is a convenient object, the CompositeTransform, that lets us easily transform the shapes about the gameboard’s center. The following code shows how this comes together:

What this code does is just iterate through all of the game switches and rotates them about the game board center, pretty simple…

Now, that we have the ability to rotate the board, we should test it! You may have noticed that I added an extra button to the AppBar for turning on and off test features. Clicking this button will flip the enableTestFeature Boolean in the MainPage.xaml.cs partial class. In this partial, there is a section at the top of the GameLoop method that gets enabled or disabled when that button gets clicked. While we create and debug the rotation code, it is convenient to put the code into that section.

To test the rotation code, I added the following code to the enableTestFeature section of the game loop:

Note that the value should be pretty small because the rotation code will be called frequently by the GameLoop. If you build and run, you can turn on and off the rotation feature by clicking the ??? button on the App Bar. Now that we have verified that the rotation code works, it’s time to insert some logic into the game that will enable the rotation code when the user reaches a certain level and will “unrotate” the board when the game is reset. For the first case, making the board rotate when the user reaches a certain level, I added the following code:

Now the board will rotate after reaching level 5 and resetting the game will place the board back to its original position. The following screenshot shows the game running with the board turning:

Also, hax!

I’m a huge fan of Easter eggs, and so… I thought it would be fun to add a nifty little cheat to show the current pattern while you’re playing. This is actually pretty helpful when you’re testing gameplay into higher levels and aren’t the greatest “Simon” player. The way that the cheat will work is that we’ll have an invisible rectangle that when clicked, will write the queue of moves to the “status” text area box.

First, we’ll add and initialize a rectangle for the invisible button when we set up the rest of the game board:

Toggle a break point to your application in the toggleCheat block, build and run your game and then click around until you find the “cheat” area of the game (if you used my code, clicking the top left of the screen will trigger the cheat mode). Clicking it will bring you to the toggleCheat breakpoint. Continue and run and see how easy the game is with cheating enabled .

In the following screenshot you can see the pattern being displayed to the player to make their life way too easy.

Conclusions

So that’s pretty much it for this game, we’ll be working on another one soon. Hope you had fun!

3 Responses

Do you have recommendations for moving on to more advanced programming if I wish to write a game for Windows 8 Metro? I am interested in: collision detection, arcade-style animations, adding a soundtrack, and such other game-development tasks…