77

enter image description here

How can i give padding to list item as i show in image. I want to make the divider in the layout as shown in the image.

this is my list fragment code

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" 
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="25dp"
android:layout_marginRight="25dp">

 <ListView 
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
     android:id="@+id/listV_main"
    android:layout_marginLeft="25dp"
android:layout_marginRight="25dp"/>

This is my List section code

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="10dp"
android:paddingTop="10dp"
android:paddingRight="10dp"
android:paddingBottom="10dp">
<include
    android:id="@+id/list_item_section_text"
    layout="@android:layout/preference_category"
     />

This is my list item code

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:minHeight="?android:attr/listPreferredItemHeight"
android:adjustViewBounds="true"
android:paddingRight="?android:attr/scrollbarSize"
   >
<ImageView
    android:id="@+id/showlist_item_entry_drawable"
    android:layout_width="82dp"
    android:adjustViewBounds="true"
    android:layout_height="68dp"
    android:scaleType="fitXY"
    android:paddingLeft="9dp"/> 
<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="10dip"
    android:layout_marginRight="6dip"
    android:layout_marginTop="6dip"
    android:layout_marginBottom="6dip"
    android:layout_weight="1"
>
    <TextView android:id="@+id/list_item_entry_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:ellipsize="marquee"
        android:fadingEdge="horizontal" /> 
    <TextView android:id="@+id/list_item_entry_summary"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/list_item_entry_title"
        android:layout_alignLeft="@id/list_item_entry_title"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:singleLine="true"
        android:textColor="?android:attr/textColorSecondary" />
</RelativeLayout>

Neelay Srivastava
  • 1,041
  • 3
  • 15
  • 46
Swap-IOS-Android
  • 4,363
  • 6
  • 49
  • 77
  • 3
    Just a quick comment about your getView method - you should use the given convertView and NOT use inflate every time getView runs. – Zordid Mar 23 '14 at 11:22

7 Answers7

218

Use 'inset'.....

(list_divider.xml)

<?xml version="1.0" encoding="UTF-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:insetLeft="50dp"
    android:insetRight="50dp" >

 <shape>
    <solid android:color="@color/orange" />
    <corners android:radius="2.0dip" />
</shape>

</inset>

and in your list view add like this...

<ListView
    android:dividerHeight="2dp"
    android:divider="@drawable/list_divider"
    ...
/>

you can set the inset value as desired...

UPDATE

As pointed out by @Giulio Piancastelli , If the background of list container is different from background of list item then you may use 'layer-list'...

(list_divider.xml)

  <?xml version="1.0" encoding="utf-8"?>
  <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >  
   <item>
        <shape android:shape="rectangle" >
            <solid android:color="@color/list_background" />
        </shape>
    </item>


    <item
        android:left="10dp"
        android:right="10dp">
        <shape android:shape="rectangle" >
            <solid android:color="@color/divider_color"/>
        </shape>
    </item>

        </layer-list>

and in your list view add like this...

<ListView
    android:dividerHeight="2dp"
    android:divider="@drawable/list_divider"
    ...
/>
ASP
  • 3,645
  • 1
  • 31
  • 45
  • 1
    Android really needs insetEnd="@dimen/inset_end" With no insetStart and insetEnd, this is going to get complicated. – Eric Cochran Aug 24 '14 at 20:33
  • 3
    This does not work when the background of the list container is different from the background of the list items. The space left by the inset is transparent when it is used as list divider, so the background of the list container is visible through it, instead of melding seamlessly with the background of list items. Contrary to the `layer-list`-based solution proposed somewhere else on this page, I believe your solution could never work in such a case. – Giulio Piancastelli Sep 09 '14 at 16:03
19

You need padding for dividers? Create your custom drawable-shape as:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <item
        android:left="10dp"
        android:right="10dp">
        <shape android:shape="rectangle" >
            <solid android:color="@android:color/black" />
        </shape>
    </item>

</layer-list>

And set as divider for your ListView in xml:

<ListView
    android:dividerHeight="2dp"
    android:divider="@drawable/custom_divider"
    ...
/>

UPD

I just have ListView in xml:

<ListView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:dividerHeight="2dp"
android:divider="@drawable/line"
/>

Divider as line.xml in drawable:

<?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
        <item
        android:left="10dp"
        android:right="10dp">
        <shape android:shape="rectangle" >
            <solid android:color="@android:color/black" />
        </shape>
    </item>
</layer-list>

Do not make any modifications on the ListView in code. You can try to use Clean if resources are wrong builded.

