Coding the player

In this lesson, we'll add player movement, animation, and set it up to detect collisions.

To do so, we need to add some functionality that we can't get from a built-in node, so we'll add a script. Click the Player node and click the "Attach Script" button:

Skriptin asetukset -ikkunassa voit antaa oletusasetuksien olla sellaisenaan. Napsauta vain "Luo":

Muista

Jos olet luomassa C#-skriptiä tai muun kielistä skriptiä, valitse kieli kieli-pudotusvalikosta ennen kuin huitaiset luontinappia.

Muista

If this is your first time encountering GDScript, please read Scripting languages before continuing.

Aloita luomalla ne jäsenmuuttujat, jotka tämä objekti tulee tarvitsemaan:

GDScriptC#C++

extends Area2D

export var speed = 400 # How fast the player will move (pixels/sec).
var screen_size # Size of the game window.

Käyttäen export avainsanaa ensimmäiselle muuttujalle speed antaa meidän asettaa sen arvon Tarkastelijassa. Se voi olla kätevää arvoille, joita haluat säätää kuin ne olisivat solmun valmiita ominaisuuksia. Napsauta Player solmua ja aseta nopeusominaisuudeksi 400.

Varoitus

If you're using C#, you need to (re)build the project assemblies whenever you want to see new export variables or signals. This build can be manually triggered by clicking the word "Mono" at the bottom of the editor window to reveal the Mono Panel, then clicking the "Build Project" button.

_ready() funktiota kutsutaan, kun solmu lisätään skenepuuhun, mikä on hyvä hetki hakea peli-ikkunan koko:

GDScriptC#C++

func _ready():
    screen_size = get_viewport_rect().size

Nyt voimme käyttää _process() funktiota määrittelemään mitä pelaaja tekee. _process() funktiota kutsutaan jokaisella ruudunpäivityksellä, joten käytämme sitä päivittämään pelimme niitä osasia joiden odotamme muuttuvan usein. Pelaajan osalta teemme siinä seuraavaa:

• Tarkista syöte.

• Liiku annettuun suuntaan.

• Toista asiaankuuluva animaatio.

First, we need to check for input - is the player pressing a key? For this game, we have 4 direction inputs to check. Input actions are defined in the Project Settings under "Input Map". Here, you can define custom events and assign different keys, mouse events, or other inputs to them. For this game, we will map the arrow keys to the four directions.

Click on Project -> Project Settings to open the project settings window and click on the Input Map tab at the top. Type "move_right" in the top bar and click the "Add" button to add the move_right action.

We need to assign a key to this action. Click the "+" icon on the right, then click the "Key" option in the drop-down menu. A dialog asks you to type in the desired key. Press the right arrow on your keyboard and click "Ok".

Repeat these steps to add three more mappings:

1. move_left mapped to the left arrow key.

2. move_up mapped to the up arrow key.

3. And move_down mapped to the down arrow key.

Your input map tab should look like this:

Click the "Close" button to close the project settings.

Muista

We only mapped one key to each input action, but you can map multiple keys, joystick buttons, or mouse buttons to the same input action.

You can detect whether a key is pressed using Input.is_action_pressed(), which returns true if it's pressed or false if it isn't.

GDScriptC#C++

func _process(delta):
    var velocity = Vector2.ZERO # The player's movement vector.
    if Input.is_action_pressed("move_right"):
        velocity.x += 1
    if Input.is_action_pressed("move_left"):
        velocity.x -= 1
    if Input.is_action_pressed("move_down"):
        velocity.y += 1
    if Input.is_action_pressed("move_up"):
        velocity.y -= 1

    if velocity.length() > 0:
        velocity = velocity.normalized() * speed
        $AnimatedSprite.play()
    else:
        $AnimatedSprite.stop()

We start by setting the velocity to (0, 0) - by default, the player should not be moving. Then we check each input and add/subtract from the velocity to obtain a total direction. For example, if you hold right and down at the same time, the resulting velocity vector will be (1, 1). In this case, since we're adding a horizontal and a vertical movement, the player would move faster diagonally than if it just moved horizontally.

We can prevent that if we normalize the velocity, which means we set its length to 1, then multiply by the desired speed. This means no more fast diagonal movement.

Vihje

Jos et ole koskaan käyttänyt vektorimatematiikkaa, tai tarvitset kertausta, voit katsoa selityksen Godotin vektorien käytöstä: Vector math. Se on hyvä osata, mutta ei ole välttämätön oppaan loppuosan kannalta.

We also check whether the player is moving so we can call play() or stop() on the AnimatedSprite.

Vihje

$ is shorthand for get_node(). So in the code above, $AnimatedSprite.play() is the same as get_node("AnimatedSprite").play().

