Separator (divider) after last item of ListView

AndroidAndroid Listview

Android Problem Overview


When I create a simple layout with only a ListView in it, there is no separator displayed after the last item, which looks a bit ugly.

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

    <ListView
        android:id="@android:id/list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true" />
</RelativeLayout>

enter image description here

However, I found out that a separator is displayed after the last item if I add another view bellow the listview and set the android:layout_above attribute for the listview.

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

    <ListView
        android:id="@android:id/list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@+id/bottom"
        android:layout_alignParentTop="true" />

    <TextView
        android:id="@+id/bottom"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="@android:color/holo_blue_dark"
        android:text="Bottom" />
</RelativeLayout>

enter image description here

Why does the listview behave like this? How can I get a separator after the last item in a layout that contains only a listview?

Android Solutions


Solution 1 - Android

The answer is very simple: you should change android:layout_height="wrap_content" to android:layout_height="match_parent" in your ListView.

You can probably guess why this happens.

Solution 2 - Android

Have you tried this one ?

android:footerDividersEnabled="true"

if not try this out

<View
android:background="#00ff00"
android:layout_width="fill_parent"
android:layout_height="3dp"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="@+id/YOUR_LIST_ID" />

Solution 3 - Android

Add an empty view to top (and/or bottom) to create a divider on top (or bottom)

myList.addHeaderView(new View(context));
myList.addFooterView(new View(context));

Solution 4 - Android

I've come with a hack that works around this problem. Since the last separator is displayed only if another view follows the list view, it is possible to make that second view invisible by setting its layout_height to 0dp.

It's still a hack, but it makes to last divider look consistent with the other, so it's better that trying to manually create a horizontal line with trying to guess the right colour and dimensions.

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

    <ListView
        android:id="@android:id/list"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_above="@+id/invisible"
        android:layout_alignParentTop="true" />

    <View
        android:id="@+id/invisible"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_alignParentBottom="true" />    
</RelativeLayout>

Solution 5 - Android

I do something similar to what @Natix describes, but instead of messing with the containing layout of the list I simply add the empty view as a footer on the list via ListView.addFooterView()

Solution 6 - Android

It seems somewhat different when your listview is displayed if you code it like that. But even you can follow this too.

First define a style named Line

<style name="Line">
    <item name="android:layout_width">fill_parent</item>
    <item name="android:layout_height">2px</item>
    <item name="android:background">@color/white</item>
</style>

// In the above style you can change the height of the line as per your requirement.

Wherever you want to use the above line, you can declare it like this in your xml file.

<LinearLayout
android:orientation = "vertical"
.......................
............................>
 <ListView
        android:id="@android:id/list"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
         />


<View
        style="@style/Line"/>

</LinearLayout>

The above code creates a line under your listview. The above code is most useful when you wanna use it in various places in your project. Or if want at only one place, you can do it like this.

 <LinearLayout
    android:orientation = "vertical"
    .......................
    ............................>
     <ListView
            android:id="@android:id/list"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
             />
<View
	android:layout_width="fill_parent"
        android:layout_height="1px"
        android:background="#20b2aa" />

</LinearLayout>

Hope this helps. BTW The reason is vague and even once I did search for this and I followed this way which I explained above.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionNatixView Question on Stackoverflow
Solution 1 - AndroidolshevskiView Answer on Stackoverflow
Solution 2 - AndroidGridtestmailView Answer on Stackoverflow
Solution 3 - AndroidSteven LView Answer on Stackoverflow
Solution 4 - AndroidNatixView Answer on Stackoverflow
Solution 5 - AndroidRoberto AndradeView Answer on Stackoverflow
Solution 6 - AndroidKanthView Answer on Stackoverflow