FlexLayout class

A layout algorithm implementing the CSS Flexbox specification.

FlexLayout provides a complete implementation of the flexbox layout model, supporting all major flexbox features including direction, wrapping, alignment, spacing, and flexible sizing. It follows the CSS Flexbox specification closely while being optimized for Flutter's layout system.

Key Features

• Direction: Row, column, and reverse variants
• Wrapping: Single line or multi-line with wrap/nowrap options
• Alignment: Main-axis (justify-content), cross-axis (align-items), and line alignment (align-content)
• Flexible Sizing: Flex grow and shrink with basis sizing
• Spacing: Configurable gaps between items and padding
• RTL Support: Automatic handling of right-to-left text directions

Usage

FlexLayout is typically used through FlexBox widget, but can be used directly with LayoutBox for custom implementations:

LayoutBoxWidget(
  layout: FlexLayout(
    direction: FlexDirection.row,
    wrap: FlexWrap.wrap,
    alignItems: BoxAlignment.center,
    justifyContent: BoxAlignment.spaceBetween,
  ),
  children: [/* flex items */],
)

Inheritance

• Object
• Layout
• FlexLayout

Constructors

FlexLayout({FlexDirection direction = FlexDirection.row, FlexWrap wrap = FlexWrap.none, EdgeSpacing padding = EdgeSpacing.zero, SpacingUnit rowGap = SpacingUnit.zero, SpacingUnit columnGap = SpacingUnit.zero, int? maxItemsPerLine, int? maxLines, BoxAlignmentGeometry alignItems = BoxAlignment.start, BoxAlignmentContent alignContent = BoxAlignment.start, BoxAlignmentBase justifyContent = BoxAlignment.start})

Creates a flex layout with the specified configuration.

const

Properties

alignContent → BoxAlignmentContent

The cross-axis alignment for flex lines when wrapping is enabled.

final

alignItems → BoxAlignmentGeometry

The default cross-axis alignment for all items.

final

columnGap → SpacingUnit

The vertical spacing between adjacent flex items.

final

direction → FlexDirection

The direction of the main axis for this flex layout.

final

hashCode → int

The hash code for this object.

no setter, inherited

justifyContent → BoxAlignmentBase

The main-axis alignment for items within each flex line.

final

mainAxis → LayoutAxis

no setter, override

maxItemsPerLine → int?

The maximum number of items allowed per line when wrapping is enabled.

final

maxLines → int?

The maximum number of lines allowed when wrapping is enabled.

final

padding → EdgeSpacing

The padding applied inside the flex container.

final

rowGap → SpacingUnit

The horizontal spacing between adjacent flex items.

final

runtimeType → Type

A representation of the runtime type of the object.

no setter, inherited

wrap → FlexWrap

Controls how flex items wrap when they exceed the container's size.

final

Methods

createLayoutHandle(ParentLayout parent) → LayoutHandle<Layout>

Creates a layout handle for performing flex layout operations.

override

noSuchMethod(Invocation invocation) → dynamic

Invoked when a nonexistent method or property is accessed.

inherited

toString() → String

A string representation of this object.

inherited

Operators

operator ==(Object other) → bool

The equality operator.

inherited