In GDScript, $ returns the node at the relative path from the current node, or returns null if the node is not found. Since AnimatedSprite is a child of the current node, we can use $AnimatedSprite.

Now that we have a movement direction, we can update the player's position. We can also use clamp() to prevent it from leaving the screen. Clamping a value means restricting it to a given range. Add the following to the bottom of the _process function (make sure it's not indented under the else):

GDScriptC#C++

position += velocity * delta
position.x = clamp(position.x, 0, screen_size.x)
position.y = clamp(position.y, 0, screen_size.y)

Vihje

delta`parametri `_process() funktiossa viittaa ruudun (animaatiossa) pituuteen -aikaan joka kului edellisen ruudun suorittamiseen. Tätä arvoa käyttämällä varmistutaan että liike on säännönmukainen vaikka ruudun päivitysnopeus muuttuisi.

Click "Play Scene" (F6, Cmd + R on macOS) and confirm you can move the player around the screen in all directions.

Varoitus

If you get an error in the "Debugger" panel that says

Attempt to call function 'play' in base 'null instance' on a null instance

this likely means you spelled the name of the AnimatedSprite node wrong. Node names are case-sensitive and $NodeName must match the name you see in the scene tree.

Animaatioiden valinta

Now that the player can move, we need to change which animation the AnimatedSprite is playing based on its direction. We have the "walk" animation, which shows the player walking to the right. This animation should be flipped horizontally using the flip_h property for left movement. We also have the "up" animation, which should be flipped vertically with flip_v for downward movement. Let's place this code at the end of the _process() function:

GDScriptC#C++

if velocity.x != 0:
    $AnimatedSprite.animation = "walk"
    $AnimatedSprite.flip_v = false
    # See the note below about boolean assignment.
    $AnimatedSprite.flip_h = velocity.x < 0
elif velocity.y != 0:
    $AnimatedSprite.animation = "up"
    $AnimatedSprite.flip_v = velocity.y > 0

Muista

The boolean assignments in the code above are a common shorthand for programmers. Since we're doing a comparison test (boolean) and also assigning a boolean value, we can do both at the same time. Consider this code versus the one-line boolean assignment above:

GDScriptC#

if velocity.x < 0:
    $AnimatedSprite.flip_h = true
else:
    $AnimatedSprite.flip_h = false

Play the scene again and check that the animations are correct in each of the directions.

Vihje

A common mistake here is to type the names of the animations wrong. The animation names in the SpriteFrames panel must match what you type in the code. If you named the animation "Walk", you must also use a capital "W" in the code.

When you're sure the movement is working correctly, add this line to _ready(), so the player will be hidden when the game starts:

GDScriptC#C++

hide()

Törmäyksiin valmistautuminen

Haluamme, että Player havaitsee milloin vihollinen on törmännyt siihen, mutta emme ole tehneet vielä vihollisia! Se on OK, koska aiomme laittaa sen toimimaan Godotin signal toiminnallisuudella.

Add the following at the top of the script, after extends Area2D:

GDScriptC#C++

signal hit

Tämä määrittelee mukautetun signaalin nimeltä "hit", jonka laitamme pelaajamme lähettämään, kun se törmää viholliseen. Käytämme Area2D solmua tunnistamaan törmäyksen. Valitse Player solmu ja napsauta "Solmu" välilehteä Tarkastelijan vieressä nähdäksesi listan signaaleista, joita pelaaja voi lähettää:

Notice our custom "hit" signal is there as well! Since our enemies are going to be RigidBody2D nodes, we want the body_entered(body: Node) signal. This signal will be emitted when a body contacts the player. Click "Connect.." and the "Connect a Signal" window appears. We don't need to change any of these settings so click "Connect" again. Godot will automatically create a function in your player's script.

Note the green icon indicating that a signal is connected to this function. Add this code to the function:

GDScriptC#C++

func _on_Player_body_entered(body):
    hide() # Player disappears after being hit.
    emit_signal("hit")
    # Must be deferred as we can't change physics properties on a physics callback.
    $CollisionShape2D.set_deferred("disabled", true)

Joka kerta kun vihollinen osuu pelaajaan, signaali välitetään. Meidän täytyy poistaa käytöstä pelaajan törmäys ettei se laukaise enää hit signaalia enempää kuin kerran.

Muista

Disabling the area's collision shape can cause an error if it happens in the middle of the engine's collision processing. Using set_deferred() tells Godot to wait to disable the shape until it's safe to do so.

The last piece is to add a function we can call to reset the player when starting a new game.

GDScriptC#C++

func start(pos):
    position = pos
    show()
    $CollisionShape2D.disabled = false

With the player working, we'll work on the enemy in the next lesson.