Table of Contents

Class Gradient

Namespace
BSGameLib.UI.Controls
Assembly
BSGameLib.UI.dll

A smooth multi-stop fill - linear along an axis, or radial out from a center point.

public class Gradient
Inheritance
Gradient
Inherited Members

Remarks

Rendered by tessellating the target rect and evaluating this gradient at each vertex, letting the GPU interpolate between them (see GradientMesh). That needs no texture, shader or material, which is what keeps a gradient usable from a .view.xml the same way a flat color is.

Angles follow the CSS convention, so a value copied off a design mockup means the same thing here: 0 points to the top, 90 to the right, 180 to the bottom, 270 to the left.

Properties

Angle

Direction in degrees for a linear gradient. Ignored when radial.

public float Angle { get; set; }

Property Value

float

Center

Center of a radial gradient, in 0-1 fractions of the target rect. Ignored when linear. Defaults to the middle.

public Vector2 Center { get; set; }

Property Value

Vector2

Kind

Whether the gradient is linear or radial.

public GradientKind Kind { get; set; }

Property Value

GradientKind

Stops

The colour stops, in order along the gradient. A gradient with no stops draws nothing.

public List<GradientStop> Stops { get; }

Property Value

List<GradientStop>

Methods

ColorAt(float)

Color at a position from 0 to 1 along the gradient.

public Color ColorAt(float position)

Parameters

position float

Returns

Color

PositionAt(float, float, float)

Position along the gradient, 0 to 1, of a point given in 0-1 fractions of the rect.

public float PositionAt(float u, float v, float aspect = 1)

Parameters

u float
v float
aspect float

The target rect's width divided by its height. A linear gradient's angle is measured in pixels, as CSS measures it, so a non-square rect skews the axis: 135deg across a wide, short button is very nearly a left-to-right sweep, not the corner-to-corner diagonal it would be on a square. Defaults to 1 - a square, where the two agree.

Returns

float