Android ListView Divider

AndroidListviewDivider

Android Problem Overview


I have this code:

<ListView
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:id="@+id/cashItemsList"
     android:cacheColorHint="#00000000"
     android:divider="@drawable/list_divider"></ListView>

where @drawable/list_divider is:

<shape
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:shape="line">
 <stroke
   android:width="1dp"
   android:color="#8F8F8F"
   android:dashWidth="1dp"
   android:dashGap="1dp" />
</shape>

but I can't see any divider.

Android Solutions


Solution 1 - Android

Folks, here's why you should use 1px instead of 1dp or 1dip: if you specify 1dp or 1dip, Android will scale that down. On a 120dpi device, that becomes something like 0.75px translated, which rounds to 0. On some devices, that translates to 2-3 pixels, and it usually looks ugly or sloppy

For dividers, 1px is the correct height if you want a 1 pixel divider and is one of the exceptions for the "everything should be dip" rule. It'll be 1 pixel on all screens. Plus, 1px usually looks better on hdpi and above screens

"It's not 2012 anymore" edit: you may have to switch over to dp/dip starting at a certain screen density

Solution 2 - Android

This is a workaround, but works for me:

Created res/drawable/divider.xml as follows:

<?xml version="1.0" encoding="UTF-8"?>
<shape
  xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient android:startColor="#ffcdcdcd" android:endColor="#ffcdcdcd" android:angle="270.0" />
</shape>

And in styles.xml for listview item, I added the following lines:

	<item name="android:divider">@drawable/divider</item>
	<item name="android:dividerHeight">1px</item>

Crucial part was to include this 1px setting. Of course, drawable uses gradient (with 1px) and that's not the optimal solution. I tried using stroke but didn't get it to work. (You don't seem to use styles, so just add android:dividerHeight="1px" attribute for the ListView.

Solution 3 - Android

Add android:dividerHeight="1px" and it will work:

<ListView
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:id="@+id/cashItemsList"
     android:cacheColorHint="#00000000"
     android:divider="@drawable/list_divider"
     android:dividerHeight="1px">
 </ListView>

Solution 4 - Android

The problem you're having stems from the fact that you're missing android:dividerHeight, which you need, and the fact that you're trying to specify a line weight in your drawable, which you can't do with dividers for some odd reason. Essentially to get your example to work you could do something like the following:

Create your drawable as either a rectangle or a line, either works you just can't try to set any dimensions on it, so either:

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
     <stroke android:color="#8F8F8F" android:dashWidth="1dp" android:dashGap="1dp" />
</shape>

OR:

<shape xmlns:android="http://schemas.android.com/apk/res/android"  android:shape="rectangle">
     <solid android:color="#8F8F8F"/>
</shape>

Then create a custom style (just a preference but I like to be able to reuse stuff)

<style name="dividedListStyle" parent="@android:style/Widget.ListView">
    <item name="android:cacheColorHint">@android:color/transparent</item>
    <item name="android:divider">@drawable/list_divider</item>
    <item name="android:dividerHeight">1dp</item>
</style>

Finally declare your list view using the custom style:

<ListView
     style="@style/dividedListStyle"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:id="@+id/cashItemsList">
</ListView>

I'm assuming you know how to use these snippets, if not let me know. Basically the answer to your question is that you can't set the divider thickness in the drawable, you have to leave the width undefined there and use android:dividerHeight to set it instead.

Solution 5 - Android

From the doc:

public void setDivider(Drawable divider) on ListView

/**
 * Sets the drawable that will be drawn between each item in the list. If the drawable does
 * not have an intrinsic height, you should also call {@link #setDividerHeight(int)}
 *
 * @param divider The drawable to use.
 */

Looks like setDividerHeight() must be called in order for the divider to show up if it has no intrinsic height

Solution 6 - Android

Your @drawable/list_divide should look like this:

<shape
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:shape="line">
 <stroke
   android:height="1dp"
   android:color="#8F8F8F"
   android:dashWidth="1dp"
   android:dashGap="1dp" />
</shape>

In your version you provide an android:width="1dp", simply change it to an android:height="1dp" and it should work!

Solution 7 - Android

From the doc:

> file location: > > res/drawable/filename.xml > > The filename is used as the resource ID.

basically, you'll need to put a file named list_divider.xml in res/drawable/ so you can access it as R.drawable.list_divider; if you can access it that way, then you can use android:divider="@drawable/list_divider" in the XML for ListView.

Solution 8 - Android

Some people might be experiencing a solid line. I got around this by adding android:layerType="software" to the view referencing the drawable.

Solution 9 - Android

The android docs warn about things dissappearing due to round-off error... Perhaps try dp instead of px, and perhaps also try > 1 first to see if it is the round-off problem.

see http://developer.android.com/guide/practices/screens_support.html#testing

for the section "Images with 1 pixel height/width"

Solution 10 - Android

I had the same issue. However making the view 1px didn't seem to work on my original Nexus 7. I noticed that the screen density was 213 which is less than the 240 used in xhdpi. So it was thinking the device was an mdpi density.

My solution was to make it so the dimens folder had a dividerHeight parameter. I set it to 2dp in the values-mdpi folder but 1dp in the values-hdpi etc folders.

Solution 11 - Android

you forgot an "r" at the end of divider in your divider xml layout

you call the layout @drawable/list_divider but your divider xml is named "list_divide"

Solution 12 - Android

Set android:dividerHeight="1dp"

<ListView
    android:id="@+id/myphnview"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_below="@drawable/dividerheight"
    android:background="#E9EAEC"
    android:clickable="true"
    android:divider="@color/white"
    android:dividerHeight="1dp"
    android:headerDividersEnabled="true" >
</ListView>

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
QuestionoriharelView Question on Stackoverflow
Solution 1 - AndroidJoe PlanteView Answer on Stackoverflow
Solution 2 - AndroidMika VatanenView Answer on Stackoverflow
Solution 3 - AndroidMartijn de BruijnView Answer on Stackoverflow
Solution 4 - AndroidJustin BuserView Answer on Stackoverflow
Solution 5 - AndroidPlantageView Answer on Stackoverflow
Solution 6 - AndroidChristianView Answer on Stackoverflow
Solution 7 - AndroidLie RyanView Answer on Stackoverflow
Solution 8 - AndroidJeremyDayView Answer on Stackoverflow
Solution 9 - Androiddnunn0View Answer on Stackoverflow
Solution 10 - AndroidRCBView Answer on Stackoverflow
Solution 11 - AndroidK CView Answer on Stackoverflow
Solution 12 - AndroidnzalaView Answer on Stackoverflow