Character movement

For a game where you have a character that can walk, run, jump, etc, you will need some generic character movement functionality. If you want to have complete control, you could implement this yourself, but there is also a built in character movement component that you can attach to your character actor.


The actor implementation below illustrates how you can attach the CharacterMovementComponent to an actor and pass in various properties to configure its behaviours. In the example we are also attaching a mesh component to give the character a visual representation. Also, the third party camera component is attached to have a camera following the character.

class CharacterActor extends BaseActor {
  private physicsSystem = inject(PhysicsSystem)
  private viewController = inject(ViewController)

  private mesh = attach(MeshComponent, {
    object: new Mesh(
      new CylinderBufferGeometry(.5, .5, 2),
      new MeshStandardMaterial({color: 0xffffff})
  private thirdPartyCamera = attach(ThirdPartyCameraComponent)
  public movement = attach(CharacterMovementComponent, {
    autoStepMaxHeight: 0,
    colliderHeight: 2,
    colliderRadius: .5,
    maxWalkingSlopeAngle: 70,
    maxSpeed: 3,
    maxSpeedBackwards: 3,
    maxSpeedSprint: 7,

You likely want to tweak the parameters of the character movement component a lot to find something that works well for your game.

In this example, we make the movement component instance public because it provides an interface to control movement which we want to be accessible from a player controller.

Controlling the movement

With the above code, the character will simply fall to the ground where it is spawned and not move. To control the character you need to bind various action inputs that are exposed on the movement component.

  • directionInput - For controlling the movement of the character forward, backward, left and right

  • jumpInput - Toggle when you want the character to jump

  • sprintInput - Toggle to change the movement speed to the configured sprinting speed

  • rotationInput - Rotate the character around the y-axis to turn left and right.

The code example below illustrates how code could look inside a player controller using an injected InputService and a referenced character actor with a movement component.

const playerMove = this.character.movement.directionInput
const playerJump = this.character.movement.jumpInput
const playerSprint = this.character.movement.sprintInput

this.inputService.bindToggle(InputAction.jump, playerJump.toggle)
this.inputService.bindToggle(InputAction.sprint, playerSprint.toggle)
this.inputService.bindToggle(InputAction.moveForward, playerMove.togglePositiveY)
this.inputService.bindToggle(InputAction.moveBackward, playerMove.toggleNegativeY)
this.inputService.bindToggle(InputAction.moveLeft, playerMove.toggleNegativeX)
this.inputService.bindToggle(InputAction.moveRight, playerMove.togglePositiveX)

Read more about how to handle player input in the Player input guide.

Last updated