Now that the game is somewhat playable - bullets destroy rocks and the player can lose, we need to add a scoring system and a score display. This tutorial introduces using Gum in a FlatRedBall project. Gum is a general-purpose UI tool which integrates tightly with FlatRedBall. In fact, if you used the Glue Wizard in the first tutorial, then you already have a Gum project in your game - it's just empty.
The Gum tool is packaged with the FRBDK.zip so if you are running FlatRedBall, you already have it downloaded. You can find it in <FRBDK Unzip Location>/Gum/Data/Gum.exe
For more information on Gum, see the Gum website. If you would like more information on how to use Gum, see the Gum documentation.
The easiest way to open Gum is to click the Gum button in Glue.
Gum should open (if you have the file associations set up properly). If you do not have file association set up, you might see a window that looks like the following image:
If you see this dialog, click the Yes button, then navigate to the Gum.exe location which should be at <FRBDK Unzip Location>/Gum/Data/Gum.exe.
If you used the Glue Wizard in the first tutorial, you will also have a Gum screen set up for the GameScreen called GameScreenGum. Note that Glue will automatically create a Gum screen for every Glue screen.
Gum follows many of the same concepts as Glue, but it is primarily a visual tool. The window on the right provides a WYSIWYG editor, so creating visual layout is usually easier to do in Gum than in Glue. Gum also includes a list of Standard objects which can be used in your project with no setup. We will use a Text instance to display our score. To do this:
Expand the Standard folder
Drag+drop the Text object onto the GameScreenGum
Adjust the position of the Text to its desired location in the Editor window
That's all there is to it! Gum automatically saves all changes, and Glue (if open) automatically reacts to these file changes, so we can run the game and see the Hello TextInstance right away.
At this point our text object says "Hello". Instead, we'd like to display a player's score. To change the Text, we can get a reference to the TextInstance in code or in Glue. Both approaches have their benefits, but for simplicity we will access the TextInstance in Glue. For more information, see the tutorial on accessing Gum objects. The TextInstance is defined in the Gum screen, which has the file format .gusx. Our GameScreen already has the Gum screen added - this happened automatically when we used the wizard.
To access the TextInstance which is inside GameScreenGum:
Drag+drop the GameScreenGum onto the GameScreen's Objects folder
Use the Source Name dropdown to select TextInstance
Click OK
We can access the TextInstance in code and change any of its variables. For example, we can change the Text property in CustomActivity. As a test, open GameScreen.cs and add the following code in CustomActivity:
Now that the TextInstance can display a score, we need to actually keep track of the score so we can display it. We need to decide where to keep the score. Information such as the player's score should not be tied to any Screen or Entity. Rather, it should be stored independently and globally as an object contained in GlobalData. We'll create two classes to store our data:
PlayerData
GlobalData
To add PlayerData to your game:
Add a PlayerData class to the DataTypes folder (which should be part of your project automatically)
Press CTRL+SHIFT+S in Visual Studio to save the project. This will notify Glue that the Project has changed, and that it needs to reload it.
Modify PlayerData so the class looks like the following code snippet:
Next add GlobalData to your game:
Add a GlobalData class in your Visual Studio project in the DataTypes folder
Press CTRL+SHIFT+S in Visual Studio to save the project.
Modify GlobalData so the class looks as follows:
Now we have a well-organized, globally accessible location for our score. For simplicity all players will share the same score, so we've only created one PlayerData in GlobalData.
Finally we need to update the Score in GlobalData as well as the Hud whenever a player destroys a rock. To keep things simple we'll award points whenever a rock is shot - whether it has actually been destroyed or whether it has been broken up into smaller pieces. To do this:
Open GameScreen.Event.cs
Find OnBulletListVsRockListCollisionOccurred
Add the lines in the "new code" section so your code looks like:
As Visual Studio will indicate, PointValue is a variable that has not yet been defined. We will need to add a PointValue variable to Rock. To do this:
Select the Rock Entity in Glue
Click the Variables tab
Select int as the Type
Enter the name PointValue
Click OK
Set the newly-created value to 10
We can also change the starting TextInstance.Text value to 0 by adding the following code in GameScreen.cs in the CustomInitialize function:
Also, don't forget to remove the temporary code we wrote earlier which set the textInstance.Text to the current screen time.
Now the game includes a Score HUD that updates as the player progresses through the game. The next tutorial will add support for multiple players.