Displays its children in a one-dimensional array.

Layout algorithm

This section describes how the framework causes RenderFlex to position its children. See BoxConstraints for an introduction to box layout models.

Layout for a RenderFlex proceeds in six steps:

  1. Layout each child a null or zero flex factor with unbounded main axis constraints and the incoming cross axis constraints. If the crossAxisAlignment is CrossAxisAlignment.stretch, instead use tight cross axis constraints that match the incoming max extent in the cross axis.
  2. Divide the remaining main axis space among the children with non-zero flex factors according to their flex factor. For example, a child with a flex factor of 2.0 will receive twice the amount of main axis space as a child with a flex factor of 1.0.
  3. Layout each of the remaining children with the same cross axis constraints as in step 1, but instead of using unbounded main axis constraints, use max axis constraints based on the amount of space allocated in step 2. Children with Flexible.fit properties that are FlexFit.tight are given tight constraints (i.e., forced to fill the allocated space), and children with Flexible.fit properties that are FlexFit.loose are given loose constraints (i.e., not forced to fill the allocated space).
  4. The cross axis extent of the RenderFlex is the maximum cross axis extent of the children (which will always satisfy the incoming constraints).
  5. The main axis extent of the RenderFlex is determined by the mainAxisSize property. If the mainAxisSize property is MainAxisSize.max, then the main axis extent of the RenderFlex is the max extent of the incoming main axis constraints. If the mainAxisSize property is MainAxisSize.min, then the main axis extent of the Flex is the sum of the main axis extents of the children (subject to the incoming constraints).
  6. Determine the position for each child according to the mainAxisAlignment and the crossAxisAlignment. For example, if the mainAxisAlignment is MainAxisAlignment.spaceBetween, any main axis space that has not been allocated to children is divided evenly and placed between the children.

See also:

Inheritance
Mixes-in

Constructors

RenderFlex({List<RenderBox> children, Axis direction: Axis.horizontal, MainAxisSize mainAxisSize: MainAxisSize.max, MainAxisAlignment mainAxisAlignment: MainAxisAlignment.start, CrossAxisAlignment crossAxisAlignment: CrossAxisAlignment.center, TextDirection textDirection, VerticalDirection verticalDirection: VerticalDirection.down, TextBaseline textBaseline })
Creates a flex render object. [...]

Properties

crossAxisAlignment CrossAxisAlignment
How the children should be placed along the cross axis. [...]
read / write
direction Axis
The direction to use as the main axis.
read / write
mainAxisAlignment MainAxisAlignment
How the children should be placed along the main axis. [...]
read / write
mainAxisSize MainAxisSize
How much space should be occupied in the main axis. [...]
read / write
textBaseline TextBaseline
If aligning items according to their baseline, which baseline to use. [...]
read / write
textDirection TextDirection
Determines the order to lay children out horizontally and how to interpret start and end in the horizontal direction. [...]
read / write
verticalDirection VerticalDirection
Determines the order to lay children out vertically and how to interpret start and end in the vertical direction. [...]
read / write
alwaysNeedsCompositing bool
Whether this render object always needs compositing. [...]
@protected, read-only, inherited
attached bool
Whether this node is in a tree whose root is attached to something. [...]
read-only, inherited
childCount int
The number of children.
read-only, inherited
constraints BoxConstraints
The box constraints most recently received from the parent.
read-only, inherited
debugCanParentUseSize bool
Whether the parent render object is permitted to use this render object's size. [...]
read-only, inherited
debugCreator ↔ dynamic
The object responsible for creating this render object. [...]
read / write, inherited
debugDoingThisLayout bool
Whether performLayout for this render object is currently running. [...]
read-only, inherited
debugDoingThisPaint bool
Whether paint for this render object is currently running. [...]
read-only, inherited
debugDoingThisResize bool
Whether performResize for this render object is currently running. [...]
read-only, inherited
debugLayer OffsetLayer
In debug mode, the compositing layer that this render object uses to repaint. [...]
read-only, inherited
debugNeedsLayout bool
Whether this render object's layout information is dirty. [...]
read-only, inherited
debugNeedsPaint bool
Whether this render object's paint information is dirty. [...]
read-only, inherited
debugSemantics SemanticsNode
The semantics of this render object. [...]
read-only, inherited
depth int
The depth of this node in the tree. [...]
read-only, inherited
firstChild RenderBox
The first child in the child list.
read-only, inherited
hashCode int
The hash code for this object. [...]
read-only, inherited
hasSize bool
Whether this render object has undergone layout and has a size.
read-only, inherited
isRepaintBoundary bool
Whether this render object repaints separately from its parent. [...]
read-only, inherited
lastChild RenderBox
The last child in the child list.
read-only, inherited
layer OffsetLayer
The compositing layer that this render object uses to repaint. [...]
read-only, inherited
needsCompositing bool
Whether we or one of our descendants has a compositing layer. [...]
read-only, inherited
owner PipelineOwner
The owner for this node (null if unattached). [...]
read-only, inherited
paintBounds Rect
Returns a rectangle that contains all the pixels painted by this box. [...]
read-only, inherited
parent AbstractNode
The parent of this node in the tree.
read-only, inherited
parentData ParentData
Data for use by the parent render object. [...]
read / write, inherited
runtimeType Type
A representation of the runtime type of the object.
read-only, inherited
semanticBounds Rect
The bounding box, in the local coordinate system, of this object, for accessibility purposes.
read-only, inherited
size Size
The size of this render box computed during layout. [...]
@protected, read / write, inherited
sizedByParent bool
Whether the constraints are the only input to the sizing algorithm (in particular, child nodes have no impact). [...]
@protected, read-only, inherited

