🍱 Cap 06: Layouts Básicos

🎯 Objetivo da Aula: Aprender a alinhar e organizar elementos na tela usando Row (Linha) e Column (Coluna).


🏢 O Cenário Prático (Seu Desafio): Você precisa criar o painel de controle do jogo com 3 botões alinhados na horizontal e um placar no topo. Seu desafio é usar Row e Column para isso!


📖 Exemplo Passo a Passo

import 'package:flutter/material.dart';
 
class PainelControle extends StatelessWidget {
  const PainelControle({super.key});
 
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        const Text('PLACAR: 1000'),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            ElevatedButton(onPressed: () {}, child: const Text('Atacar')),
            ElevatedButton(onPressed: () {}, child: const Text('Pular')),
            ElevatedButton(onPressed: () {}, child: const Text('Correr')),
          ],
        ),
      ],
    );
  }
}

🛠️ Prática Obrigatória 1: Adicione mais um botão na linha e mude o alinhamento para MainAxisAlignment.spaceBetween.


Capitulo Anterior | Proximo Capitulo