DashedDecoration class

A custom Decoration that draws a dashed (or dotted) border around a widget such as a Container, Card, or any Box widget.

Supports:

  • Solid dashes and dot-dash patterns
  • Configurable spacing, thickness, corner radius
  • Optional gradient or solid color
  • Animation support with marching ants effect (v1.1.0)
  • Custom dash patterns with arrays (v1.1.0)
  • Performance optimization with path caching (v1.1.0)

Example:

Container(
  decoration: DashedDecoration(
    step: 4,
    span: 2,
    strokeWidth: 1,
    radius: Radius.circular(12),
    color: Colors.blue,
  ),
)

// With animation
Container(
  decoration: DashedDecoration.animated(
    step: 4,
    span: 2,
    animationOffset: animationValue * 10,
    color: Colors.blue,
  ),
)

// With custom pattern
Container(
  decoration: DashedDecoration.pattern(
    dashPattern: [8, 4, 2, 4],
    color: Colors.blue,
  ),
)
Inheritance

Constructors

DashedDecoration({Gradient? gradient, Color? color, double step = 2.0, double span = 2.0, int pointCount = 0, double? pointWidth, Radius? radius, double strokeWidth = 1.0, double animationOffset = 0.0, bool enableCaching = true})
A custom Decoration that draws a dashed (or dotted) border around a widget such as a Container, Card, or any Box widget.
const
DashedDecoration.animated({Gradient? gradient, Color? color, double step = 2.0, double span = 2.0, int pointCount = 0, double? pointWidth, Radius? radius, double strokeWidth = 1.0, required double animationOffset, bool enableCaching = true})
Creates an animated dashed decoration with marching ants effect.
const
DashedDecoration.pattern({Gradient? gradient, Color? color, required List<double>? dashPattern, Radius? radius, double strokeWidth = 1.0, double animationOffset = 0.0, bool enableCaching = true})
Creates a dashed decoration with a custom dash pattern.
const

Properties

animationOffset → double
Animation offset for marching ants effect.
final
color → Color?
Border color. Used only if gradient is null.
final
dashPattern → List<double>?
Custom dash pattern array. If provided, overrides step/span/pointCount. Array represents alternating dash lengths and gaps.
final
enableCaching → bool
Enable path caching for performance optimization.
final
gradient → Gradient?
Gradient to apply to the border.
final
hashCode → int
The hash code for this object.
no setteroverride
isComplex → bool
Whether this decoration is complex enough to benefit from caching its painting.
no setterinherited
padding → EdgeInsetsGeometry
Returns the insets to apply when using this decoration on a box that has contents, so that the contents do not overlap the edges of the decoration. For example, if the decoration draws a frame around its edge, the padding would return the distance by which to inset the children so as to not overlap the frame.
no setterinherited
pointCount → int
Number of dots to appear after each dash.
final
pointWidth → double?
Length of each dot. If null, uses Paint.strokeWidth.
final
radius → Radius?
Border radius (corner rounding).
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
span → double
Spacing between each segment or dot.
final
step → double
Length of each solid dash segment.
final
strokeWidth → double
Thickness of the border.
final

Methods

createBoxPainter([VoidCallback? onChanged]) → BoxPainter
Returns a BoxPainter that will paint this decoration.
override
debugAssertIsValid() → bool
In debug mode, throws an exception if the object is not in a valid configuration. Otherwise, returns true.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
inherited
getClipPath(Rect rect, TextDirection textDirection) → Path
Returns a closed Path that describes the outer edge of this decoration.
inherited
hitTest(Size size, Offset position, {TextDirection? textDirection}) → bool
Tests whether the given point, on a rectangle of a given size, would be considered to hit the decoration or not. For example, if the decoration only draws a circle, this function might return true if the point was inside the circle and false otherwise.
inherited
lerpFrom(Decoration? a, double t) → Decoration?
Linearly interpolates from another Decoration (which may be of a different class) to this.
inherited
lerpTo(Decoration? b, double t) → Decoration?
Linearly interpolates from this to another Decoration (which may be of a different class).
inherited
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String
A string representation of this object.
inherited
toStringShort() → String
A brief description of this object, usually just the runtimeType and the hashCode.
inherited

Operators

operator ==(Object other) → bool
The equality operator.
override