Methods

computeDistanceToActualBaseline(TextBaseline baseline) double
Returns the distance from the y-coordinate of the position of the box to the y-coordinate of the first given baseline in the box's contents, if any, or null otherwise. [...]
computeMaxIntrinsicHeight(double width) double
Computes the value returned by getMaxIntrinsicHeight. Do not call this function directly, instead, call getMaxIntrinsicHeight. [...]
computeMaxIntrinsicWidth(double height) double
Computes the value returned by getMaxIntrinsicWidth. Do not call this function directly, instead, call getMaxIntrinsicWidth. [...]
computeMinIntrinsicHeight(double width) double
Computes the value returned by getMinIntrinsicHeight. Do not call this function directly, instead, call getMinIntrinsicHeight. [...]
computeMinIntrinsicWidth(double height) double
Computes the value returned by getMinIntrinsicWidth. Do not call this function directly, instead, call getMinIntrinsicWidth. [...]
debugFillProperties(DiagnosticPropertiesBuilder description) → void
describeApproximatePaintClip(RenderObject child) Rect
Returns a rect in this object's coordinate system that describes the approximate bounding box of the clip rect that would be applied to the given child during the paint phase, if any. [...]
hitTestChildren(HitTestResult result, { Offset position }) bool
Override this method to check whether any children are located at the given position. [...]
paint(PaintingContext context, Offset offset) → void
Paint this render object into the given context at the given offset. [...]
performLayout() → void
setupParentData(RenderBox child) → void
toStringShort() String
Returns a human understandable name.
add(RenderBox child) → void
Append child to the end of this render object's child list.
inherited
addAll(List<RenderBox> children) → void
Add all the children to the end of this render object's child list.
inherited
adoptChild(RenderObject child) → void
Called by subclasses when they decide a render object is a child. [...]
inherited
applyPaintTransform(RenderObject child, Matrix4 transform) → void
Multiply the transform from the parent's coordinate system to this box's coordinate system into the given transform. [...]
inherited
assembleSemanticsNode(SemanticsNode node, SemanticsConfiguration config, Iterable<SemanticsNode> children) → void
Assemble the SemanticsNode for this RenderObject. [...]
inherited
attach(PipelineOwner owner) → void
inherited
childAfter(RenderBox child) RenderBox
The next child after the given child in the child list.
inherited
childBefore(RenderBox child) RenderBox
The previous child before the given child in the child list.
inherited
clearSemantics() → void
Removes all semantics from this render object and its descendants. [...]
inherited
debugAdoptSize(Size value) Size
Claims ownership of the given Size. [...]
inherited
debugAssertDoesMeetConstraints() → void
Verify that the object's constraints are being met. Override this function in a subclass to verify that your state matches the constraints object. This function is only called in checked mode and only when needsLayout is false. If the constraints are not met, it should assert or throw an exception.
inherited
debugDescribeChildren() List<DiagnosticsNode>
inherited
debugHandleEvent(PointerEvent event, HitTestEntry entry) bool
Implements the debugPaintPointersEnabled debugging feature. [...]
inherited
debugPaint(PaintingContext context, Offset offset) → void
Override this method to paint debugging information.
inherited
debugPaintBaselines(PaintingContext context, Offset offset) → void
In debug mode, paints a line for each baseline. [...]
@protected, inherited
debugPaintPointers(PaintingContext context, Offset offset) → void
In debug mode, paints a rectangle if this render box has counted more pointer downs than pointer up events. [...]
@protected, inherited
debugPaintSize(PaintingContext context, Offset offset) → void
In debug mode, paints a border around this render box. [...]
@protected, inherited
debugRegisterRepaintBoundaryPaint({bool includedParent: true, bool includedChild: false }) → void
Called, in checked mode, if isRepaintBoundary is true, when either the this render object or its parent attempt to paint. [...]
inherited
debugResetSize() → void
If a subclass has a "size" (the state controlled by parentUsesSize, whatever it is in the subclass, e.g. the actual size property of RenderBox), and the subclass verifies that in checked mode this "size" property isn't used when debugCanParentUseSize isn't set, then that subclass should override debugResetSize to reapply the current values of debugCanParentUseSize to that state.
inherited
debugValidateChild(RenderObject child) bool
Checks whether the given render object has the correct runtimeType to be a child of this render object. [...]
inherited
defaultComputeDistanceToFirstActualBaseline(TextBaseline baseline) double
Returns the baseline of the first child with a baseline. [...]
inherited
defaultComputeDistanceToHighestActualBaseline(TextBaseline baseline) double
Returns the minimum baseline value among every child. [...]
inherited
defaultHitTestChildren(HitTestResult result, { Offset position }) bool
Performs a hit test on each child by walking the child list backwards. [...]
inherited
defaultPaint(PaintingContext context, Offset offset) → void
Paints each child by walking the child list forwards. [...]
inherited
describeSemanticsConfiguration(SemanticsConfiguration config) → void
Report the semantics of this node, for example for accessibility purposes. [...]
@protected, inherited
detach() → void
Mark this node as detached. [...]
inherited
dropChild(RenderObject child) → void
Called by subclasses when they decide a render object is no longer a child. [...]
inherited
getChildrenAsList() List<RenderBox>
Returns a list containing the children of this render object. [...]
inherited
getDistanceToActualBaseline(TextBaseline baseline) double
Calls computeDistanceToActualBaseline and caches the result. [...]
@mustCallSuper, @protected, inherited
getDistanceToBaseline(TextBaseline baseline, { bool onlyReal: false }) double
Returns the distance from the y-coordinate of the position of the box to the y-coordinate of the first given baseline in the box's contents. [...]
inherited
getMaxIntrinsicHeight(double width) double
Returns the smallest height beyond which increasing the height never decreases the preferred width. The preferred width is the value that would be returned by getMinIntrinsicWidth for that height. [...]
@mustCallSuper, inherited
getMaxIntrinsicWidth(double height) double
Returns the smallest width beyond which increasing the width never decreases the preferred height. The preferred height is the value that would be returned by getMinIntrinsicHeight for that width. [...]
@mustCallSuper, inherited
getMinIntrinsicHeight(double width) double
Returns the minimum height that this box could be without failing to correctly paint its contents within itself, without clipping. [...]
@mustCallSuper, inherited
getMinIntrinsicWidth(double height) double
Returns the minimum width that this box could be without failing to correctly paint its contents within itself, without clipping. [...]
@mustCallSuper, inherited
getTransformTo(RenderObject ancestor) Matrix4
Applies the paint transform up the tree to ancestor. [...]
inherited
globalToLocal(Offset point, { RenderObject ancestor }) Offset
Convert the given point from the global coordinate system in logical pixels to the local coordinate system for this box. [...]
inherited
handleEvent(PointerEvent event, HitTestEntry entry) → void
Override this method to handle pointer events that hit this render object. [...]
inherited
hitTest(HitTestResult result, { Offset position }) bool
Determines the set of render objects located at the given position. [...]
inherited
hitTestSelf(Offset position) bool
Override this method if this render object can be hit even if its children were not hit. [...]
@protected, inherited
insert(RenderBox child, { RenderBox after }) → void
Insert child into this render object's child list after the given child. [...]
inherited
invokeLayoutCallback<T extends Constraints>(LayoutCallback<T> callback) → void
Allows mutations to be made to this object's child list (and any descendants) as well as to any other dirty nodes in the render tree owned by the same PipelineOwner as this object. The callback argument is invoked synchronously, and the mutations are allowed only during that callback's execution. [...]
@protected, inherited
layout(Constraints constraints, { bool parentUsesSize: false }) → void
Compute the layout for this render object. [...]
inherited
localToGlobal(Offset point, { RenderObject ancestor }) Offset
Convert the given point from the local coordinate system for this box to the global coordinate system in logical pixels. [...]
inherited
markNeedsCompositingBitsUpdate() → void
Mark the compositing state for this render object as dirty. [...]
inherited
markNeedsLayout() → void
Mark this render object's layout information as dirty, and either register this object with its PipelineOwner, or defer to the parent, depending on whether this object is a relayout boundary or not respectively. [...]
inherited
markNeedsLayoutForSizedByParentChange() → void
Mark this render object's layout information as dirty (like markNeedsLayout), and additionally also handle any necessary work to handle the case where sizedByParent has changed value. [...]
inherited
markNeedsPaint() → void
Mark this render object as having changed its visual appearance. [...]
inherited
markNeedsSemanticsUpdate() → void
Mark this node as needing an update to its semantics description. [...]
inherited
markParentNeedsLayout() → void
Mark this render object's layout information as dirty, and then defer to the parent. [...]
@protected, inherited
move(RenderBox child, { RenderBox after }) → void
Move this child in the child list to be before the given child. [...]
inherited
noSuchMethod(Invocation invocation) → dynamic
Invoked when a non-existent method or property is accessed. [...]
inherited
paintOverflowIndicator(PaintingContext context, Offset offset, Rect containerRect, Rect childRect, { String overflowHints }) → void
To be called when the overflow indicators should be painted. [...]
inherited
performResize() → void
Updates the render objects size using only the constraints. [...]
inherited
reassemble() → void
Cause the entire subtree rooted at the given RenderObject to be marked dirty for layout, paint, etc. This is called by the RendererBinding in response to the ext.flutter.reassemble hook, which is used by development tools when the application code has changed, to cause the widget tree to pick up any changed implementations. [...]
inherited
redepthChild(AbstractNode child) → void
Adjust the depth of the given child to be greater than this node's own depth. [...]
@protected, inherited
redepthChildren() → void
Adjust the depth of this node's children, if any. [...]
inherited
remove(RenderBox child) → void
Remove this child from the child list. [...]
inherited
removeAll() → void
Remove all their children from this render object's child list. [...]
inherited
replaceRootLayer(OffsetLayer rootLayer) → void
Replace the layer. This is only valid for the root of a render object subtree (whatever object scheduleInitialPaint was called on). [...]
inherited
rotate({int oldAngle, int newAngle, Duration time }) → void
Rotate this render object (not yet implemented).
inherited
scheduleInitialLayout() → void
Bootstrap the rendering pipeline by scheduling the very first layout. [...]
inherited
scheduleInitialPaint(ContainerLayer rootLayer) → void
Bootstrap the rendering pipeline by scheduling the very first paint. [...]
inherited
scheduleInitialSemantics() → void
Bootstrap the semantics reporting mechanism by marking this node as needing a semantics update. [...]
inherited
showOnScreen([RenderObject child ]) → void
Attempt to make this or a descendant RenderObject visible on screen. [...]
inherited
toDiagnosticsNode({String name, DiagnosticsTreeStyle style }) DiagnosticsNode
inherited
toString({DiagnosticLevel minLevel }) String
inherited
toStringDeep({String prefixLineOne: '', String prefixOtherLines: '', DiagnosticLevel minLevel: DiagnosticLevel.debug }) String
Returns a description of the tree rooted at this node. If the prefix argument is provided, then every line in the output will be prefixed by that string.
inherited
toStringShallow({String joiner: '; ', DiagnosticLevel minLevel: DiagnosticLevel.debug }) String
Returns a one-line detailed description of the render object. This description is often somewhat long. [...]
inherited
visitChildren(RenderObjectVisitor visitor) → void
Calls visitor for each immediate child of this render object. [...]
inherited
visitChildrenForSemantics(RenderObjectVisitor visitor) → void
Called when collecting the semantics of this node. [...]
inherited

Operators

operator ==(other) bool
The equality operator. [...]
inherited