Skip to content

LinearGradient

Linear gradient for widget backgrounds

LinearGradient creates smooth color transitions for widget backgrounds.

Use LinearGradient to:

Note

Locations should match the number of colors

Examples

javascript
let gradient = new LinearGradient();
gradient.colors = [new Color("#ff0000"), new Color("#0000ff")];
gradient.locations = [0, 1];
widget.backgroundGradient = gradient;
javascript
let gradient = new LinearGradient();
gradient.colors = [new Color("#ffffff"), new Color("#000000")];
gradient.locations = [0, 1];
gradient.startPoint = new Point(0, 0.5);
gradient.endPoint = new Point(1, 0.5);

Properties

colors

  • Type: [String]

Gradient colors

Array of colors in the gradient, from start to end.

javascript
gradient.colors = [Color.red(), Color.blue()]

locations

  • Type: [Double]

Color stop locations

Array of positions (0-1) where each color is placed. Must have the same count as colors array.

javascript
gradient.locations = [0, 0.5, 1]

startPoint

  • Type: [String: Double]

Gradient start point

Point where the gradient begins (0-1 normalized coordinates). Default is top center (0.5, 0).

javascript
gradient.startPoint = new Point(0, 0)

endPoint

  • Type: [String: Double]

Gradient end point

Point where the gradient ends (0-1 normalized coordinates). Default is bottom center (0.5, 1).

javascript
gradient.endPoint = new Point(1, 1)