Capítulo 46 — Los layouts: Row, Column, Stack y las restricciones

Nivel: principiante / intermedio Duración estimada: 10 h Requisitos previos: capítulo 45 — StatelessWidget y StatefulWidget Lo que sabrás hacer al terminar: colocar cualquier widget exactamente donde quieras en la pantalla, comprender y corregir los errores de maquetación de Flutter, y reproducir una maqueta completa sin tantear.

46.0 — Objetivos del capítulo

Al terminar este capítulo, serás capaz de:

• enunciar la regla de maquetación de Flutter en una frase;
• explicar qué es una restricción y por qué desciende por el árbol;
• usar Container conociendo sus trampas;
• escribir un EdgeInsets en sus cuatro formas;
• decorar una caja con BoxDecoration: color, borde, esquinas redondeadas, sombra;
• elegir entre Padding, SizedBox, Center y Align;
• apilar widgets verticalmente con Column;
• alinear widgets horizontalmente con Row;
• distinguir el eje principal y el eje transversal;
• usar los seis valores de MainAxisAlignment;
• usar los valores de CrossAxisAlignment;
• configurar mainAxisSize y saber por qué;
• leer un error RenderFlex overflowed y corregirlo de tres maneras distintas;
• repartir el espacio con Expanded, Flexible y Spacer;
• explicar la diferencia exacta entre Expanded y Flexible;
• pasar a la línea siguiente automáticamente con Wrap;
• superponer widgets con Stack y colocarlos con Positioned;
• mantener varias páginas en memoria con IndexedStack;
• imponer una relación de aspecto entre ancho y alto con AspectRatio;
• dimensionar en porcentaje con FractionallySizedBox;
• forzar restricciones con ConstrainedBox y BoxConstraints;
• comprender el coste de IntrinsicHeight;
• hacer que una página se desplace con SingleChildScrollView;
• evitar el notch y la barra del sistema con SafeArea;
• depurar visualmente una maquetación;
• reconstruir una maqueta de arriba abajo con un método reproducible.