applyRadial method

Gradient applyRadial({
  1. required List<Color> colors,
  2. Shape? shape,
  3. RadialGradientPosition? position,
  4. List<Dim>? stops,
})

Adds a radial gradient.

Example

final gradient = Gradient()
  ..applyRadial(
    colors: const [Colors.red, Color('#feb47b')],
    shape: Shape.circle,
    position: RadialGradientPosition.center,
    stops: const [Dim.px(20), Dim.percent(80)],
  );
  • colors: List of stop colors.
  • shape: Shape of the gradient.
  • position: Position of the gradient center.
  • stops: Optional stops corresponding to colors. Accepts length or percentage units (e.g., Dim.percent(50), Dim.px(20), Dim.rem(1.5)). Unitless numbers are not valid CSS.

Implementation

Gradient applyRadial({
  required List<Color> colors,
  Shape? shape,
  RadialGradientPosition? position,
  List<Dim>? stops,
}) {
  final List<String> parts = [];

  if (shape != null && position != null) {
    parts.add('${shape.value} at ${position.value}');
  } else if (shape != null) {
    parts.add(shape.value);
  } else if (position != null) {
    parts.add('at ${position.value}');
  }

  for (int i = 0; i < colors.length; i++) {
    final colorStr = colors[i].value;

    if (stops != null && i < stops.length) {
      parts.add('$colorStr ${stops[i]}');
    } else {
      parts.add(colorStr);
    }
  }

  _gradients.add(GradientType.radial.cssText(parts));

  return this;
}