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

Members

game:Phaser.Game

A reference to the currently running Game.

Source - core/FlexGrid.js, line 26

manager:Phaser.ScaleManager

A reference to the ScaleManager.

Source - core/FlexGrid.js, line 31

<readonly>positionCustom

Properties:

Name

Type

Description

position

Phaser.Point

Source - 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 - core/FlexGrid.js, line 55

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

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.

Returns:

Phaser.FlexLayer-

The Layer object.

Source - 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

children

Array.<PIXI.DisplayObject>

<optional>

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

Returns:

Phaser.FlexLayer-

The Layer object.

Source - 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

children

array

<optional>

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

Returns:

Phaser.FlexLayer-

The Layer object.

Source - 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

children

array

<optional>

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

Returns:

Phaser.FlexLayer-

The Layer object.

Source - core/FlexGrid.js, line 170

debug()

Call in the render function to output the bounds rects.

Source - 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 - 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 - core/FlexGrid.js, line 240

refresh()

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

Source - core/FlexGrid.js, line 256

reset()

Resets the layer children references

Source - 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 - core/FlexGrid.js, line 77