Flutter For Dummies

Chapter 6

Laying Things Out

IN THIS CHAPTER

Putting widgets where you want them

Dealing with common layout problems

Working with various screen sizes

According to folklore, the size of a fish tank determines the sizes of the goldfish in the tank. A goldfish in a small tank can be only one or two inches long, but the same goldfish in a larger tank grows to be ten inches long. It’s as if a fish’s cells sense the boundaries of the fish’s living space, and the cells stop growing when they feel that doing so would be impractical.

Several online resources say that the tank size phenomenon is a myth, but that doesn’t stop me from comparing it with Flutter layouts. (Nothing stops me from making comparisons with Flutter layouts.)

In a Flutter layout, widgets are nested inside of other widgets. The outer widget sends a constraint to the inner widget:

“You can be as wide as you want, as long as your width is between 0 and 400 density-independent pixels.”

Later on, the inner widget sends its exact height to the outer widget:

“I’m 200 density-independent pixels wide.”

The outer widget uses that information to position the inner widget:

“Because you’re 200 density-independent pixels wide, ...