Anims in Phaser 3 group

Phaser 3
1

Hi! I have a file of a group of enemies in phaser 3.

My file:

export default class PigGroup extends Phaser.Physics.Arcade.Group {

constructor(physicsWorld, scene) {
    super(physicsWorld, scene);
}
crearPig(x,y){

    this.create(x,y,'Pig')

                .setGravityY(1000)

                .setSize(30,30); //hitbox                
}

}

I want to create his own animations inside the file and later call them in scene.
Does anyone could help me please? :frowning:

2

You can use this.scene.anims.create() within PigGroup methods.

3

@samme bro and how do I call an animation in scene? For every members

4

Now my file is like this, is it correct?

export default class PigGroup extends Phaser.Physics.Arcade.Group {

constructor(physicsWorld, scene) {

    super(physicsWorld, scene);

    this.animaciones();

}

crearPig(x,y){

    this.create(x,y,'Pig')

                .setGravityY(1000)

                .setSize(30,30); //hitbox                

}

animaciones(){

    this.scene.anims.create({

        key: 'PigEstatico',

        frames: this.scene.anims.generateFrameNumbers('Pig', { start: 0, end: 10 }),

        frameRate: 15

    });
}

}

5

That looks fine.

To play an animation on all group members you do

group.playAnimation('PigEstatico');
6

@samme bro I tried that but it doesnā€™t work, in console appeared ā€œMissing animation: PigEstaticoā€
Could u help me?:frowning:

7

You need to create the animation before playing it.

You donā€™t need to create the animation in the PigGroup class, although you can.

8

@samme Yes, I created the animation before playing it, but nothing happens.
Also I tried creating the animation in the scene but nothing happens too.
Iā€™ve been trying all day but I canā€™t

9

Are you still getting ā€œMissing animationā€?

Whatā€™s the scene code?

10

@samme this is scene code:

import Rey from ā€œā€¦/clases/rey.jsā€;
import Pig from ā€œā€¦/clases/pig.jsā€;
import PigGroup from ā€œā€¦/clases/pigGroup.jsā€;
import CamaraYMovimiento from ā€œā€¦/clases/CamaraYMovimiento.jsā€;

export default class Scene1 extends Phaser.Scene {
constructor(){
super({key: ā€˜Scene1ā€™});
}

preload(){
    //mapa
    this.load.image("TILES1", "assets/maps/TileSets/Terrain.png"); 
    this.load.image("TILES2", "assets/maps/TileSets/Decorations.png"); 
    this.load.tilemapTiledJSON('map1',"assets/maps/map1.json");
    //REY
    this.load.spritesheet('Rey','assets/sprites/KingHuman/Idle.png', {frameWidth: 78, frameHeight: 58});
    this.load.spritesheet('ReyC','assets/sprites/KingHuman/Run.png', {frameWidth: 78, frameHeight: 58});
    //puerquitos
    this.load.spritesheet('Pig','assets/sprites/Pig/Idle.png', {frameWidth: 34, frameHeight: 28});

}

create(){
    //mapa
    const map1 = this.make.tilemap({ key: "map1", tileWidth: 32, tileHeight: 32});
    //solidos
    const tileset = map1.addTilesetImage("tiles1", "TILES1"); 
    const layer = map1.createLayer("solidos", tileset, 0,0); 
    //decoraciones
    const tileset2 = map1.addTilesetImage("tiles2", "TILES2"); 
    const layer2 = map1.createLayer("decoraciones", tileset2, 0,0);

    //rey
    this.rey = new Rey(this, 150, 400, 'Rey'); 

    this.pigGroup = new PigGroup(this.physics.world, this);
    this.pigGroup.crearPig(200,200);
    this.pigGroup.crearPig(250,200);
    this.pigGroup.animaciones();
    
    //colisiones
    layer.setCollisionByProperty({ solido: true});
    this.physics.add.collider(this.rey, layer);

    this.physics.add.collider(this.pigGroup,layer);

    //camara
    this.CamaraYMovimiento = new CamaraYMovimiento(this,map1,this.rey);
}

update(){
    this.rey.update();
    this.pigGroup.playAnimation('PigEstatico');
}

}