15

I'm sure that I'm missing something simple to get this implemented, but have run through every known combination I can come up with to get what I'm looking to do working. I'm trying to have a ListView footer sit at the bottom of the screen when the ListView items do not fill the page.

For example, I have a page with a ListView of three items and a FooterView (using the ListView's addFooterView) I want that footerView to sit at the bottom of the screen. When the ListView contains enough items to scroll the screen, the footerView should sit at the end of the list (not at the bottom of the screen).

The XML I'm trying to use is listed below. Any and all help is much appreciated!

Layout.xml

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@+drawable/background">
<ListView
    android:id="@+id/menu" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"
    android:listSelector="@android:color/transparent"
    android:divider="@null">
</ListView></RelativeLayout>

ListViewRow.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
style="@style/Nationwide.menu">
<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/nav_item"
    style="@style/Nationwide.menu.row">
    <ImageView 
        android:id="@+id/image_icon"
        style="@style/Nationwide.menu.leftIcon" />
    <TextView 
        android:id="@+id/nav_text" 
        style="@style/Nationwide.menu.text" />
    <ImageView
        android:id="@+id/chevron_symbol"
        style="@style/Nationwide.menu.rightIcon" />
</LinearLayout>
<View
    android:layout_height="1dp"
    android:background="@drawable/nav_item_divider_dark" />
<View
    android:layout_height="1dp"
    android:background="@drawable/nav_item_divider_light" /></LinearLayout>

ListViewFooter.xml

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/footer"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentBottom="true">
<View 
    android:id="@+id/footer_image"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_alignParentBottom="true" /></RelativeLayout>

Java

    LayoutInflater inflater = this.getLayoutInflater();
    View footerView = inflater.inflate(R.layout.footer, null);

    footerView.findViewById(R.id.footer_image).setBackgroundDrawable(resources.getDrawable(R.drawable.cone_footer));

    mMenuListView.addFooterView(footerView);

The things I've tried so far include:

  • Adding the footer view as a shown above
  • Adding the drawable resource as a background on the ListView (This caused the ListView to not span the entire width of the screen and scroll in an odd manner due to the 9-Patch stretchable regions)
  • Adding the cone_footer as a separate view in the Layout

Thanks in advance!

George Walters II
  • 6,109
  • 2
  • 18
  • 10
  • I apologize, but I didn't add in quite enough Java code. After I add the footerView to the listView, this code is run. mMenuListView.setAdapter(panel); – George Walters II Jun 22 '10 at 14:12

5 Answers5

16

I want that footerView to sit at the bottom of the screen.

That is not how addFooterView() works.

When the ListView contains enough items to scroll the screen, the footerView should sit at the end of the list (not at the bottom of the screen).

That too is not how addFooterView() works.

If you want it to scroll with the list (i.e., if the three list items take up the top half of the screen, the footer is right below the three items), then use addFooterView()...but then the footer always scrolls with the list.

If you want it to not scroll with the list, one approach is to use a RelativeLayout as your parent, anchor your footer to the bottom of the screen, and have the ListView sit in between the top and the footer...but then the footer never scrolls.

CommonsWare
  • 986,068
  • 189
  • 2,389
  • 2,491
  • Ah, so there is no way to anchor a view conditionally to the bottom of a screen if the contents do not fill the screen and scroll otherwise? Back to the designers we go... Awesome. Thanks for the reply. – George Walters II Jun 22 '10 at 14:30
  • 2
    Now that I read through this again, I must not have been clear as to what the designers want. They want the footer to scroll with this list with a caveat: If the list (footer included) is smaller than the screen, force the footer to align to the bottom of the screen. Otherwise, just show it after the last listView row. – George Walters II Jun 22 '10 at 14:32
  • @George Walters II: There is nothing built into Android that can achieve that look simply. As tlayton suggests, there may be a way to achieve a similar look, but with great difficulty, and possibly at the cost of UX (e.g., no longer navigable by D-pad). – CommonsWare Jun 22 '10 at 14:51
  • How to make it for navigation drawer? – Akshay Jun 20 '16 at 06:48
3

In case others are looking for a similar answer, here is what I ended up doing to solve the issue I had. Since the "Footer" I was looking to add was merely just an image to fill some space in the screen (for when views were short), and the ListView approach wasn't really what I needed for my implementation, we ended up with this as our XML layout:

    <?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res/com.example.android.apis"
    style="@style/company.mainContainer">

    <LinearLayout 
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical">
        <!-- enter page content here -->

        <View android:layout_height="0px" android:layout_weight="1"
            android:visibility="invisible" />

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|right"
            android:scaleType="fitXY"
            android:src="@drawable/footer_cone">
        </ImageView>

    </LinearLayout>

</ScrollView>

Hope this helps others!

George Walters II
  • 6,109
  • 2
  • 18
  • 10
1

Same Like this

<RelativeLayout>
    <include android:id="@+id/header" layout="@layout/header" android:layout_width="fill_parent" android:layout_alignParentTop="true" />

    <include android:id="@+id/footer" layout="@layout/footer" android:layout_width="fill_parent" android:layout_alignParentBottom="true" /> 

    <ListView android:layout_below="@id/header" android:layout_above="@id/footer"/> 
</RelativeLayout>
Parag Chauhan
  • 35,760
  • 13
  • 86
  • 95
1

here is the margin trick I used to achive that behavior.

basically you set the ListView to wrap_content, and you place the Button in the ListView bottom margin space using negative margin.

this uses fixed height, but you could also mesure the button at runtime and set the positive and negative margin dinamically.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<ListView
    android:id="@+id/list_item"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="50dp"
    android:layout_alignParentTop="true" />

<Button
    android:layout_width="fill_parent"
    android:layout_height="50dp"
    android:layout_below="@+id/list_item"
    android:paddingBottom="@dimen/margin"
    android:layout_topMargin="-50dp"
    android:paddingTop="@dimen/margin"
    android:text="@string/add" />

</RelativeLayout>
Mario Lenci
  • 10,422
  • 5
  • 39
  • 50
1

What you're trying to do is actually rather complicated. You want the "footer" to scroll with the list (sometimes at least), which means it needs to be contained within the ListView layout. But then you also (other times) want the same footer to be placed relative to the screen, or more precisely relative to some parent layout (or parent-parent, etc.) of the ListView, which means the footer needs to not be contained within the ListView. These two scenarios require mutually exclusive placement of the element in question.

This is not poor design on the SDK's part, though. It seems from your description that you might be thinking about the problem the wrong way. Is this element really a footer, conceptually speaking, if it's not always at the "foot" of the list, but sometimes all the way down at the bottom of the screen? You MIGHT be able to make the sort of layout you want by combining ListViews, ScrollViews, RelativeLayouts, and some android:layout_height trickery. It may be a better move, however, to simply take an alternate approach to your design.

tlayton
  • 1,757
  • 1
  • 11
  • 13
  • Well, it should be the footer of the list semantically, what I think I need to do is dynamically add in a view before that "footer" that would put the appropriate amount of space to place the image where we want it. – George Walters II Jun 22 '10 at 14:55
  • hi, i need help on setting footer in my list view and to expand the list when i click event from footer,let me guidelines to do the same,please povide me step by step process. – MGSenthil Sep 02 '10 at 14:11