Alinhe Dentro de uma Caixa

Parte da seção Layouts que se adaptam do Journey de Flutter da Coddy. Lição 12 de 30.

Center posiciona seu filho no meio do espaço que ocupa. Align faz o mesmo em qualquer ponto que você escolher:

Container(
  height: 200,
  color: Colors.teal,
  child: const Align(
    alignment: Alignment.topRight,
    child: Text('Top right'),
  ),
)

Os pontos recebem nomes com base nos cantos e nas bordas: Alignment.topLeft, topCenter, topRight, centerLeft, center, centerRight, bottomLeft, bottomCenter e bottomRight. Center é Align com Alignment.center.

Um Stack também aceita um alignment:, que posiciona todos os filhos que não são Positioned: Stack(alignment: Alignment.bottomCenter, children: [...]).

Desafio

Fácil

Mova a legenda Mountains do meio da capa para o canto inferior esquerdo. O espaçamento interno a mantém a 16 pixels de ambas as bordas.

Experimente você mesmo

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(title: const Text('Travel')),
        body: Column(
          children: [
            Container(
              height: 240,
              color: Colors.indigo,
              child: const Center(
                child: Padding(
                  padding: EdgeInsets.all(16),
                  child: Text(
                    'Mountains',
                    style: TextStyle(fontSize: 28, color: Colors.white),
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}