Let's Race!
Typing on the Home Row
Michael Hoyle
Susan Rodger
Duke University
2012
Overview
In this tutorial you will be creating a
bike racing game to practice
keyboarding. Your bike will move
forward when you type the correct
letters on the home row (including
a,s,d,f,j,k,l). Your opponent moves
forward at a fixed pace. Get to the
end first to win!
Getting Started
•
•
•
For this tutorial you should have downloaded
the starting world from the Duke Alice
Materials Repository
Look around the world, it should be full of
objects. We are going to write the methods
to make them move.
Feel free to move the camera using the
green arrows, but make sure to set it back.
Do this by right clicking on camera, selecting
methods, set point of view to, Dummy
objects, startPosition.
Getting Started
• The object letter is the letter at the
•
•
top of the screen.
Let's make it count down for our
race. Click on letter. In its properties
tab click and drag the text property
into world.my first method.
When asked what text to use, select
other, and write "Ready,"
Getting Started
•
Drag over the text property two more
times, adding "Set," and "Go!"
Getting Started
•
Go to world's methods tab and click
create new method. Name your
method "race".
Getting Started
•
Drag your new race method into
world.my first method underneath
your countdown.
Making the Race
•
•
Now switch to the world.race tab.
This is where we will code how the
actual race works.
Drag a Do together
into world.race.
Making the Race
•
•
In world's methods tab, create two
new methods, "player1race" and
"player2race".
Drag both of these new methods into
the Do together block in world.race.
player2race
• player1race will be the method that
•
responds to your typing to make your
biker move forward.
player2race is the method that tells
the computer how to race against
you. Let's do this first.
player2race
We want him to
keep going until
he reaches the
end. For this we
will use a While.
Drag a While
into
world.player2rac
e and select
player2race
•
•
Click on bikeKid2 in the Object tree.
Under his functions tab, find bikeKid2
is at least threshold away from
object. Click and drag this over the
true in the While.
Select 5 meters for threshold, and
Dummy Objects, p2finish for object.
player2race
•
•
•
•
Drag a Wait into the While. Select 1
second.
Drag bikeKid2 into the While after the
Wait. Select move toward, then 1
meter, Dummy Objects, p2finish.
Now, click on the amount to change
it to 5 meters.
Click more to set duration to .25 and
style to abruptly.
player2race
•
•
•
Now player2race is finished!
He will move forward every second.
To change how long he waits
between moves, change the value in
the Wait block. You can use this later
to change the difficulty.
Press
. You should see a
countdown, then the second biker
should take off.
Receiving Input
• Our next step is to write player1race.
•
We know that for that to work we will
need to get input from the keyboard.
We will do this using Events.
Receiving Input
•
First lets create a New Variable in
the world's properties tab and call it
"current-letter". For type, select
Other... String. For now, the value
can just be "a".
Receiving Input
•
•
•
Now we will create events to detect
when a key is typed.
Click
in the Events section
and select When a key is typed.
Click any key and select letters, A.
Receiving Input
• Click and drag current-letter from
•
•
world's properties tab, and drop it on
Nothing in your event.
Select set value, other, "a"
Now when a is typed, current-letter
will be "a"
Receiving Input
•
•
•
Now we need to have similar events
for every letter on the home row
(a,s,d,f,j,k,l).
Drag the entire event into the
clipboard at the top-right of Alice.
Now drag back down from the
clipboard into Events 6 times,
creating 7 duplicate events.
Note: Alice doesn't let us create an event for the ';' key yet,
Receiving Input
• Change the duplicates to the letters
on the home row (A,S,D,F,J,K,L)
player1race
•
•
•
Now we are ready to write the
player1race method!
Click on the world.player1race tab.
Drag in a While and select true.
player1race
•
•
•
Just like in the player2race method,
we want this While to keep running
until your character reaches the end.
Select bikeKid1 in the Object tree,
and go to the functions tab. Drag
bikeKid1 is at least threshold away
from object over true.
Select 5 meters, Dummy objects,
p1finish.
player1race
•
•
Click Create New Variable in
world.player1race and call it
"random-letter"
We will use this to select a random
letter to challenge you to type...
player1race
•
•
...but we will need a list of letters to
choose from. Under world's
properties tab, click Create New
Variable.
Call it letters-list, of type Other...
String. Check the
make a list box.
player1race
•
•
Click
7 times, one for each letter on the
home row.
Make the value of each
item a single letter
on the home row. These
letters should be the same
as the values
you set to current-letter
when you made
your events.
player1race
•
•
Now we can pick a random letter
from this list to set to random-letter
Drag random-letter down above the
While and select set value, default
string.
player1race
•
•
From world's properties, click and
drag letters-list on top of default
string.
Select random item from list.
player1race
•
•
Now lets change letter to show
random-letter's new value.
Under letter's properties tab, click
and drag over text. Select
expressions, random-letter.
player1race
•
•
•
By default, it takes 1 second to
change this text.
We want it to be instant, so click
more, duration, then other.
Enter 0 on the calculator.
player1race
•
•
In the While, drag in an If/Else.
Select true.
Click and drag random-letter over
true. Select
expressions,
world.current-letter.
player1race
•
•
Inside this If, we need to put the code
to select a new random letter, and
move our character.
First let's set our current-letter
variable to a blank " ".
player1race
•
Next we need to choose a new
random letter, then set letter to show
that text. Use the clipboard to use the
same code you used earlier.
player1race
•
•
•
Finally, we can move our player
forward. Click and drag bikeKid1 into
the If statement.
Select methods, move towards, 5
meters, Dummy Objects, p1finish.
Click more to set duration=.25, and
style=abruptly.
Try it Out!
•
•
•
Press
and try to play the game.
Notice anything wrong?
You should be able to control your
character if you type the letters right,
but he quickly cycles off the camera.
Setting Vehicle Properties
•
•
•
We need to set the camera to follow
your character. Click on camera, and
under the properties tab, find the
vehicle property.
Click world, and select bikeKid1, the
entire bikeKid1.
Now your camera should
follow your biker.
Setting Vehicle Properties
•
We also need to make sure that the
letter stays on the screen. Use the
same process as last slide to set
letter's vehicle to camera.
How does the game end?
•
•
If you play the game now, both
players can keep moving until they're
both at the end.
We're going to need to create a
variable that tells us whether the
game is over or not.
currently-playing
•
•
In world's properties tab, click create
new variable.
Name it "currently-playing", of type
boolean.
currently-playing
•
•
In world.my first method, drag and
drop currently-playing just after "Go!".
Choose set value, true.
currently-playing
•
•
Now, in BOTH player1race AND
player2race, set currently-playing to
false at the very bottom of the
method (below everything else).
This means as soon as anyone
finishes, the race will be over.
Check to see if it's over
•
•
•
Now we need both our players to
always check to see if the race is
over before moving again.
To do this, find the While in BOTH
player1race AND player2race.
Click the rightmost arrow, select
logic, and, expressions,
world.currently-playing.
Check to see if it's over
•
Make sure you do this in player1race
AND player2race!
See Who Won
•
•
•
We're almost done, we just need to
do a check to see who has won once
the game is over.
To do this, create a method under
world's methods tab called "checkwin"
Drag this new method to the bottom
of world.my first method, after race.
See Who Won
•
•
•
•
•
Now go to the world.checkWin tab.
Drag in an If/Else and select true.
Click bikeKid1 and go to his functions
tab. Find bikeKid1 is within threshold
of object.
Click and drag this over the true in
the If/Else.
Select 5 meters, Dummy objects,
p1finish.
See Who Won
•
•
In this condition, you won. Go to
letter's properties tab. Drag over text,
select set value, other.
Type in "You Win!"
See Who Won
•
•
Now drag the entire If/Else onto the
clipboard.
Click the clipboard and drag the
statement into the Else section of the
first If/Else.
See Who Won
• Now change the values in the code
•
•
•
you just pasted.
Click bikeKid1, select bikeKid2, the
entire bikeKid2.
Click p1finish, select Dummy
Objects, p2finish.
Select "You Win!" and type in "Try
again!"
Congratulations!
You just finished creating your own
bike race typing game!
View the next slide for some additional
challenges.
Challenges
•
•
•
•
•
Add more letters to the typing game.
Give the player the ability to select
difficulty levels.
Play sounds for getting a letter right,
winning, and losing.
Make the second player move faster
when he's behind.
Add another opponent.