CarouselView.weightedBuilder constructor

const CarouselView.weightedBuilder({
  1. Key? key,
  2. EdgeInsets? padding,
  3. Color? backgroundColor,
  4. double? elevation,
  5. ShapeBorder? shape,
  6. Clip? itemClipBehavior,
  7. WidgetStateProperty<Color?>? overlayColor,
  8. bool itemSnapping = false,
  9. double shrinkExtent = 0.0,
  10. CarouselController? controller,
  11. Axis scrollDirection = Axis.horizontal,
  12. bool reverse = false,
  13. bool consumeMaxWeight = true,
  14. ValueChanged<int>? onTap,
  15. bool enableSplash = true,
  16. required List<int> flexWeights,
  17. required NullableIndexedWidgetBuilder? itemBuilder,
  18. int? itemCount,
  19. ValueChanged<int>? onIndexChanged,
  20. bool infinite = false,
})

Creates a scrollable carousel with weighted items created on demand.

This constructor combines the benefits of CarouselView.weighted with lazy loading. Items are built on demand while maintaining the weighted layout system.

The flexWeights parameter determines the layout, and itemBuilder creates items as they become visible.

This example shows how to create a weighted carousel with lazy loading:

CarouselView.weightedBuilder(
  flexWeights: const <int>[1, 7, 1],
  itemCount: 100,
  itemBuilder: (BuildContext context, int index) {
    return ColoredBox(
      color: Colors.primaries[index % Colors.primaries.length],
      child: Center(
        child: Text('Item $index'),
      ),
    );
  },
)

See also:

Implementation

// TODO(framework): Add unit tests to this code snippet.
// https://github.com/flutter/flutter/issues/188530
///
/// This example shows how to create a weighted carousel with lazy loading:
///
/// ```dart
/// CarouselView.weightedBuilder(
///   flexWeights: const <int>[1, 7, 1],
///   itemCount: 100,
///   itemBuilder: (BuildContext context, int index) {
///     return ColoredBox(
///       color: Colors.primaries[index % Colors.primaries.length],
///       child: Center(
///         child: Text('Item $index'),
///       ),
///     );
///   },
/// )
/// ```
///
/// </callout-box>
///
/// See also:
///
///  * [CarouselView.new], which creates a carousel with explicit children.
///  * [CarouselView.weighted], which creates a carousel with weighted items.
///  * [CarouselView.builder], which creates a carousel with fixed-sized items
///    using lazy loading.
const CarouselView.weightedBuilder({
  super.key,
  this.padding,
  this.backgroundColor,
  this.elevation,
  this.shape,
  this.itemClipBehavior,
  this.overlayColor,
  this.itemSnapping = false,
  this.shrinkExtent = 0.0,
  this.controller,
  this.scrollDirection = Axis.horizontal,
  this.reverse = false,
  this.consumeMaxWeight = true,
  this.onTap,
  this.enableSplash = true,
  required List<int> this.flexWeights,
  required this.itemBuilder,
  this.itemCount,
  this.onIndexChanged,
  this.infinite = false,
}) : itemExtent = null,
     children = const <Widget>[];