Keys and movement

Classroom resources

Load these into Waypoints Prepare: choose Load URL and paste the copied address, or download the file and import it. In Prepare, the worksheet's Teacher edition shows the answers; the student copy hides them.

• Slides Download Copy address for Prepare Present from the browser, or export to PowerPoint or PDF.
• Worksheet Download Copy address for Prepare Print the student copy; the Teacher edition has the answers.

Students will be able to

• I can move something with the arrow keys in a game loop.
• I can keep a value between two limits with if.
• I can explain why a held key moves something smoothly.

Timing

Predict and Run 10 min · Investigate 15 min · Modify 15 min · Make 10 min

Before class

Read the unit primer first. pressed(key) is a recipe: two lines students copy into every game. It is needed because microStudio's keyboard has no LEFT until the first key press, so keyboard.LEFT fails at the start (the bug task); hasattr(keyboard, key) asks first. Students need not understand hasattr yet. In microStudio the arrow names also answer to W, A, S and D. Games on our page need a click before they get the keys; so does the game in microStudio's run window.

Running the lesson

1. Predict: ask how many times update() runs in one second, then how far 2 steps each time adds up to.
2. Investigate: fill in the trace table on the board; ask what a frame with no key does.
3. Modify: ask where the edge check goes: before or after the move? (after).
4. Make: let pairs test each other's player and name the extra key.

The hard part (on purpose)

Thinking in frames: a key held for a second is 60 small moves. The trace table is the moment to slow down.

When students get stuck

Answers to the checks

1. Predict: You hold the right arrow for one second. What happens to the paddle?
   It moves 120 steps right. update() runs 60 times in that second, and each time the key is down px goes up by 2. Let go and pressed("RIGHT") is false, so it stops.
2. Trace the paddle: px starts at 0. Fill in px after each frame.
   4, 4, 2
   Each frame with RIGHT down adds 2, a frame with no key changes nothing, and LEFT takes 2 away.
3. Faster: How would you make the paddle move faster?
   Change px -= 2 and px += 2 to a bigger number, such as 4
   The paddle moves 2 steps a frame. 4 steps a frame is twice as fast. -80 is how high up the paddle is drawn.
4. Spot the bug: This looks right, but it stops with AttributeError: no attribute 'LEFT' before any key is pressed. Click the line where it goes wrong.
   line 7
   microStudio adds keyboard.LEFT only after the first key press, so asking for it before then fails. The pressed() helper first checks the key is there with hasattr, so it is safe from the first frame.
5. Where this leads: A player should jump once when Space is pressed, not keep jumping while it is held. Why does pressed("SPACE") alone not do this?
   It is true every frame the key is down, so the jump would start again and again
   pressed() says whether the key is down now, every frame. A jump needs to remember it has started (a variable such as jumping = True), so a held key does not start it again.

Solutions

One possible solution for each task. Other correct programs are fine.

Modify › Stay on the screen

def pressed(key):
    return hasattr(keyboard, key) and keyboard[key] != 0

def init():
    global px
    px = 0

def update():
    global px
    if pressed("LEFT"):
        px -= 2
    if pressed("RIGHT"):
        px += 2
    if px > 90:
        px = 90
    if px < -90:
        px = -90

def draw():
    screen.clear("rgb(10,10,40)")
    screen.fillRect(px, -80, 24, 6, "rgb(100,200,255)")
    screen.drawText("px = " + str(px), 0, 80, 10, "#FFF")

Modify › Up and down too

def pressed(key):
    return hasattr(keyboard, key) and keyboard[key] != 0

def init():
    global px, py
    px = 0
    py = -80

def update():
    global px, py
    if pressed("UP"):
        py += 2
    if pressed("DOWN"):
        py -= 2
    if pressed("LEFT"):
        px -= 2
    if pressed("RIGHT"):
        px += 2

def draw():
    screen.clear("rgb(10,10,40)")
    screen.fillRect(px, py, 24, 6, "rgb(100,200,255)")
    screen.drawText("px = " + str(px), 0, 80, 10, "#FFF")

a player that moves

def pressed(key):
    return hasattr(keyboard, key) and keyboard[key] != 0

def init():
    global x, y
    x = 0
    y = 0

def update():
    global x, y
    step = 1
    if pressed("SPACE"):
        step = 3
    if pressed("LEFT"):
        x -= step
    if pressed("RIGHT"):
        x += step
    if pressed("UP"):
        y += step
    if pressed("DOWN"):
        y -= step

def draw():
    screen.clear("rgb(10,10,40)")
    screen.fillRound(x, y, 14, 14, "rgb(120,255,160)")
    screen.drawText("Hold SPACE to go fast", 0, 85, 8, "#FFF")

Stretch and support

Stretch: Make the paddle wrap round to the other side at the edges, or give it a short dash on Space that only works every few seconds.

Support: Give the edge check for the right side and ask students to write the left one.

Exit ticket

Why does the paddle stop when you let go of the key?

Each frame update() asks whether the key is down; when it is not, px is not changed, so the paddle stays where it is.

What each step is for

• Investigate: Movement in a game is a question asked every frame: if the key is down, change the position a little.
• Modify: An if after the move keeps a value inside limits; each key is its own if, so two keys can work at once.
• a player that moves: Goals only: keys change variables in update, and draw shows them.

Where it leads

Next lesson: falling stars as objects, which they have already made with turtles. Polling (asking every frame) and events (a function called on a key) are the two ways every engine reads keys.