O'Reilly logo

Instant HTML5 2D Platformer by Aidan Temple

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating the player (Must know)

With a basic game framework in place, we can start by developing an object that will handle the player and any behaviors they may have. This will involve expanding upon the game framework to handle the loading of a sprite, which will be used to represent the player within the game.

How to do it...

  1. We must first begin by creating a new object called Player. Once created, insert the following code into our player object. This object is responsible for initializing and drawing the player on the canvas as well as stating the players position on the canvas.
    function Player() {
        this.InitPlayer = function() {
    
            this.InitDrawableObject(player_idle, 0, 0, 0);
            return this;
        }
    }
    
    Player.prototype = new DrawableObject;
  2. With our player ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required