27 Mai, 2011 11:16

Como criar cabeçalho e rodapé no Android

Após algumas pesquisas na Internet (obrigada Google!), encontrei o truque que precisava para posicionar corretamente meu rodapé na tela. Como acredito que muitos precisarão fazer uma tela parecida, decidi compartilhar com vocês a solução.

Segue, abaixo, o código main.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:gravity="center_horizontal"
android:layout_height="fill_parent" android:layout_width="fill_parent">

<LinearLayout android:layout_width="fill_parent"
    android:layout_height="wrap_content" android:background="#550000"
    android:id="@+id/cabecalho" android:orientation="horizontal"
    android:padding="10dip">
    <TextView android:textColor="#FFFFFF" android:layout_height="wrap_content"
        android:layout_alignParentBottom="true" android:layout_width="fill_parent"
        android:gravity="center_horizontal" android:id="@+id/texto1"
        android:text="Aqui fica o cabeçalho" />
</LinearLayout>

<LinearLayout android:layout_width="fill_parent"
    android:layout_alignParentBottom="true" android:gravity="center_vertical"
    android:background="#005500" android:layout_height="wrap_content"
    android:id="@+id/rodape" android:padding="10dip">
    <TextView android:textColor="#FFFFFF" android:layout_height="wrap_content"
        android:layout_width="fill_parent" android:gravity="center_horizontal"
        android:id="@+id/texto2" android:text="Aqui fica o rodapé" />
</LinearLayout>

<ListView android:id="@android:id/list" android:layout_width="fill_parent"
    android:layout_height="wrap_content" android:layout_above="@id/rodape"
    android:layout_below="@id/cabecalho" android:background="#000055" />

<TextView android:id="@android:id/empty" android:layout_width="wrap_content"
    android:layout_height="wrap_content" android:layout_above="@id/rodape" 
                                       android:text="Lista vazia" />
</RelativeLayout>

Como vocês podem observar, o truque está em usar o RelativeLayout e incluir a ListView abaixo do cabeçalho e do rodapé no arquivo xml. Além disso, é preciso informar para a lista que ela será posicionada relativamente a ambos.

Dica: nesse exemplo, coloquei um TextView com android:id="@android:id/empty" para que apareça uma mensagem quando não há nada na lista. Isso é bem legal e um adianto!

Segue o código da Activity:

public class TestActivity extends ListActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        String[] paises = getResources().getStringArray(R.array.paises_array);
        setListAdapter(new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, paises));
    }
}

Após rodar o exemplo, a tela ficará da seguinte maneira:

Exemplo Cabeçalho/Rodapé

Espero que seja útil! Até :)

Ao navegar neste site, você consente o uso de cookies nossos e de terceiros, que coletam informações anônimas e são essenciais para melhorar sua experiência em nosso site.