The game file to import and load for this session is 5961_06_02.stencyl.
Before proceeding with the following steps, we need to locate the fonts-of-afrikaAfritubu.TTF file in this chapter's code files, which can be downloaded from the Packt Publishing website at www.packtpub.com.
Place the file in a location where it can easily be located, and continue with the following steps:
- In the Dashboard tab, click on Fonts.
- In the main panel, click on the box containing the words This game contains no Fonts. Click here to create one.
- In the Name textbox of the Create New… dialog box, type
HUD Fontand click on the Create button. - In the left-hand panel, click on the Choose… button next to the Font selector.
- Locate the file
Afritubu.TTFand double-click on it to open it. - Note that the main panel shows a sample of the new font.
- In the left-hand panel, change the Size option to
25. - Important: save the game!
- Return to the Display Countdown event in the Score Management scene behavior.
- In the instruction block palette, click on the Drawing section button and then the Styles category button.
- Drag the set current font to Font block above the draw text block in the when drawing event.
- Click on the Font option in the set current font to Font block, and select Choose Font from the pop-up menu.
- Double-click on the HUD Font icon in the Choose a Font… dialog box.
- Test the game. Observe the countdown timer at the upper-left corner of the game.
We can see that the countdown timer is now being displayed using the new font that we have imported into Stencyl, as shown in the following screenshot:
The first step was to create a new blank font in the Stencyl dashboard and to give it a name (we chose HUD Font), and then we imported the font file from a folder on our hard disk.
Once we had imported the font file, we could see a sample of the font in the main panel. We then increased the size of the font using the Size option in the left-hand panel. That's all we needed to do in order to import and configure a new font in Stencyl! However, before progressing, we saved the game to ensure that the newly imported font will be available for the next steps.
With our new font ready to use, we needed to apply it to our countdown text in the Display Countdown behavior. So, we opened up the behavior and inserted the set current font to Font style block. The final step was to specify which font we wanted to use, by clicking on the Font option in the font style block, and choosing the new font, HUD Font, which we configured in the earlier steps.
Stencyl can use any TrueType font that we have available on our hard disk (files with the extension TTF); many thousands of fonts are available to download from the Internet free of charge, so it's usually possible to find a font that suits the style of any game that we might be developing. Fonts are often subject to copyright, so be careful to read any licensing agreements that are provided with the font file, and only download font files from reliable sources. For more information about locating game resources, see Appendix, Planning, Resources & Legal Issues.
The game file to import and load for this session is 5961_06_03.stencyl.
When we imported the font into Stencyl, we specified a new font size of 25, but it is a straightforward process to modify further aspects of the font style, such as the color and other effects.
Click on the HUD Font tab to view the font settings (or reopen the Font Editor from the Dashboard tab) and experiment with the font size, color, and other effects to find an appropriate style for the game. Take this opportunity to learn more about the different effects that are available, referring to Stencyl's online help if required.
Remember to test the game to ensure that any changes are effective and the text is not difficult to read!