How to create Flappy Bird (Part 8) – Jumping sound

บทนำ (Overview)

จากบทความที่แล้วเราทำให้นกหล่นเมื่อชนท่อ (http://blog.itselectlab.com/?p=2007) เมื่อภาพเคลื่อนไหวก็จะต้องเสียงเพื่อเพิ่มสนุก ในบทความนี้เราจะเพิ่มเสียงเมื่อนกกระโดดหรือบินขึ้น

ขั้นตอน (Steps)

1. เราจะมาใส่เสียงเวลาบินขึ้นกัน

       preload: function() {
           game.stage.backgroundColor = '#71c5cf';
           game.load.image('bird', 'assets/bird.png');
           game.load.image('pipe', 'assets/pipe.png');
           //โหลด .wav
           game.load.audio('jump', 'assets/flap.wav');
       }
   
       create: function() { 
   
          this.bird = this.game.add.sprite(100, 245, 'bird');
   
          game.physics.startSystem(Phaser.Physics.ARCADE);
          game.physics.arcade.enable(this.bird);
          this.bird.body.gravity.y = 1000;
   
          var spaceKey = this.game.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR);
          spaceKey.onDown.add(this.jump, this); 
   
          this.pipes = game.add.group();
          this.pipes.enableBody = true;
          this.pipes.createMultiple(20, 'pipe');  
   
          this.timer = game.time.events.loop(1600, this.addLongPipes, this); 
   
          this.score = 0;
          this.labelScore = game.add.text(20, 20, "0", { font: "30px Arial", fill: "#ffffff" });  
   
          this.bird.anchor.setTo(-0.2, 0.5); 
   
          //ตั้งชื่ออ้างอิงไว้สำหรับสั่งให้เล่นเสียง
          this.jumpSound = game.add.audio('jump'); 
   
       }
   
       jump: function() {  
   
         if (this.bird.alive == false) {
            return;
         }
   
       	this.bird.body.velocity.y = -350;
   
   	var animation = game.add.tween(this.bird);
   	animation.to({angle: -20}, 100);
   	animation.start();
           //สั่งให้เล่นเวลากระโดด
   	this.jumpSound.play();
       }
   

2. สามารถดาวน์โหลด “source-code” ได้ที่ https://gist.github.com/thaisingle/c9fa47d31023c31e57af