noloman
noloman

Reputation: 11975

Android: header in a ListView

I would like to have a header on top of a ListView, but in a way that if the user scrolls down the ListView, the header is ALWAYS stack to the top of the view (right below of the Action Bar).

I created a RelativeLayout where I include my LinearLayout with the header and below it, the ListView, but still when the ListView is scrolled down, the header disappears. I also tried with addHeaderView but no luck yet.

Can anybody throw some light here?

EDIT: My layouts are this:

<include
    android:id="@+id/IncludeFiltersZoekAndBoek"
    android:layout_above="@+id/AcommodatiesListView"
    layout="@layout/filters_header_layout" />

<ListView
    android:id="@+id/AcommodatiesListView"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_above="@+id/LoadMoreAccommodaties"
    android:layout_alignParentTop="true"
    android:scrollingCache="false" >

</ListView>

<Button
    android:id="@+id/LoadMoreAccommodaties"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:text="Laad meer resultaten..."
    android:visibility="gone" />

and for the header:

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:text="Populariteit" />

    <ImageButton
        android:layout_width="15dip"
        android:layout_height="15dip"
        android:src="@drawable/triangle" />

    <ImageButton
        android:layout_width="15dip"
        android:layout_height="15dip"
        android:src="@drawable/triangle" />
</LinearLayout>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:text="Prijs" />

    <ImageButton
        android:layout_width="15dip"
        android:layout_height="15dip"
        android:src="@drawable/triangle" />

    <ImageButton
        android:layout_width="15dip"
        android:layout_height="15dip"
        android:src="@drawable/triangle" />
</LinearLayout>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:text="Rating" />
</LinearLayout>

Now, it seems ok, the only problem is that the ListView is below the header, and when scrolling down, you can see the header on top of the items of the ListView.

Upvotes: 1

Views: 2574

Answers (3)

Dhruvil Patel
Dhruvil Patel

Reputation: 2930

You have to set header weight and then see the result. :)

Upvotes: 0

Anu
Anu

Reputation: 562

you need something like this:

  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/darker_gray"
android:orientation="vertical" >

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/white" >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="THIS IS A HEADER"
        android:textColor="@android:color/black"
        android:textSize="20sp"
        android:typeface="serif" />
</LinearLayout>

<ListView
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" 
    android:scrollingCache="false"
    >
</ListView>

</LinearLayout>

Upvotes: 0

waqaslam
waqaslam

Reputation: 68187

With your requirements, you dont actually need to set header view for your ListView, because headers are scrollable together with the other contents of list.

In your case, simply add that view on top (above) of your ListView which should act as its header. By then it will stay there even if you scroll the list.

Upvotes: 5

Related Questions