Jump to content

How to play the animation through instance of new Animation()?


Dzmitry
 Share

Recommended Posts

Hello I can't play phaser animation through getting of constructor new Animation(game, parent, name, frameData, frames, frameRate, loop, loop).

Before adding an instance of class new Animation all work, and just sprite is showing, but after adding animation it is ceasing to work.

I spent a lot of time for realization, but without results.

What is the problem?

My classes for sprite animation:

mainPlayer.js:

import 'phaser-shim';

export default class extends Phaser.Sprite {
  constructor ({ game, x, y, asset }) {
    super(game, x, y, asset)
    this.anchor.setTo(0.5);
    this.outOfBoundsKill = true;
    this.scale.setTo(0.8);// scale
    this.angle = 90;
    game.physics.enable(this, Phaser.Physics.ARCADE);
  }

  update () {

  }
}

My mainPlayerAnimation.js:

import 'phaser-shim';

export default class extends Phaser.Ainmation {
  constructor ({ game, parent, name, frameData, frames, frameRate, loopFirst, loopSecond }) {
    super(game, parent, name, frameData, frames, frameRate, loopFirst, loopSecond);
    //this.anchor.setTo(0.5);
    //this.outOfBoundsKill = true;
    //this.scale.setTo(0.8);// scale
    //this.angle = 90;
    //game.physics.enable(this, Phaser.Physics.ARCADE);
  }

  update () {

  }
}

My level class:

import 'phaser-shim';
import config from '../config';
import currentGameState from '../currentGameState';
import backgroundMainGame from '../objects/backgroundFirstlevel';
import mainPlayer from '../objects/mainPlayer';
import mainPlayerAnimation from '../objects/mainPlayerAnimation'
import bullets from '../objects/bullets';
import enemiesloader from '../loaders/enemiesloader';
import bossloader from '../loaders/bossloader';

export default class extends Phaser.State {
    
    preload () {
       
        this.load.image('background', './img/firstlevel.jpeg');
        this.load.spritesheet('mainPlayer', './img/main.png', 50, 50);
        this.load.image('bullet', './img/shot.png');
        this.load.image('enemy', './img/enemy.png');

    }

    create () {
        //---------------------------------------------------------------
        this.background = new backgroundMainGame({
            game: this,
            x: 0,
            y: 0,
            width: 1024,
            height: 768,
            asset: 'background'
        });
        this.game.add.existing(this.background);

        //---------------------------------------------------------------
        this.mainPlayer = new mainPlayer({
            game: this,
            x: this.game.world.centerX,
            y: this.game.world.centerY,
            asset: 'mainPlayer'
        });
        this.game.add.existing(this.mainPlayer);

        //---------------------------------------------------------------
        this.mainPlayerAnimation = new mainPlayerAnimation({
            game: this,
            parent: this.mainPlayer,
            name: 'mainPlayerAnimation',
            frameData: null,
            frames: [0, 1, 2],
            frameRate: 100,
            loopFirst: true,
            loopSecond: true
        });
        //---------------------------------------------------------------
        this.bullets = new bullets({
            game: this,
            parent: null,
            name: 'bull',
            addToStage: true,
            enableBody: true,
            physicsBodyType: Phaser.Physics.ARCADE
        });
        this.game.add.existing(this.bullets);

        //-------------------------score---------------------------------
        this.scoreText = this.add.text(
        					config.gameWidth-200,
        					config.gameHeight - 50,
        					`score: ${currentGameState.score}`,
        					{ font: '32px Arial', fill: '#dddddd'});
        this.scoreText.anchor.setTo(0.5);
        
        //---------------------------------------------------------------
        this.cursors = this.input.keyboard.createCursorKeys();
        this.fireButton = this.game.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR);
    }

    update () {
        //--------------------------update score------------------------------
        this.scoreText.text = `score: ${currentGameState.score}`;

        //--------------------------if press nothing stop the ship------------
        this.mainPlayer.body.velocity.x = 0;
        this.mainPlayer.body.velocity.y = 0;

        //------------------------spawn enemies-------------------------------------        
        enemiesloader(this);
        //---------------------spawn boss------------------------------------------
        bossloader(this);
    	//-------------------------controls----------------------------------------
        if(this.cursors.left.isDown){
        	this.mainPlayer.body.velocity.x = -350;
        }
        if(this.cursors.right.isDown){
            this.mainPlayer.body.velocity.x = 350;
        }
        if(this.cursors.up.isDown){
            this.mainPlayer.body.velocity.y = -350;
        }
        if(this.cursors.down.isDown){
            this.mainPlayer.body.velocity.y = 350;
        }
        if(this.fireButton.isDown){
            this.bullets.fireBullet.call(this);
        }
    }
}

 

Link to comment
Share on other sites

8 hours ago, Dzmitry said:

but after adding animation it is ceasing to work

What happens? Do you get an error?

If you want to extend Animation:

  • You have to extend Phaser.Animation (spelling)
  • The animation needs to be added to the sprite's animation manager
  • Don't overwrite Animation#update

But you probably don't need to extend it at all. Just use Phaser.AnimationManager#add.

Link to comment
Share on other sites

3 hours ago, samme said:

What happens? Do you get an error?

Yes error is by getting frame from Phaser.FrameData. If create animation through class, it is not need to use class for creating sprite. Is it true? It is a question how to put data to frameDate, may be in any loop frameData.addFrame(new Frame(....)). And new Frame gets follow parameters index, x, y, width, height and name (name is an atlas).

Did anybody put data to Phaser.FrameData?

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...