Deuxième joueur

Andy

Ajouter un autre joueur peut permettre à un jeu de s’ouvrir à de nouvelles dimensions. Les joueurs peuvent par exemple s’assister mutuellement dans leur progression dans un esprit coopératif, ou à l’inverse concourir dans un esprit de compétition.

1. Charger un atlas images

   load.js

   function loadAtlas() {
   
     loadSpriteAtlas("assets/sprites/prune-atlas.png", {
       "prune": {
         x: 0, y: 0,
         width: 244, height: 53,
         sliceX: 4,
         anims: {
           idle: { from: 0, to: 0 },
           run: { from: 0, to: 0 },
           sleep: { from: 1, to: 1 },
           jump: { from: 2, to: 2 },
           worry: { from: 3, to: 3 },
         },
       },
     })
   
     loadSpriteAtlas("assets/sprites/bean-atlas.png", {
       "bean": {
         x: 0, y: 0,
         width: 244, height: 53,
         sliceX: 4,
         anims: {
           idle: { from: 0, to: 0 },
           run: { from: 0, to: 0 },
           sleep: { from: 1, to: 1 },
           jump: { from: 2, to: 2 },
           worry: { from: 3, to: 3 },
         },
       },
     })
   
     loadSpriteAtlas("assets/sprites/splash.png", {
       "splash": {
         x: 0, y: 0,
         width: 384, height: 64,
         sliceX: 6,
         anims: { explode: { from: 0, to: 5, speed:30 } },
       },
     })
   
   }

2. Déclarer un objet

   config.js

   const TILE_CONFIG = {
   
     "&": () => [ // player 2
       sprite("prune"),
       platformerController({
         leftKey: "q",
         rightKey: "d",
       }),
       jumpController({
         jumpKey: "z",
       }),
       sleep(),
       alive(),
       opacity(),
       scale(),
       health(1),
       area(),
       anchor("bot"),
       body(),
       respawn(),
       falling(),
       rotate(),
       pos(0, -20),
       anchor("center"),
       "player",
     ],
   
     "#": () => [ // player 1
       sprite("bean"),
       platformerController(),
       jumpController(),
       sleep(),
       alive(),
       opacity(),
       scale(),
       health(1, 4),
       area(),
       body(),
       respawn(),
       falling(),
       rotate(),
       pos(0, -20),
       anchor("center"),
     ],
   
     "=": () => [ // block
       sprite("grass"),
       area({ collisionIgnore: ["agent"] }),
       body({ isStatic: true }),
       anchor("bot"),
       offscreen({ hide: true }),
       tile({ isObstacle: true }),
     ],
   
   }

3. Placer les objets

   level.js

   const LEVELS = [
   
     {
       map: `
   
                   ===
   
            & #
           =====
   
       `,
     },
   
   ]

Paramètres

platformerController()

example

config.js

platformerController({
  leftKey: "left",
  rightKey: "right",
  moveSpeed: 480,
  glideDelay: 0.1,
  moveReductionDelay: 0.1
}),

Ressources

• prune-atlas.png