Finish один спрайт и начать другую в фазера

Я нахожусь в середине разработки очень простой анимации, [воздушный шар поднимается вверх, непроизвольно несколько раз от верхней части экрана и выскакивает] Я получил 2 отдельных spritesheets , один для движения воздушного шара, а другой для поп-музыки. Я сделал первую половину кодирования, и теперь я пытаюсь выяснить, как вызвать другой спрайт, чтобы начать появляться здесь код,Finish один спрайт и начать другую в фазера

<!doctype html> 
<html> 
    <head> 
     <meta charset="UTF-8" /> 
     <title>hello phaser!</title> 
     <script src="./phaser-2.6.2/build/phaser.js"></script> 
    </head> 
    <body> 
    <script type="text/javascript"> 
     window.onload = function() 
     { 
      var game = new Phaser.Game(800, 600, Phaser.AUTO, '', 
         { preload: preload, create: create } 
      ); 

     function preload() 
     { 
      game.load.image('bg', 'assets/yellow-bg.png');//loads the bg image 
      game.load.atlas('BlueAtlas', 
          './assets/balloonBlue_atlas.png', 
          './assets/balloonBlue.json' 
      ); 

      game.load.atlas('PopAtlas', 
         './assets/popB_atlas.png', 
         './assets/popB.json' 
      ); 
     } 

     var balloon; 
     function create() 
     { 
      this.background = this.add.tileSprite(
        0,0, this.world.width, 
        this.world.height, 'bg' 
     );//loads bg 

     //gravity 
     game.physics.startSystem(Phaser.Physics.ARCADE); 

     //Set the world (global) gravity 
     game.physics.arcade.gravity.y = -100;//negative makes the balloon go up 

     //Sprite 2 is set to ignore the global gravity and use its own value 
     balloon = game.add.sprite(300, 550, 'BlueAtlas'); //x and y starting point 

     //Enable physics on those sprites 
     game.physics.enable(balloon, Phaser.Physics.ARCADE); 
     balloon.body.collideWorldBounds = true; 
     balloon.body.bounce.y = 0.5; 
     balloon.body.gravity.y = 50; 

     function render() 
     { 
      game.debug.text('no gravity', sprite4.x - 32, 64); 
     } 
     } 
    }; 
    </script> 
    </body> 
</html>

Я очень новичок в этом (начал использовать Phaser вчера) Ты поможешь мне любезно? Я попытался следовать некоторым примерам из Интернета, но он очень продвинутый, и было бы совершенно здорово получить некоторое объяснение вместе с ним. Спасибо!

источник

2016-09-26 Pikosan

Phaser на самом деле имеет довольно хороший учебник (они обычно делают) для переключения spritesheet: http://phaser.io/examples/v2/animation/change-texture-on-click

я изменил свой код, чтобы продемонстрировать, как интегрировать идеи из учебника в код:

<!doctype html> 
 
<html> 
 
    <head> 
 
     <meta charset="UTF-8" /> 
 
     <title>hello phaser!</title> 
 
     <script src="./phaser-2.6.2/build/phaser.js"></script> 
 
    </head> 
 
    <body> 
 
    <script type="text/javascript"> 
 
     window.onload = function() 
 
     { 
 
      var game = new Phaser.Game(800, 600, Phaser.AUTO, '', 
 
         { preload: preload, create: create, update: update,render: render} 
 
         //you'll need to add an 'update' function which you'll see 
 
         //below, as well as add 'render' if you want that render function 
 
         //you had below get called 
 
      ); 
 

 
     function preload() 
 
     { 
 
      game.load.image('bg', 'assets/yellow-bg.png');//loads the bg image 
 
      game.load.atlas('BlueAtlas', 
 
          './assets/balloonBlue_atlas.png', 
 
          './assets/balloonBlue.json' 
 
      ); 
 

 
      game.load.atlas('PopAtlas', 
 
         './assets/popB_atlas.png', 
 
         './assets/popB.json' 
 
      ); 
 
     } 
 

 
     var balloon; 
 
     function create() 
 
     { 
 
      this.background = this.add.tileSprite(
 
        0,0, this.world.width, 
 
        this.world.height, 'bg' 
 
     );//loads bg 
 

 
     //gravity 
 
     game.physics.startSystem(Phaser.Physics.ARCADE); 
 

 
     //Set the world (global) gravity 
 
     game.physics.arcade.gravity.y = -100;//negative makes the balloon go up 
 

 
     //Sprite 2 is set to ignore the global gravity and use its own value 
 
     balloon = game.add.sprite(300, 550, 'BlueAtlas'); //x and y starting point 
 

 
     //Enable physics on those sprites 
 
     game.physics.enable(balloon, Phaser.Physics.ARCADE); 
 
     balloon.body.collideWorldBounds = true; 
 
     balloon.body.bounce.y = 0.5; 
 
     balloon.body.gravity.y = 50; 
 
     } 
 

 
     function update() { //the update function that gets called every loop of the game 
 
     if(balloon.body.position.y == 0) { //this will make the balloon pop once it hits 
 
      //the top of the screen, maybe not exactly when you want 
 
      changeSpritesheet();//call the function to change the spritesheet used for 
 
      //you balloon 
 
     } 
 
     } 
 

 
     function changeSpritesheet() { 
 
     balloon.loadTexture('PopAtlas',0);//Load in the other spritesheet, you can pass 
 
     //other parameters, see http://phaser.io/docs/2.3.0/Phaser.Component.LoadTexture. 
 
     //html#loadTexture 
 
     balloon.animations.add('pop'); //Give the animation a name, see 
 
     //http://phaser.io/docs/2.6.2/Phaser.AnimationManager.html#add 
 
     //for more parameters you can add 
 
     } 
 

 
     function render()//I noticed that this was inside your 'create' function, which 
 
     //I'm guessing you did not mean to do so I moved it out 
 
     { 
 
      //game.debug.text('no gravity', sprite4.x - 32, 64);//sprite4 isn't being used? 
 
     } 
 
    }; 
 
    </script> 
 
    </body> 
 
</html>

У Phaser обычно отличная документация и примеры, поэтому всегда старайтесь их искать! Но я понимаю, как иногда (особенно когда вы только начинаете) может быть трудно понять, как применить его к вашему коду

источник

2016-09-27 05:39:47 HaywardMorihara

Большое вам спасибо! Цените комментарии, действительно помогли! – Pikosan

Finish один спрайт и начать другую в фазера

ответ

Смежные вопросы