Wednesday, October 9, 2013

Building custom controls in Stencyl - Part 1

Hello. In this post I will show you how to build custom keyboard controls to control main character. For example one of my games have controls: arrow keys, up, down, left and right but I would like to add controls like WASD and P for pausing the game. I think adding secondary keys is very useful feature simply because some people are left handed but also it is useful when your right or maybe left arm gets tired so you can switch to other key set.

I have built my own sprite sheet of my main character which I call Space Ranger. Here it is:

Space Ranger sprite sheet

This character has 5 states, 4 of which are flying backward, forward, upward and downward. The fifth state is hovering at some point on the screen. So each of the four above states can go to hovering state by releasing keyboard buttons and also from hovering state you can go to above four by pressing the buttons left/A, right/D, up/W and down/S.
For each of the four states this character has two frames taken from the above spritesheet.

Open Stencyl and create new blank game, call it KeyboardControllerTest. Choose custom size of   640 x 480 and press create. Next create new actor and call it SpaceRanger.


I have taken the above screenshot to show you what's going on in Stencyl. On the left pane there are listed 5 animations which represent the 5 states of the main character. Each of the animations has two frames as stated before.

Next we will add behaviours to the main character. Click on the Behaviours tab in the middle.
Click "add behaviour" button on the left bottom of the screen. From the new window select Controls item and add 8 way movement behaviour. After you add this new behaviour you can edit it like controls, animations, check the screenshots below:




Leave all other settings default. Next is adding the main character on a scene but first we need a scene. Create new scene and call it Scene1. Leave everything default. Go back to SpaceRanger page and press "Add to Scene" button in the upper right corner. Add it to Scene1 and press File-> Save Game to save the current progress.

Note: It seems ctrl-s saves the current progress of the game but not toroughly. So always try File-Save Game option.

Now press test game button in upper right or press ctrl-enter to test you game. Try to move the astronaut with the arrow key.

This completes the first part of this tutorial.