🚀 3.3 TableLayout

Para telas de cadastro que exigem alinhamento rigoroso entre rótulos e campos, o TableLayout é uma excelente ferramenta. Ele organiza os componentes em linhas (TableRow) e colunas, similar às tabelas HTML.

Criando a Tela de Nova Viagem

Utilizaremos o TableLayout dentro de uma ScrollView para garantir que o formulário seja acessível em telas menores:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
 
    <TableLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:stretchColumns="1"
        android:padding="16dp">
 
        <TableRow>
            <TextView android:text="Destino:" style="@style/LabelItem" />
            <EditText 
                android:id="@+id/editDestino" 
                android:inputType="text" />
        </TableRow>
 
        <TableRow android:layout_marginTop="8dp">
            <TextView android:text="Orçamento:" style="@style/LabelItem" />
            <EditText 
                android:id="@+id/editOrcamento" 
                android:inputType="numberDecimal" />
        </TableRow>
 
        <Button
            android:id="@+id/btnSalvar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="24dp"
            android:text="Salvar Viagem" />
 
    </TableLayout>
</ScrollView>

Na DashboardActivity, agora utilizamos o ID da View de forma moderna. Note que, no Android Studio 2023.1, os IDs de recursos podem não ser constantes finais, recomendando-se o uso de if-else ou setOnClickListener individuais para cada componente do binding:

// DashboardActivity.java
binding.cardNovaViagem.setOnClickListener(v -> {
    var intent = new Intent(this, ViagemActivity.class);
    startActivity(intent);
});
 
binding.cardNovoGasto.setOnClickListener(v -> {
    var intent = new Intent(this, GastoActivity.class);
    startActivity(intent);
});

TIP

O atributo android:stretchColumns="1" no TableLayout faz com que a segunda coluna (índice 1) se expanda para ocupar todo o espaço horizontal restante, garantindo que os campos de entrada fiquem alinhados à direita.

IMPORTANT

Para formulários muito complexos ou dinâmicos, considere o uso do ConstraintLayout. Ele oferece maior flexibilidade de posicionamento e melhor performance ao evitar o aninhamento profundo de layouts.


⬅️ Capítulo Anterior | Próximo Capítulo ➡️