Widget: Align


Um widget que alinha seu child dentro de si e, opcionalmente, dimensiona-se com base no tamanho do children.

Conseguir unir widgets é uma das funcionalidades mais poderosas do Flutter. Mas como especificar a forma como um filho é estruturado ou posicionado dentro do pai?

Por exemplo, se tem um widget Container, como escolher como um widget Text aparece dentro dele? O caso mais simples é centrá-lo usando o widget Center.

Container(
child: Center(
child: Text("Olá"),
),
);


Mas e se quiser colocá-lo no canto inferior direito, por exemplo? É aí que o widget Align é útil.

Container(
child: Align(
alignment: Alignment.bottomRight,
child: Text("Olá"),
),
);

O Align permite colocar widgets em uma área definida do widget pai, tais como bottomRighttopLeft ou centerRight, onde quiser.

Também pode especificar os valores de alinhamento, onde -1 a 1 é o intervalo tanto da esquerda à direita quanto do topo ao fundo.

Isto permite estruturar a posição exata do widget filho dentro do pai.

Container(
child: Align(
alignment: Alignment(1.0, 0.5),
child: Text("Olá"),
),
);

Também se pode usar Align para posicionar widgets em uma pilha.

Stack(children: [
Container(
child: Align(
alignment: Alignment.bottomRight,
child: Text("Olá"),
),
),
]);

 

291 Visualizações
Awesome Flutter