The aim of the tutorial is to learn how to create a simple word game. You will
create an input box which will give different results depending on what is
typed. The code for this is quite straight forward and has many uses other
than this word game. For example forms and password controls.
Click play and try typing: hen, chicken, rooster, cockerel and also a misspelling.
Step one: Text Input Box
- With the text tool
selected
drag out a small text box on the main stage.
- Go to: Window > Properties
- Select: Input Text

- Select your: Font, Font Style, Size and Colour

- Select: Left/Top Justify

- If your Property Inspector is in collapsed view, click on the down arrow
in
the bottom right corner of the Property Inspector to expand the panel. If
you have an up arrow
the
Inspector is already expanded.
- For line type select: Single Line

- Input text should be Selectable.
You
do not need to switch it on as input text is always selectable.
- Select: Show Borders Around Text

- For Variable name type: answers

Important: Do not use an instance name only a variable name.
- For Maximum Characters type: 12

- Click on the Character button
and
select: Only > Lower Case

Note: If you do not restrict the case to lower case (or capitals) you will
find that the input box is case sensitive so if someone types Rooster (instead
of rooster) the answer is incorrect.
When you have finished your Property Inspector should look like this. (Click to enlarge)
Step Two: Making the Text Input Box Blank
You do this so that when you play the game the text field is always empty.
For example if you get the wrong answer and try again the text field will reset
to a blank box.
- Place the following action in the frame 1 of the timeline (the same frame
as your text box):
answer = "" ;
Note: If your text input box is not called answer type the name that you
used instead of 'answer'.
Step Three: Placing the ActionScript in the button
- Place a button next to the text box.
Either create your own or drag one out of the Button Library: Window > Common
Library > Buttons
my button
- Attach the following code to the button:
on ( release , keyPress "<Enter>" ) {
if (answer eq "rooster" or answer eq "cockerel" ) {
gotoAndPlay ( "win" );
} else if (answer eq "hen" or answer eq "chicken" ) {
gotoAndStop ( "boy" );
} else {
gotoAndStop ( "wrong" );
}
}
Line 1: on (release, keyPress "<Enter>") {
On the mouse click or if you press Enter on the keyboard and ...
Line 2: if (answer eq "rooster" or answer eq "cockerel")
{
If the the text input box called answer is rooster or cockerel then ...
Line 3: gotoAndPlay ("win");
Go to the frame labeled win.
Line 4: } else if (answer eq "hen" or answer eq "chicken)
{
If the the text input box called answer is hen or chicken then ...
Line 5: gotoAndStop ("boy");
Go to the frame labeled boy.
Line 6: } else {
This has not got a (answer = "word") which means that whatever is typed (other
than the specified words above) then ...
Line 7: gotoAndStop ("wrong");
Go to the frame labeled wrong
Note: If you have specified lower case as the input text
value then the words "rooster" , "chicken" etc. must be typed in the code as
lower case and visa versa if you have typed them in upper case.
Step Four: Creating the additional frames
You must create the frames which the buttons go to. These frames should have
buttons which bring you back to play area of the game so that the user can
try again.
Note the labels in the timeline
You create a frame label by selecting the frame and typing the name into the
Property Inspector .
The label 'wrong' has been typed into the Property Inspector (Click to enlarge)
Your word game should soon be working a treat.