Question

所以我正在使用Phaser开发一个简单的Android应用程序。但我正在寻找是否有可能创建一个使用spritesheet动画的加载屏幕或以编程方式执行动画，而不仅仅是一个简单的裁剪如何使用相位器？

this.preloadBar = this.add.sprite(50, 170, 'preloaderBar');
this.load.setPreloadSprite(this.preloadBar);

提前致谢：）

Answer 1

为了达到这个目的，我有一个启动状态，我在其中初始化各种游戏相关的实用程序和我想在加载屏幕中的精灵。然后我只是加载预加载器状态，其他所有正在加载，我只是将前一个精灵放在屏幕上。当一切结束，主游戏或菜单状态开始时这是一个例子：

Test.Boot.prototype = {

    init: function () {
      //general game config like scaleManager
    },

    preload: function () {
      this.game.stage.backgroundColor = '#000000';
      // the sprite you want to show during loading
      this.game.load.atlasJSONHash('logo', 'asset/images/hand.png', 'asset/images/hand.json');
    },

    create: function () {
        this.state.start('Preloader');
    }

};
// Preloader.js
Test.Preloader.prototype = {

    preload: function() {
      //add the animation
      this.logo = this.add.sprite(this.world.width/2, this.world.height/2, 'logo');
      this.logo.anchor.set(0.5, 0.5);
      this.logo.animations.add('shake',[8,9,10,11,12,13,14,15,16,17,17,8,9,8]);
      this.logo.animations.play('shake', 60, true);
      //load all the other assets
      this.game.load.image("hero", "asset/images/hero.png");
      this.game.load.image("clouds", "asset/images/sky3.jpg");
      //this.game.load.image("rope", "asset/images/rope.png");
      this.game.load.atlasJSONHash('items', 'asset/images/items.png', 'asset/images/items.json');
      this.game.load.physics('physicsData', 'asset/images/polygon.json');

    },

    create: function() {
      this.game.stage.backgroundColor = '#1589FF';

      //A simple fade out effect
      this.game.time.events.add(Phaser.Timer.SECOND * 2.0, function() {
          var tween = this.add.tween(this.logo)
              .to({alpha: 0}, 750, Phaser.Easing.Linear.none);

        tween.onComplete.add(function() {
              this.logo.destroy();
              this.startGame();
          }, this);

        tween.start();
      }, this);
    },

    startGame: function() {
        this.state.start('MainMenu');
    },

};

如果您想了解更多信息，可以使用类似技术here的视频教程。

Phaser加载屏幕动画

1 个答案: