Types.GameObjects.Gradient
GradientConfig
<static> GradientConfig
| name | type | optional | default | description |
|---|---|---|---|---|
| config | string | Phaser.Types.GameObjects.Gradient.GradientQuadConfig | Yes | The configuration object this Gradient will use. | |
| width | number | Yes | 128 | The width of the Game Object. |
| height | number | Yes | 128 | The height of the Game Object. |
Type: object
Member of: Phaser.Types.GameObjects.Gradient
Source: src/gameobjects/gradient/typedefs/GradientConfig.js#L1
Since: 4.0.0
GradientQuadConfig
<static> GradientQuadConfig
| name | type | optional | default | description |
|---|---|---|---|---|
| bands | Phaser.Types.Display.ColorBandConfig | Phaser.Display.ColorBand | Array.<(Phaser.Types.Display.ColorBandConfig | Phaser.Display.ColorBand)> | Yes |
| offset | number | Yes | 0 | The gradient offset. This advances or withdraws the gradient along its shape. |
| repeatMode | number | Yes | 0 | The repeat mode. Gradient progress is evaluated as a number, where 0 is the start of the shape vector and 1 is the end. Note that conic gradients never leave the range 0-1 unless offset is applied. They may look weird if you do. Repeat mode tells us how to handle that number below 0/above 1. This can be one of the following: - 0 (EXTEND): values are clamped between 0 and 1, so the ends of the gradient become flat color. - 1 (TRUNCATE): values are discarded outside 0-1, so the ends of the gradient become transparent. - 2 (SAWTOOTH): values are modulo 1, so the gradient repeats. - 3 (TRIANGULAR): values rise to 1 then fall to 0, so the gradient goes smoothly back and forth. |
| shapeMode | number | Yes | 0 | The shape mode. Shapes are based on the shape vector. This can be one of the following: - 0 (LINEAR): a ribbon where the shape points from one side to the other. Commonly use for skies etc. - 1 (BILINEAR): like LINEAR, but reflected in both directions. Useful for gentle waves, reflections etc. - 2 (RADIAL): gradient spreads out from the start, to the radius described by shape. Useful for glows, ripples etc. - 3 (CONIC_SYMMETRIC): gradient is determined by angle to shape, going from 0 along the shape vector to 1 opposite it. Useful for sharp-looking features or light effects. - 4 (CONIC_ASYMMETRIC): gradient is determined by angle to shape, going from 0 to 1 with a full rotation. This creates a seam. Good for creating colors that change with angle, like speed meters. |
| start | Phaser.Types.Math.Vector2Like | Yes | "{x: 0, y: 0}" | The start of the gradient, where 0 is top/left and 1 is bottom/right. |
| shape | Phaser.Types.Math.Vector2Like | Yes | "{x: 1, y: 0}" | The shape of the gradient, as a vector pointing from the start. By default the gradient crosses the width of its object. |
| length | number | Yes | 1 | The length of the gradient. This is used if shape is not defined. |
| direction | number | Yes | 0 | The direction of the gradient. This is used if shape is not defined. |
| dither | boolean | Yes | Whether to dither the gradient. Dither can eliminate banding by introducing noise to the output. This effect can be lost when the Gradient is transformed or scaled, so it's only enabled when you want it. |
Type: object
Member of: Phaser.Types.GameObjects.Gradient
Source: src/gameobjects/gradient/typedefs/GradientQuadConfig.js#L1
Since: 4.0.0