DEV Community

Kajiru
Kajiru

Posted on

Getting Started with 2D Games Using Arcade Library (Part 6): Controlling the Player

Let’s Control the Player

In this chapter, we’ll move the player using the keyboard.

1. Move When a Key Is Pressed

The on_key_press() method in the GameView class is executed
at the moment a key on the keyboard is pressed.

The argument key stores information about which key was pressed.

# main.py (excerpt)
def on_key_press(self, key, key_modifiers):
    # Move (WASD)
    if key == arcade.key.W: self.player.move(90, 90)   # up
    if key == arcade.key.A: self.player.move(90, 180)  # left
    if key == arcade.key.S: self.player.move(90, 270)  # down
    if key == arcade.key.D: self.player.move(90, 0)    # right
Enter fullscreen mode Exit fullscreen mode

Here, we implement the following controls:

  • W key → move upward (90°)
  • A key → move left (180°)
  • S key → move downward (270°)
  • D key → move right (0°)

The speed is set to 90 for all directions.
This means the player moves 90 pixels per second.

Once you understand the mechanism, try adjusting it to allow diagonal movement as well.

2. Stop When the Key Is Released

The on_key_release() method is executed
when a key is released.

# main.py (excerpt)
def on_key_release(self, key, key_modifiers):
    self.player.stop()  # stop moving
Enter fullscreen mode Exit fullscreen mode

Here, we simply call the stop() method implemented in BaseSprite
to stop the player’s movement.

Complete Code

Below is the complete code with all the features implemented so far.
You can copy and run it as-is.

# sprite.py (complete code)
import arcade
import math

class BaseSprite(arcade.Sprite):

    def __init__(self, filename, x, y):
        super().__init__(filename)
        # Position
        self.center_x = x
        self.center_y = y
        # Velocity
        self.vx = 0
        self.vy = 0

    def update(self, delta_time):
        """ Update """
        self.center_x += self.vx * delta_time
        self.center_y += self.vy * delta_time

    def move(self, spd, deg):
        """ Move Sprite """
        rad = deg * math.pi / 180
        self.vx = spd * math.cos(rad)
        self.vy = spd * math.sin(rad)

    def stop(self):
        """ Stop Sprite """
        self.vx = 0
        self.vy = 0

class Player(BaseSprite):

    def __init__(self, filename, x, y):
        super().__init__(filename, x, y)
Enter fullscreen mode Exit fullscreen mode
# main.py (complete code)
import arcade
import sprite

class GameView(arcade.View):

    def __init__(self, window):
        super().__init__()
        self.window = window
        self.w = self.window.width
        self.h = self.window.height

        # Background color
        self.background_color = arcade.color.PAYNE_GREY

        # Background sprites
        self.backgrounds = arcade.SpriteList()
        bkg = arcade.Sprite("images/bg_temple.png")
        bkg.center_x = self.w / 2
        bkg.center_y = self.h / 2
        self.backgrounds.append(bkg)

        # Player sprites
        self.players = arcade.SpriteList()
        self.player = sprite.Player(
            "images/ninja/front_01.png",
            x=self.w / 2,
            y=self.h / 2
        )
        self.players.append(self.player)

    def on_key_press(self, key, key_modifiers):
        # Move (WASD)
        if key == arcade.key.W: self.player.move(90, 90)   # up
        if key == arcade.key.A: self.player.move(90, 180)  # left
        if key == arcade.key.S: self.player.move(90, 270)  # down
        if key == arcade.key.D: self.player.move(90, 0)    # right

    def on_key_release(self, key, key_modifiers):
        self.player.stop()  # stop

    def on_update(self, delta_time):
        self.players.update(delta_time)

    def on_draw(self):
        self.clear()  # Clear
        self.backgrounds.draw()
        self.players.draw()

def main():
    """ main process """
    window = arcade.Window(480, 320, "Hello, Arcade!!")
    game = GameView(window)
    window.show_view(game)
    arcade.run()

if __name__ == "__main__":
    main()
Enter fullscreen mode Exit fullscreen mode

When you run the program, the result will look like this:

Coming Up Next...

Thank you for reading.
The next chapter is titled “Let’s Get Some Coins.”

Stay tuned 👍

Top comments (0)