nfirex
  • 1,523
  • 18
  • 24
  • what is custom_color?? and i have to create xml in drawable?? – Swap-IOS-Android Dec 27 '12 at 12:28
  • i tried your solution but it still showing the same list view – Swap-IOS-Android Dec 27 '12 at 12:41
  • @SwapAndroid I update my answer. The best way is use shape="rectangle". custom_color - it's color of your divider (I change on standart android black). – nfirex Dec 27 '12 at 12:53
  • not working for me...i have added Entry adaptor code at main question. – Swap-IOS-Android Dec 27 '12 at 13:05
  • With that xml-code I have that result: https://dl.dropbox.com/u/17900041/device-2012-12-27-164024.png Do you need something like that or not? – nfirex Dec 27 '12 at 13:53
  • @SwapAndroid I update my answer. You make any changes of ListView in your code? Why you set padding of your row-items in adapter code, maybe you will set them in xml? If you will recive incorrect result - can you show a screenshot of mistake? – nfirex Dec 27 '12 at 14:49
  • This does not work when the background of the list container is different from the background of the list items. The space left by the item is transparent when it is used as list divider, so the background of the list container is visible through it, instead of melding seamlessly with the background of list items. To make it work, you need another layer, under the layer you already have, containing a shape with the same color as the list container background. – Giulio Piancastelli Sep 09 '14 at 16:07
4

As @Giulio Piancastelli mentioned under @ASP answer, the <inset> fails when the background colour of the list container is not the same as the rows inside the list. One solution is to use <layer-list> like below:

//This item is to overlay the container colour with the row background colour
<item
    android:left="0dp"
    android:right="0dp">
    <shape android:shape="rectangle" >
        <solid android:color="@color/row_background" />
    </shape>
</item>

//This item is the divider, put it at bottom so it will overlay the background colour
<item
    android:left="92dp"
    android:right="0dp">
    <shape android:shape="rectangle" >
        <solid android:color="@color/divider
    </shape>
</item>

Then you can set it as divider as most answers suggest:

<ListView
    android:dividerHeight="2dp"
    android:divider="@drawable/layer_list"
    ...
/>
GilbertLee
  • 654
  • 1
  • 6
  • 21
0

In your listitem give the paddingtop to the main layout as

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
   android:padding="10dp"
   ....// Remaining fields
>
... //Remaining items
</LinearLayout>
Ram kiran Pachigolla
  • 20,897
  • 15
  • 57
  • 78
0

this should be alternative solution for this question:

<View 
   android:layout_width="match_parent"
   android:layout_height="1dp"
   android:layout_alignParentBottom="true"
   android:background="color/secondary_text"
   android:layout_marginTop="16dp" />
Zafer Celaloglu
  • 1,438
  • 1
  • 17
  • 28
0

I don't know why people are adding shape to the layered-list but for me this works just fine.

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:top="10dp" android:height="2dp" android:drawable="@android:color/holo_blue_dark"/>
    <item android:height="22dp" android:drawable="@android:color/transparent"/>
</layer-list>

1st item will be 10dp from the top and with a height of 2dp and a color of holo_blue_dark. (This will be the divider)

Now to give 10dp margin to bottom we need to create another transparent item with a height of 22dp (10dp (top margin) + 2dp (height of divider) + 10dp(bottom margin from divider)).

This is working fine for me. I hope this will work for you too.

tycoon
  • 121
  • 9
-4

set your list item divider height and color:

<ListView 
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:id="@+id/listV_main"
android:layout_marginLeft="25dp"
android:layout_marginRight="25dp"
android:divider="@android:color/darker_gray"
android:dividerHeight="1dp"/>
Kiryl Ivanou
  • 1,015
  • 2
  • 12
  • 22
  • i just will say that for this: android:divider="@android:color/darker_gray" android:dividerHeight="1dp" works ok. Create new ListView with android.R.layout.simple_item1 layout for ArrayAdapter and you'll see it works. so may be the problem in your custom items – Kiryl Ivanou Dec 27 '12 at 12:52
  • i have added my entry adaptor code..can you suggest any solution please – Swap-IOS-Android Dec 27 '12 at 12:59
  • I just can suggest to create simple ListView mListView = (ListView)findViewById(R.id.listV_main); mListView.setAdapter(new ArrayAdapter(mContext, android.R.layout.simple_list_item_1, new String[]{"item1", "item2", "item3"})); I've checked it for your ListView ;) works fine of course, showing dividers) so just search the problem in your created list items Wish you only good luck!) – Kiryl Ivanou Dec 27 '12 at 13:19