There may be times when you are unsure about which widget to employ, particularly the Box widgets, which are part of the layout widgets group. In this tutorial, we will learn about the differences and practical applications of each Box Widget.
1. ConstrainedBox
When the specified values bind the widget’s child, you can add its height and width flexibility. Its parent determines ConstrainedBox’s size. It would be best if you first constructed a ConstraintsBox before you can use ConstrainedBox. ConstraintsBox allows you to specify a widget’s minimum and maximum width and height.
2. UnconstrainedBox
It does not impose any restrictions on its kid, enabling it to render at its “natural” size. It generates the youngster as if they were alone on an unlimited canvas with no constraints.
3. OverflowBox
OverflowBox puts different limitations on its offspring than it receives from its parent, allowing it to overflow. Although OverflowBox and UncosntrainedBox are similar, the former does not warn if the kid does not fill the space.
4. LimitedBox
When the child’s size is unconstrained, LimitedBox allows it to be specified. This box is handy for assembling widgets that generally try to match the size of their parents to function appropriately in lists. When you have any child inside the scrollable widget, and its size is not defined, you can use LimitedBox. The LimitedBox varies from the ConstrainedBox in that it limits only when the restrictions are limitless.
5. FittedBox
This box will enlarge its child until it is filled. You can use it, for example, when you want to depict a child inside a parent, and exhibiting the entire child is more essential to you (even if it is scaled down) than the child being clipped off.
6. SizedBox
This is a box of a certain size. SizedBox cannot be used to set color or decoration, but it may be used to resize the widget supplied as a child. If a child is provided, this widget requires that child to have a certain width or height (assuming these values are allowed by this widget’s parent). If width or height are both null, this widget will resize to match the child’s size in that dimension.
