Phaser has been used in creating this game. Phaser is a 2D game framework used for making HTML5 games for desktop and mobile.
In this game, I have used a concept called tween effect. A Tween allows you to alter one or more properties of a target object over a defined period of time.
This can be used for things such as alpha fading Sprites, scaling them or motion. I have used this mainly to deal with the effects we can apply on the spinning wheel. Parameters in tween class includes targets, motion type, scaling, etc.
Inorder to use the functions of phaser, we are required to include the file phaser.js in the main html file of the application.
Important Points: -
- We don't need to use the canvas tag in the html file. We can deal with it using the phaser functions in the js file instead.
- In Phaser,
- Images can be added using the sprite() function.
- Their position can be set using setPosition() funciton.
- And scaling can be done using the setScale() function.
- Tween class can be used to deal with the fade, sprite, scale or motion of an object in the canvas.
- In order to use the this(/game) function or properties we are required to specify it in the callbackScope attribute of tween class.
- For putting the text on the phaser canvas: -
this.gametext=this.add.text(x,y,"...",font class name);
- Usually a game is made up of multiple scenes, but this being a basic one doesn't need more than one scene. "this" keyword is used to point to an object similarly it has been used to access the scene/game object mostly.
- Scope of Improvement: -
- UI can be improved. E.g More features can be added to it.
- Some unique/funny/interesting type of spinning wheel can be used instead of the one I have used in this.
- Multiple scenes can be added to the game.