CODEWITHSUNDEEP
androidandroid-layout
Swap-IOS-Android
Swap-IOS-Android

Reputation: 4383

How to assign padding to Listview item divider line

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>

Upvotes: 78

Views: 50922

Answers (7)

tycoon
tycoon

Reputation: 131

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.

Upvotes: 0

ASP
ASP

Reputation: 3705

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"
    ...
/>

Upvotes: 221

Zafer Celaloglu
Zafer Celaloglu

Reputation: 1418

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" />

Upvotes: 0

GilbertLee
GilbertLee

Reputation: 696

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"
    ...
/>

Upvotes: 4

nfirex
nfirex

Reputation: 1523

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.

Upvotes: 19

Kiryl Ivanou
Kiryl Ivanou

Reputation: 1043

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"/>

Upvotes: -4

Ram kiran Pachigolla
Ram kiran Pachigolla

Reputation: 21201

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>

Upvotes: 0

Related Questions