Introduction
Exposed variables provide a way to modify Gum objects contained within other Gum objects through your code. For this tutorial, we’ll be creating a scoring HUD object.
Creating a ScoreHud object
First, we’ll create a ScoreHud component in Gum. To do this:
- Right-click on Components and select Add Component
- Enter the name ScoreHud and click OK
- Verify ScoreHud is selected
- Set Width Units to RelativeToContainer
- Set Width to 0
- Set Height Units to RelativeToContainer
- Set Height to 0
Next, we’ll create two Text objects:
- Drag+drop a Text object into the ScoreHud object.
- Rename the Text to Player1ScoreText
- Position the Player1ScoreText object near the top-left of the Screen
- Change the Player1ScoreText’s “X Units” to “PercentageWidth”
- Repeat the steps above to create a Player2ScoreText which is positioned on the top-right of the Screen
ScoreHud in MainMenuGum
Now we can add a ScoreHud instance to the MainMenuGum by drag+dropping the ScoreHud into MainMenuGum:
If you run the game at this time you’ll notice that the score hud appears, but the score HUD says “Hello” for Player 1 and Player 2’s scores.
We can get access to the ScoreHud object in Glue as follows:
- Switch to Glue
- Expand the “MainMenu” screen
- Right-click on Objects
- Select “Add Object”
- Select “From File”
- Select the file “MainMenuGum.gusx”
- Select ScoreHudInstance as the Source Name
- Enter the name ScoreHudInstance
- Click OK
Unfortunately, if you try to access the Player objects in Visual Studio you’ll see that there is no way to change the Text on the ScoreHud:
Accessing score Text
To access the score text we first need to expose the variables in Gum. To do this:
- Switch to Gum
- Select the Player1ScoreText object in Gum
- Right-click on the Text variable
- Select “Expose Variable”
- Enter the name “Score1” and click OK
- Repeat the same process to expose “Score2” for Player2ScoreText
You should now have 2 exposed variables. You can see this by selecting the ScoreHud object in Gum:
Now you can go to Visual Studio and add the following code to CustomInitialize in your MainMenu screen:
void CustomInitialize() { this.ScoreHudInstance.Score1 = "200"; this.ScoreHudInstance.Score2 = "450"; }
Notice that the variables appear in Visual Studio with the same names as exposed in Gum. Running the game will show the score values showing 200 and 450 respectively.