ColumnBox class
A convenience widget for creating vertical flex layouts.
ColumnBox is a specialized version of FlexBox that automatically sets the direction to FlexDirection.column, creating a vertical layout where children flow from top to bottom.
This widget provides all the same flexbox features as FlexBox but with a simpler API for the common case of vertical layouts.
Example
ColumnBox(
alignItems: BoxAlignmentGeometry.center,
justifyContent: BoxAlignmentBase.spaceEvenly,
verticalSpacing: SpacingUnit.fixed(12),
children: [
FlexItem(child: Text('Top')),
FlexItem(child: Text('Middle')),
FlexItem(child: Text('Bottom')),
],
)
Reverse Direction
Use the reverse parameter or ColumnBox.reverse constructor for reverse flow:
ColumnBox(
reverse: true, // or use ColumnBox.reverse()
children: [/* items flow bottom to top */],
)
Equivalent to
FlexBox(
direction: FlexDirection.column,
// ... other properties
children: children,
)
- Inheritance
-
- Object
- DiagnosticableTree
- Widget
- StatelessWidget
- FlexBox
- ColumnBox
- Available extensions
Constructors
-
ColumnBox({Key? key, FlexWrap wrap = FlexWrap.none, int? maxItemsPerLine, int? maxLines, EdgeSpacingGeometry padding = EdgeSpacing.zero, SpacingUnit rowGap = SpacingUnit.zero, SpacingUnit columnGap = SpacingUnit.zero, BoxAlignmentGeometry alignItems = BoxAlignmentGeometry.start, BoxAlignmentContent alignContent = BoxAlignmentContent.start, BoxAlignmentBase justifyContent = BoxAlignmentBase.start, TextDirection? textDirection, bool reversePaint = false, ScrollController? verticalController, ScrollController? horizontalController, DiagonalDragBehavior diagonalDragBehavior = DiagonalDragBehavior.free, LayoutOverflow horizontalOverflow = LayoutOverflow.hidden, LayoutOverflow verticalOverflow = LayoutOverflow.hidden, TextBaseline? textBaseline, Clip clipBehavior = Clip.hardEdge, BorderRadiusGeometry? borderRadius, List<
Widget> children = const [], bool reverse = false}) -
Creates a vertical flex layout container.
const
-
ColumnBox.reverse({Key? key, FlexWrap wrap = FlexWrap.none, int? maxItemsPerLine, int? maxLines, EdgeSpacingGeometry padding = EdgeSpacing.zero, SpacingUnit rowGap = SpacingUnit.zero, SpacingUnit columnGap = SpacingUnit.zero, BoxAlignmentGeometry alignItems = BoxAlignmentGeometry.start, BoxAlignmentContent alignContent = BoxAlignmentContent.start, BoxAlignmentBase justifyContent = BoxAlignmentBase.start, TextDirection? textDirection, bool reversePaint = false, ScrollController? verticalController, ScrollController? horizontalController, DiagonalDragBehavior diagonalDragBehavior = DiagonalDragBehavior.free, LayoutOverflow horizontalOverflow = LayoutOverflow.hidden, LayoutOverflow verticalOverflow = LayoutOverflow.hidden, TextBaseline? textBaseline, Clip clipBehavior = Clip.hardEdge, BorderRadiusGeometry? borderRadius, List<
Widget> children = const []}) -
Creates a vertical flex layout container with reverse flow direction.
const
Properties
- alignContent → BoxAlignmentContent
-
The alignment of the flex container's lines when wrapping is enabled.
finalinherited
- alignItems → BoxAlignmentGeometry
-
The default cross-axis alignment for all child items.
finalinherited
- asAbsoluteItem → Widget
-
Available on Widget, provided by the WidgetExtension extension
Explicitly wraps this widget as an AbsoluteItem.no setter - asFlexItem → Widget
-
Available on Widget, provided by the WidgetExtension extension
Explicitly wraps this widget as a FlexItem.no setter - borderRadius → BorderRadiusGeometry?
-
The border radius applied to the container's background and clipping.
finalinherited
-
children
→ List<
Widget> -
The list of child widgets to layout.
finalinherited
- clipBehavior → Clip
-
How to clip the content when it overflows the bounds.
finalinherited
- columnGap → SpacingUnit
-
The vertical spacing between adjacent flex items.
finalinherited
- diagonalDragBehavior → DiagonalDragBehavior
-
Controls how diagonal drag gestures are interpreted.
finalinherited
- direction → FlexDirection
-
The direction of the main axis for this flex container.
finalinherited
- hashCode → int
-
The hash code for this object.
no setterinherited
- horizontalController → ScrollController?
-
Controller for horizontal scrolling when horizontal overflow is enabled.
finalinherited
- horizontalOverflow → LayoutOverflow
-
How to handle content that exceeds the horizontal bounds.
finalinherited
- justifyContent → BoxAlignmentBase
-
The main-axis alignment for all child items.
finalinherited
- key → Key?
-
Controls how one widget replaces another widget in the tree.
finalinherited
- maxItemsPerLine → int?
-
The maximum number of items allowed per line when wrapping is enabled.
finalinherited
- maxLines → int?
-
The maximum number of lines allowed when wrapping is enabled.
finalinherited
- padding → EdgeSpacingGeometry
-
The internal padding applied to the flex container.
finalinherited
- reversePaint → bool
-
Whether to reverse the paint order of children.
finalinherited
- rowGap → SpacingUnit
-
The horizontal spacing between adjacent flex items.
finalinherited
- runtimeType → Type
-
A representation of the runtime type of the object.
no setterinherited
- textBaseline → TextBaseline?
-
The text baseline to use for aligning text within the layout.
finalinherited
- textDirection → TextDirection?
-
The text direction for resolving directional properties.
finalinherited
- verticalController → ScrollController?
-
Controller for vertical scrolling when vertical overflow is enabled.
finalinherited
- verticalOverflow → LayoutOverflow
-
How to handle content that exceeds the vertical bounds.
finalinherited
- wrap → FlexWrap
-
Controls how flex items wrap when they exceed the container's size.
finalinherited
Methods
-
aspectRatio(
double aspectRatio, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the aspect ratio constraint for this widget. -
bottom(
PositionUnit bottom, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the distance from the bottom edge of the parent container. -
build(
BuildContext context) → Widget -
Builds the widget tree for this flex container.
inherited
-
constrained(
{SizeUnit? minWidth, SizeUnit? maxWidth, SizeUnit? minHeight, SizeUnit? maxHeight, Key? key}) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets comprehensive size constraints including both minimum and maximum bounds. -
createElement(
) → StatelessElement -
Creates a StatelessElement to manage this widget's location in the tree.
inherited
-
debugDescribeChildren(
) → List< DiagnosticsNode> -
Returns a list of DiagnosticsNode objects describing this node's
children.
inherited
-
debugFillProperties(
DiagnosticPropertiesBuilder properties) → void -
Add additional properties associated with the node.
inherited
-
flexGrow(
double flexGrow, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the flex grow factor for this widget within a flex container. -
flexShrink(
double flexShrink, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the flex shrink factor for this widget within a flex container. -
height(
SizeUnit height, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the height of this widget using a SizeUnit. -
id(
Object valueKey) → Widget -
Available on Widget, provided by the WidgetExtension extension
Assigns a ValueKey to this widget using the provided value. -
key(
Key key) → Widget -
Available on Widget, provided by the WidgetExtension extension
Assigns a Key to this widget. -
left(
PositionUnit left, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the distance from the left edge of the parent container. -
maxHeight(
SizeUnit maxHeight, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the maximum height constraint for this widget using a SizeUnit. -
maxSized(
{SizeUnit? maxWidth, SizeUnit? maxHeight, Key? key}) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets maximum width and height constraints simultaneously. -
maxWidth(
SizeUnit maxWidth, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the maximum width constraint for this widget using a SizeUnit. -
minHeight(
SizeUnit minHeight, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the minimum height constraint for this widget using a SizeUnit. -
minSized(
{SizeUnit? minWidth, SizeUnit? minHeight, Key? key}) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets minimum width and height constraints simultaneously. -
minWidth(
SizeUnit minWidth, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the minimum width constraint for this widget using a SizeUnit. -
noSuchMethod(
Invocation invocation) → dynamic -
Invoked when a nonexistent method or property is accessed.
inherited
-
paintOrder(
int paintOrder, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the paint order for this widget within its parent container. -
position(
PositionType position, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the position type for this widget to control positioning context. -
positioned(
{PositionUnit? top, PositionUnit? left, PositionUnit? bottom, PositionUnit? right, Key? key}) → Widget -
Available on Widget, provided by the WidgetExtension extension
Positions the widget using multiple edge offsets simultaneously. -
right(
PositionUnit right, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the distance from the right edge of the parent container. -
selfAligned(
BoxAlignmentGeometry alignSelf, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the alignment of this widget within its parent flex container. -
sized(
{SizeUnit? width, SizeUnit? height, Key? key}) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets both width and height dimensions simultaneously. -
toDiagnosticsNode(
{String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode -
Returns a debug representation of the object that is used by debugging
tools and by DiagnosticsNode.toStringDeep.
inherited
-
top(
PositionUnit top, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the distance from the top edge of the parent container. -
toString(
{DiagnosticLevel minLevel = DiagnosticLevel.info}) → String -
A string representation of this object.
inherited
-
toStringDeep(
{String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) → String -
Returns a string representation of this node and its descendants.
inherited
-
toStringShallow(
{String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String -
Returns a one-line detailed description of the object.
inherited
-
toStringShort(
) → String -
A short, textual description of this widget.
inherited
-
width(
SizeUnit width, [Key? key]) → Widget -
Available on Widget, provided by the WidgetExtension extension
Sets the width of this widget using a SizeUnit.
Operators
-
operator ==(
Object other) → bool -
The equality operator.
inherited