Phaser Utilities
This pack of utilities includes:
- Align Grid Class
- Align Class
- UiBlock
Align Grid
This is a grid for marking out UI or other games elements based on screen size. Learn more here.
Set Up
this.aGrid = new AlignGrid({scene: this,rows: 11,cols: 11});
Show the grid
this.aGrid.showNumbers();
Place An Item On Grid
var face=this.add.image(0,0,’face’);
this.aGrid.placeAtIndex(5,face);
Align Class
The align class is used for centering and scaling.
Scale an item to a percentage of the game’s width
Align.scaleToGameW(face,.1);
Centering
Align.center(face);
Align center horizontal
Align.centerH(face);
Align center vertical
Align.centerV(face);
The UIBlock
Use this as an alernative to Phaser Containers. Read more here.
class myUI extends UIBlock {
constructor(config) {
super();
}
}