Shimmer constructor

const Shimmer({
  1. Key? key,
  2. required Widget child,
  3. Widget? shimmerWidget,
  4. required bool isLoading,
  5. LinearGradient linearGradient = const LinearGradient(colors: [Color(0xFFEBEBF4), Color(0xFFF4F4F4), Color(0xFFEBEBF4)], stops: [0.1, 0.3, 0.4], begin: Alignment(-1.0, -0.3), end: Alignment(1.0, 0.3)),
})

A widget that provides a shimmer effect to indicate loading state.

The Shimmer widget wraps a child widget and displays a shimmering animation over it when isLoading is true. You can customize the shimmer effect by providing a shimmerWidget or by changing the linearGradient.

The shimmer animation is controlled by an internal AnimationController.

Example usage:

Shimmer(
  isLoading: true,
  child: YourContentWidget(),
)

Properties:

  • shimmerWidget : An optional custom widget to use as the shimmer effect. If provided, this widget will be displayed as the shimmer overlay instead of the default gradient shimmer.
  • child : The main content widget that you want to display. When isLoading is true, the shimmer effect overlays this child.
  • linearGradient : The gradient used for the shimmer animation. You can customize the shimmer’s colors, stops, and direction by providing a different LinearGradient. Defaults to a light gray gradient.
  • isLoading : Controls whether the shimmer effect is shown. If true, the shimmer animation overlays the child. If false, only the child is displayed without any shimmer effect.

Implementation

const Shimmer({
  super.key,
  required this.child,
  this.shimmerWidget,
  required this.isLoading,
  this.linearGradient = const LinearGradient(
    colors: [Color(0xFFEBEBF4), Color(0xFFF4F4F4), Color(0xFFEBEBF4)],
    stops: [0.1, 0.3, 0.4],
    begin: Alignment(-1.0, -0.3),
    end: Alignment(1.0, 0.3),
  ),
});