Awesome UX With A Better MultiChildLayout

We are going to get into how the Layout system works internally, so we can understand how to make complex UI components.

The Multi Child Layout Algorithm

Flutter’s multi-child layout algorithm is used when the constructor of a Flex is called, and the Flex is what we use as a basis for Rows and Columns. One of the things you have to pass into a Flex is the direction parameter, which takes an enum called Axis, and Axis can be vertical or horizontal.

‍If you use a Column, the constructor for the Column is going to take all the parameters you gave it and then call the constructor of a Flex, after adding the direction parameter axis.vertical.

Does Flex’s super-class use the algorithm?

No. The super-class of the Flex is the abstract class, MultiChildRenderObjectWidget. The Flex is not the only class that extends it. MultiChildRenderObjectWidget is also the super-class for Stack, which uses a completely different process for its layout.

In short, we have flex things such as Row and Column, but it’s Flex the super-class and the way the build performs multi-child layout builds that together make it flexible. And that multi-child layout algorithm performed by the build is: