new FlexGrid(manager, width, height)
WARNING: This is an EXPERIMENTAL class. The API will change significantly in the coming versions and is incomplete.
Please try to avoid using in production games with a long time to build.
This is also why the documentation is incomplete.
FlexGrid is a a responsive grid manager that works in conjunction with the ScaleManager RESIZE scaling mode and FlexLayers
to provide for game object positioning in a responsive manner.
Parameters
| Name | Type | Description |
|---|---|---|
manager |
Phaser.ScaleManager | The ScaleManager. |
width |
number | The width of the game. |
height |
number | The height of the game. |
- Source code: core/FlexGrid.js (Line 21)
Public Properties
-
game : Phaser.Game
-
A reference to the currently running Game.
- Source code: core/FlexGrid.js (Line 26)
-
manager : Phaser.ScaleManager
-
A reference to the ScaleManager.
- Source code: core/FlexGrid.js (Line 31)
-
[readonly] positionCustom
-
- Source code: core/FlexGrid.js (Line 46)
Properties:
Name Type Description positionPhaser.Point -
-
[readonly] scaleCustom
-
- Source code: core/FlexGrid.js (Line 55)
Properties:
Name Type Description scaleFactorPhaser.Point The scale factor based on the game dimensions vs. the scaled dimensions.
Public Methods
-
createCustomLayer(width, height, children) → {Phaser.FlexLayer}
-
A custom layer is centered on the game and maintains its aspect ratio as it scales up and down.
Parameters
Name Type Argument Description widthnumber Width of this layer in pixels.
heightnumber Height of this layer in pixels.
childrenArray.<PIXI.DisplayObject> <optional>
An array of children that are used to populate the FlexLayer.
Returns
The Layer object.
- Source code: core/FlexGrid.js (Line 104)
-
createFixedLayer(children) → {Phaser.FlexLayer}
-
A fixed layer is centered on the game and is the size of the required dimensions and is never scaled.
Parameters
Name Type Argument Description childrenArray.<PIXI.DisplayObject> <optional>
An array of children that are used to populate the FlexLayer.
Returns
The Layer object.
- Source code: core/FlexGrid.js (Line 194)
-
createFluidLayer(children) → {Phaser.FlexLayer}
-
A fluid layer is centered on the game and maintains its aspect ratio as it scales up and down.
Parameters
Name Type Argument Description childrenarray <optional>
An array of children that are used to populate the FlexLayer.
Returns
The Layer object.
- Source code: core/FlexGrid.js (Line 141)
-
createFullLayer(children) → {Phaser.FlexLayer}
-
A full layer is placed at 0,0 and extends to the full size of the game. Children are scaled according to the fluid ratios.
Parameters
Name Type Argument Description childrenarray <optional>
An array of children that are used to populate the FlexLayer.
Returns
The Layer object.
- Source code: core/FlexGrid.js (Line 170)
-
debug()
-
Call in the render function to output the bounds rects.
- Source code: core/FlexGrid.js (Line 299)
-
fitSprite(sprite)
-
Fits a sprites width to the bounds.
Parameters
Name Type Description spritePhaser.Sprite The Sprite to fit.
- Source code: core/FlexGrid.js (Line 284)
-
onResize(width, height)
-
Called when the game container changes dimensions.
Parameters
Name Type Description widthnumber The new width of the game container.
heightnumber The new height of the game container.
- Source code: core/FlexGrid.js (Line 240)
-
refresh()
-
Updates all internal vars such as the bounds and scale values.
- Source code: core/FlexGrid.js (Line 256)
-
reset()
-
Resets the layer children references
- Source code: core/FlexGrid.js (Line 218)
-
setSize(width, height)
-
Sets the core game size. This resets the w/h parameters and bounds.
Parameters
Name Type Description widthnumber The new dimensions.
heightnumber The new dimensions.
- Source code: core/FlexGrid.js (Line 77)