How to put a button in between a sticky 'header' and a Listview in Android

Question

My goal is to have a sticky header, a clear button, and then a ListView (in that order).

+-----------------+  
|      Header     |    (Sticky)
+-----------------+
| "Clear" button  |    (NOT sticky)
+-----------------+
|    ListView     |    (Also NOT sticky)
|                 |
|                 |
|                 |
|                 |
|                 |
|                 |
+-----------------+

This following approach almost does what I want. The header is sticky, and the ListView functions correctly. But the button is sticky (it tags along right below the sticky header).

<RelativeLayout>

    <!-- Used for Sticky Header -->
    <RelativeLayout
    android:id="@+id/top_control_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?attr/actionBarSize">

        <Button/>

        <TextView/>
    </RelativeLayout>   <!-- End XML for sticky hader -->

    <!--  Button to clear bookmarks  -->
    <Button
        android:id="@+id/clearButton"
        android:text="CLEAR"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_below="@+id/top_control_bar"
        android:onClick="clearBookmarks"/> 

    <!--  ListView for displaying questions  -->
    <ListView
        android:id="@+id/listViewBrowse"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/clearButton" >
    </ListView>

</RelativeLayout>

I think I need to stop using this property

    android:layout_below="@+id/top_control_bar"

for the "clear" button. But it doesn't work if I just get rid of it (the button overlays the header if I do that). What should I adjust? Or what should I try instead of this approach?

* **SOLUTION ***

Following these steps solved my problem:

Create a new layout file: non_sticky_header.xml (which contains my clear button).
Remove Clear button from the main layout.
Dynamically create a View object by inflating my 'non_sticky_header' resource file. This View object is the header.
Add header object to my ListView, with addHeaderView().

Code for Steps 3 and 4:

View header = getLayoutInflater().inflate(R.layout.non_sticky_header, null);  
list.addHeaderView(header);

Sources
-See third answer to this post from @nDroidDev; my solution varies slightly with steps 3 and 4.
-(See this S.O. Post about using addHeaderView(), which explains steps 3 and 4 (from @user370305).

you can make your button part of the list view as first item in list. — Manish, May 08 '15 at 08:39
Why not add the 'clear button' as a header view to the `ListView`? Refer to the [`addHeaderView(...)`](https://developer.android.com/reference/android/widget/ListView.html#addHeaderView%28android.view.View%29) methods. — MH., May 08 '15 at 08:41
I'm using a custom list view (using a ArrayAdapter ). Can I still make my button the first item in the list? — Timothy Steele, May 08 '15 at 08:42
Comments are right, the ONLY option for achieving your goal is to make Button part of listView(as header or first item) — Nik Myers, May 08 '15 at 08:50

score 0 · Answer 1 · answered May 08 '15 at 08:45

I agree with @Manish . Assume button as first item of the list (position = 0). You can handle its action with above code:

listView.setOnItemClickListener(new OnItemClickListener() {
        public void onItemClick(AdapterView<?> parent, View view,
                int position, long id) {

            if (position == 0) {
             clearAllListMethod();
           }
        }
    });

Also you can easily in adapter set its visibility. Hope it helps.

score 0 · Accepted Answer · answered May 08 '15 at 08:50

I think , instead to add ing the clear button into the Realtive layout, you should add it in your listview's header like this..

1) Create a new layout file say non_sticky_header.xml and add the following lines..

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

<!--  Button to clear bookmarks  -->
<Button
        android:id="@+id/clearButton"
        android:text="CLEAR"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_below="@+id/top_control_bar"
        android:onClick="clearBookmarks"/> 

</RelativeLayout>

2) Now remove this clear button from your main layout and update it like this... Just keep the stick headre and listview in your main layout..

<RelativeLayout>

    <!-- Used for Sticky Header -->
    <RelativeLayout
    android:id="@+id/top_control_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?attr/actionBarSize">

        <Button/>

        <TextView/>
    </RelativeLayout>   <!-- End XML for sticky hader -->

    <!--  ListView for displaying questions  -->
    <ListView
        android:id="@+id/listViewBrowse"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/clearButton" >
    </ListView>

</RelativeLayout>

3) At last, Add the non_sticky_header.xml as header of the list in you java file, like this...

 //code to add header and footer to listview
        LayoutInflater inflater = getLayoutInflater();
        ViewGroup header = (ViewGroup) inflater.inflate(R.layout.non_sticky_header, listView, false);
        listView.addHeaderView(header, null, false);

Hope it helps... :)

When I do this, the app compiles but then crashes with a NullPointerException at this line of code: 'list view.addHeaderView (header, null, false)'. I'm trying to figure out why. — Timothy Steele, May 08 '15 at 22:50
[This source](http://stackoverflow.com/questions/7838921/android-listview-addheaderview-nullpointerexception-for-predefined-views-defin/7839013#7839013) helped me find the cause of the NullPointerException — Timothy Steele, May 09 '15 at 04:14

score 0 · Answer 3 · edited Sep 20 '17 at 06:58

0

Add Button as header of ListView.

Like:

Button headerButton = (Button) getLayoutInflater().inflate(R.layout.header_button, null);
mListView.addHeader(headerButton);

But add header before adding adapter.

edited Sep 20 '17 at 06:58

Satan Pandeya

3,747
4
27
53

answered May 08 '15 at 08:55

SINIGAMI

81
1
2

I understand that you're creating a button and adding it as a header. Why is it that when you instantiate the button you reference 'getLayoutInflater().inflate(R.layout.header_button, null);' ? – Timothy Steele May 08 '15 at 08:59
Did you mean something like 'final Button button = (Button) findViewById(R.id.button_id);' as seen in [http://developer.android.com/reference/android/widget/Button.html] (this android tutorial)? – Timothy Steele May 08 '15 at 09:06
I mean you need to create another layout which have only button and inflate it, or create button programmatically. You can't get button from the same layout where you have ListView. – SINIGAMI May 09 '15 at 18:08

How to put a button in between a sticky 'header' and a Listview in Android

3 Answers3