FlexBox constructor

const FlexBox({
  1. Key? key,
  2. FlexDirection direction = FlexDirection.row,
  3. FlexWrap wrap = FlexWrap.none,
  4. int? maxItemsPerLine,
  5. int? maxLines,
  6. EdgeSpacingGeometry padding = EdgeSpacing.zero,
  7. SpacingUnit rowGap = SpacingUnit.zero,
  8. SpacingUnit columnGap = SpacingUnit.zero,
  9. BoxAlignmentGeometry alignItems = BoxAlignmentGeometry.start,
  10. BoxAlignmentContent alignContent = BoxAlignmentContent.start,
  11. BoxAlignmentBase justifyContent = BoxAlignmentBase.start,
  12. TextDirection? textDirection,
  13. bool reversePaint = false,
  14. ScrollController? verticalController,
  15. ScrollController? horizontalController,
  16. DiagonalDragBehavior diagonalDragBehavior = DiagonalDragBehavior.free,
  17. LayoutOverflow horizontalOverflow = LayoutOverflow.hidden,
  18. LayoutOverflow verticalOverflow = LayoutOverflow.hidden,
  19. TextBaseline? textBaseline,
  20. Clip clipBehavior = Clip.hardEdge,
  21. BorderRadiusGeometry? borderRadius,
  22. List<Widget> children = const [],
})

Creates a flexible box layout container with the specified properties.

The children parameter accepts a list of widgets to layout. For best results, wrap each child in a FlexItem widget to control its flex behavior.

Example

FlexBox(
  direction: FlexDirection.row,
  wrap: FlexWrap.wrap,
  alignItems: BoxAlignmentGeometry.center,
  justifyContent: BoxAlignmentBase.spaceBetween,
  padding: EdgeSpacing.all(SizeUnit.fixed(16)),
  rowGap: SpacingUnit.fixed(8),
  columnGap: SpacingUnit.fixed(8),
  children: [
    FlexItem(child: Text('Item 1')),
    FlexItem(child: Text('Item 2')),
    FlexItem(child: Text('Item 3')),
  ],
)

All parameters are optional except children, which defaults to an empty list. The layout will automatically adapt to the provided configuration.

Creates a FlexBox with the specified flex layout properties.

Implementation

const FlexBox({
  super.key,
  this.direction = FlexDirection.row,
  this.wrap = FlexWrap.none,
  this.maxItemsPerLine,
  this.maxLines,
  this.padding = EdgeSpacing.zero,
  this.rowGap = SpacingUnit.zero,
  this.columnGap = SpacingUnit.zero,
  this.alignItems = BoxAlignmentGeometry.start,
  this.alignContent = BoxAlignmentContent.start,
  this.justifyContent = BoxAlignmentBase.start,
  this.textDirection,
  this.reversePaint = false,
  this.verticalController,
  this.horizontalController,
  this.diagonalDragBehavior = DiagonalDragBehavior.free,
  this.horizontalOverflow = LayoutOverflow.hidden,
  this.verticalOverflow = LayoutOverflow.hidden,
  this.textBaseline,
  this.clipBehavior = Clip.hardEdge,
  this.borderRadius,
  this.children = const [],
});