Class: FlexGrid

Phaser. FlexGrid

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:
src/core/FlexGrid.js line 21

Members

game :Phaser.Game

A reference to the currently running Game.

Type:
Source:
src/core/FlexGrid.js line 26

manager :Phaser.ScaleManager

A reference to the ScaleManager.

Type:
Source:
src/core/FlexGrid.js line 31

<readonly> positionCustom

Properties:
Name Type Description
position Phaser.Point

-

Source:
src/core/FlexGrid.js line 46

<readonly> scaleCustom

Properties:
Name Type Description
scaleFactor Phaser.Point

The scale factor based on the game dimensions vs. the scaled dimensions.

Source:
src/core/FlexGrid.js line 55

Methods

createCustomLayer(width, height [, children])

A custom layer is centered on the game and maintains its aspect ratio as it scales up and down.

Parameters:
Name Type Argument Description
width number

Width of this layer in pixels.

height number

Height of this layer in pixels.

children Array.<PIXI.DisplayObject> <optional>

An array of children that are used to populate the FlexLayer.

Source:
src/core/FlexGrid.js line 104
Returns:

The Layer object.

Type
Phaser.FlexLayer

createFixedLayer( [children])

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
children Array.<PIXI.DisplayObject> <optional>

An array of children that are used to populate the FlexLayer.

Source:
src/core/FlexGrid.js line 194
Returns:

The Layer object.

Type
Phaser.FlexLayer

createFluidLayer( [children])

A fluid layer is centered on the game and maintains its aspect ratio as it scales up and down.

Parameters:
Name Type Argument Description
children array <optional>

An array of children that are used to populate the FlexLayer.

Source:
src/core/FlexGrid.js line 141
Returns:

The Layer object.

Type
Phaser.FlexLayer

createFullLayer( [children])

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
children array <optional>

An array of children that are used to populate the FlexLayer.

Source:
src/core/FlexGrid.js line 170
Returns:

The Layer object.

Type
Phaser.FlexLayer

debug()

Call in the render function to output the bounds rects.

Source:
src/core/FlexGrid.js line 299

fitSprite(sprite)

Fits a sprites width to the bounds.

Parameters:
Name Type Description
sprite Phaser.Sprite

The Sprite to fit.

Source:
src/core/FlexGrid.js line 284

onResize(width, height)

Called when the game container changes dimensions.

Parameters:
Name Type Description
width number

The new width of the game container.

height number

The new height of the game container.

Source:
src/core/FlexGrid.js line 240

refresh()

Updates all internal vars such as the bounds and scale values.

Source:
src/core/FlexGrid.js line 256

reset()

Resets the layer children references

Source:
src/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
width number

The new dimensions.

height number

The new dimensions.

Source:
src/core/FlexGrid.js line 77