The game file to import and load for this session is 5961_07_09.stencyl.
- Click on the Settings button on Stencyl's main toolbar, then click on the Controls icon in the left-hand panel of the Game Settings dialog box.
- Scroll to the bottom of the Controls panel and click on the Click here to add a new control box to display a new control as shown in the following screenshot:
- Change the Name option of the control from Key 0 to
pause. - Click in the Key box (next to the letter A), and press the P key on the keyboard (it will display onscreen as a capital P).
- Click on OK to confirm the changes and close the Game Settings dialog box.
- In the Pause Management behavior, add a new keyboard event by clicking on + Add Event | Input | Keyboard, then change the event name to
Pause clicked. - Click on the Control option in the new when Control is pressed block and select Choose Control | pause, then click on OK.
- Change the pressed option to released.
- The empty input event block should now appear as shown:
- Add the instructions to complete the new keyboard event, as shown in the following screenshot. Note that the Paused Banner option in the blue blocks in this event can be found by clicking on the Actor option that initially appears in these blocks and then selecting Choose Attribute from the pop-up menu:
- Double-check to ensure that each of the options and numbers in the instruction blocks appear exactly as shown in the previous screenshot.
- Test the game and press the P key on the keyboard to pause and resume the game!
We have created a routine that enables players of our game to pause and resume the game at any point!
Firstly, we created a new
control key for pausing the game, using the Controls configuration panel in Stencyl's main Game Settings dialog box. Although it's quite a long process to explain in detail, it is simply a matter of creating a new control, giving it a friendly name to use in the game (in our case, we called it pause), and then specifying the keyboard key that will cause the control to trigger the input event (we chose the letter P). We can now refer to the control by name, anywhere in our game instructions, without having to remember which key we assigned to the control. It's interesting to note that we can assign more than one key to a single control, so we can offer more flexibility to players of our game; for example, many players prefer to use the W, A, S, and D keys for directional control within a game, rather than using the arrow keys.
We then added a new input event that is triggered when the player releases the pause control (which we have specified as being the P key on the keyboard). Although we could have specified for the event to be triggered when the key was pressed rather than when it is released, for this type of control, a better user experience is usually provided by detecting when the key is released. However, this is a matter of opinion, so experiment by changing the option to pressed, and make a decision as to which provides a better response from a player's point of view. Again, perhaps obtaining some feedback from other players might be appropriate!
Once we had created an event that will respond to a specific key press, we were able to add the important instructions that will manage the pausing and resuming of the game.
The instructions that we added into the when pause is released block are split into two sections.
The first section is enclosed in the if game is paused block, and these instructions are only carried out if the game is already paused—the sprite (another name for the actor's image) for the Paused Banner actor will be hidden, and then the game is resumed, or unpaused. The second section, enclosed in the otherwise block is only executed if the game is not paused. In this case, the game will be paused, the x and y positions for the Pause Banner actor will be set, and then the actor will be displayed with the Show sprite for Paused Banner instruction. Immediately prior to showing the banner, we used the Send Paused Banner to front block; this ensures that the banner will always appear in front of any other actors that are currently onscreen.
Let's have a closer look at the set x to … and set y to … instructions that we have placed in the otherwise block: the set x to … block sets the x position of Paused Banner to the x of camera + 200 pixels. The figure of 200 pixels was manually calculated to ensure that the banner will appear in an approximately central horizontal position, based on the fixed width of the banner actor (which is approximately 95 pixels wide). We need to add x of camera to take account of the fact that the monkey may have been moved, thus causing the screen to scroll to the left or right. If we failed to take the camera position into account, then the banner would be displayed at 200 pixels from the left-hand edge of the scene, and not 200 pixels from the left-hand edge of the screen! The set y … instruction is straightforward; it simply positions the banner 100 pixels from the top of the screen.
If we translate the Pause clicked event into English, it could be stated as follows:
When the pause control key is released, check if the game is already paused. If it is already paused, then hide the banner actor and resume the game. If the game is not paused, then pause the game, position the banner actor at the specified location, in front of all other actors, and show the banner actor.
We can see that, in essence, the pause routine is relatively straightforward; we have been able to distil it into three sentences in the above English translation. However, it took us several steps to reach the point of having a fully-functioning pause feature, so let's review the steps that we took to create it. We did the following:
- Downloaded the banner actor from StencylForge
- Configured the physics settings for the banner actor
- Created the scene behavior and attached it to all the existing game levels
- Created an actor attribute for the banner actor
- Added an event to create and immediately hide the banner when the scene is created
- Configured the control key in the Game Settings dialog box
- Created a keyboard event that is triggered by the pause control key
- Inserted the instruction blocks to hide the banner and resume if the game is already paused
- Inserted the instructions to pause the game, and to position and show the banner if the game is not already paused
The previous points can now be used as a template for a pause feature in any game that we create!
The game file to import and load for this session is 5961_07_10.stencyl.
We now have a functioning pause feature that works very well. However, as always, there is room for improvement.
Remembering that we have hardcoded the positioning of the Paused Banner actor attribute in the Pause clicked event of the Pause Management behavior, consider what would happen to the positioning of the banner if we changed the height or width of the game's screen!
- Modify the instructions so that the positioning of the banner automatically takes into account the height and width of the screen.
- Consider that we might want to use a different size of banner; how could we ensure that it is always positioned appropriately regardless of size?
A suggested solution is provided along with comments, in the download file 5961_07_11.stencyl. The suggested modifications can be found in the Pause Clicked event of the Pause Management scene behavior.