Search code examples
androidandroid-layoutheadersticky-footer

How to make header and sticky footer in layout xml android


I was trying to use relative layout but the header becomes in front of the text. So all was going to wrong direction. My app screen looks like: image

I would like to add also footer but every time I try it fails. Im pretty sure that all widths and heights are okay in my xml layout.

Here is my xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/main"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/header"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" >

        <TextView
            android:id="@+id/item1"
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight=".25"
            android:height="30dip"
            android:text="@string/item1" />

        <TextView
            android:id="@+id/item2"
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight=".25"
            android:height="30dip"
            android:text="@string/item2" />

        <TextView
            android:id="@+id/item3"
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight=".25"
            android:height="30dip"
            android:text="@string/item3" />

        <TextView
            android:id="@+id/item4"
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight=".25"
            android:height="30dip"
            android:text="@string/item4" />
    </LinearLayout>

    <!-- List Divider -->

    <View
        android:layout_width="fill_parent"
        android:layout_height="1dip"
        android:background="?android:attr/listDivider" />

    <!-- ListView (grid_items) -->

    <LinearLayout
        android:id="@+id/layout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" >

        <ListView
            android:id="@+id/listview"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" >
         </ListView>

    </LinearLayout>

</LinearLayout>

Please give me any suggestion. I think that relative layout would be great idea but I do not know much about it yet.


Solution

  • 1/ Use a RelativeLayout for 'main'.

    2/ Add the attribute android:layout_alignParentTop="true" to 'header'.

    3/ Remove the LinearLayout with id 'layout', it's not needed.

    4/ Add your footer to the end of the XML. When specifying its id, use @id not @+id. Give it an attribute android:layout_alignParentBottom="true".

    5/ Add the following attributes to the ListView:

    android:layout_below="@id/header"
    android:layout_above="@+id/the_id_you_give_the_footer"