🧩 Exercícios - Cap 07: Perfil de Jogador (Compose UI)

📖 Ver Cap 07

🎯 Antes de começar

No Cap 07 você criou o projeto AppPokedexMestre_SeuNome e montou as primeiras telas com @Composable, usando Column para empilhar Text e Button (funções PerfilJogador e StatusHub). Depois de completar as Práticas Obrigatórias 1 e 2, faça o exercício extra abaixo para conhecer o Row — o “irmão horizontal” do Column.

💪 Exercício Extra 1: Painel Lado a Lado com Row (15 min)

Objetivo: Praticar Row (organização horizontal) e Spacer (espaçamento), reforçando a sintaxe PascalCase de funções @Composable.

Passos:

  1. Crie uma nova função @Composable fun InfoExtra() { ... } (PascalCase!).
  2. Dentro dela, use Row { ... } (em vez de Column) para colocar dois Text lado a lado: "❤️ HP: 100" e "⭐ XP: 0".
  3. Entre os dois Text, adicione Spacer(modifier = Modifier.width(16.dp)) para criar um espaçamento horizontal.
  4. Dentro do Column de PerfilJogador (ou StatusHub), chame InfoExtra() depois do Button, para vê-la na Preview.
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.width
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

@Composable
fun InfoExtra() {
    Row {
        Text(text = "❤️ HP: 100")
        Spacer(modifier = Modifier.width(16.dp))
        Text(text = "⭐ XP: 0")
    }
}

✅ Resultado Esperado

🆘 Resolução de Problemas Comuns

Erro Causa Solução
Unresolved reference: Row / Spacer / dp Faltam os import correspondentes no topo do arquivo .kt Adicione os 5 imports listados no exemplo acima — o Android Studio também sugere o import automático com Alt+Enter
A Preview não atualiza depois de editar o código A Preview do Compose às vezes não recompila automaticamente Clique no ícone 🔨 Build & Refresh acima da Preview, ou use o atalho Ctrl+F9
InfoExtra() não aparece na tela A função foi criada, mas nunca foi chamada dentro de outra função @Composable exibida na Preview Confirme que adicionou a chamada InfoExtra() dentro do Column de PerfilJogador (ou StatusHub)

⬅️ Voltar para Exercícios