Exploring Phaser 3 with a Game: Adding Tweens

In previous articles (part 1 and part 2) we created a game with multiple scenes. Now we are going to add some tweens to it to make pegs jump over the holes.

Since the main board is just switching the sprite frames, we needed a temporary sprite which we will move between the holes. We added “removePeg” method which starts the tween on temporary sprite. clickPeg method is changed to call “removePeg” and we also removed code to update sprite frames in clickPeg. Those frames will now be changed in the tween onStart and onComplete events. Code to check for “gameover” is also moved to the tween onComplete event since we want to wait for the pegs to move before checking for “gameover” and switching to another scene.

The updated game code now runs as following

Leave A Comment

Your email address will not be published. Required fields are marked *