如何在Android中的listView项目之间设置空间


371

我尝试在listView上使用marginBottom在listView Item之间留出空间,但这些项目仍附加在一起。

可能吗 如果是,是否有特定方法可以做到?

我的代码如下

<LinearLayout
android:id="@+id/alarm_occurences"
android:layout_width="fill_parent" 
android:orientation="vertical"
android:layout_height="fill_parent"
android:background="#EEEEFF"
xmlns:android="http://schemas.android.com/apk/res/android">

<ListView
android:id="@+id/occurences"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
</LinearLayout>

我的自定义列表项:

<com.android.alarm.listItems.AlarmListItem
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent" 
android:background="@drawable/alarm_item_background"
android:layout_marginBottom="10dp"    
>
<CheckedTextView     
    android:id="@android:id/text1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:gravity="center_vertical"
    android:checkMark="?android:attr/listChoiceIndicatorMultiple"
    android:textSize="20sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:padding="10dp"

/>

</com.android.alarm.listItems.AlarmListItem>

在这种情况下,如何在列表项之间留出间距?

Answers:


829

@Asahi几乎打在了头上,但是我只想为以后可能通过Google漂浮在这里的任何人添加一点XML:

<ListView android:id="@+id/MyListView"
  android:layout_height="match_parent"
  android:layout_width="match_parent"
  android:divider="@android:color/transparent"
  android:dividerHeight="10.0sp"/>

由于某些原因,Android会拒绝诸如“ 10”,“ 10.0”和“ 10sp”之类的dividerHeight值。它需要一个浮点数和一个单位,例如“ 10.0sp”。正如@Goofyahead所指出的,您也可以使用与显示无关的像素作为此值(即“ 10dp”)。


24
如果您还想显示分隔线而不拉伸,这
无济于事

4
仅供参考-可以通过代码完成-getListView()。setDividerHeight(10)
AnhSirk Dasarp 2013年

2
或android:divider =“ @ null”
凯文

@Sojurn如果我需要类似的东西,我会尝试9个补丁。
苏菲安2015年

@Sojurn检查我的答案。它增加了填充,但没有拉伸分隔线。
苏菲安2015年


43

尽管Nik Reiman的解决方案确实可行,但我发现它并不是我想要做的最佳解决方案。使用分隔线设置边距存在一个问题,即分隔线将不再可见,因此您不能使用它来显示项目之间的清晰边界。另外,它不会为每个项目添加更多的“可点击区域”,因此,如果您要使项目可点击并且项目较薄,那么任何人都很难单击项目,因为分隔线所增加的高度不是项目的一部分。

幸运的是,我找到了一个更好的解决方案,它既可以显示分隔线,又可以使用边距而不是填充来调整每个项目的高度。这是一个例子:

列表显示

<ListView
android:id="@+id/listView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>

项目清单

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

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:text="Item"
        android:textAppearance="?android:attr/textAppearanceSmall" />

</RelativeLayout>

确实是更好的解决方案。谢谢。
Bigyellowbee

17

您应该将ListView商品(例如your_listview_item)包装在其他布局中,例如,LinearLayout并向以下位置添加边距your_listview_item

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <your_listview_item
        android:id="@+id/list_item"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="5dp"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="5dp"
    ...
    ...
    />
</LinearLayout>

这样,如果需要,您还可以在ListView项目的右侧和左侧添加空间。


3
我想要左/右页边距,所以您的回答对我有所帮助,但是我不喜欢仅出于保证金目的而包装其他布局的想法
2cupsOfTech 2012年

有几种方法..就布局性能而言,这是不好的方法。.尝试思考包含数十(或数百)项的列表:)
andrea.rinaldi 2014年

@ andrea.spot对于具有数十个或数百个项目的列表没有关系,除非那是一次在屏幕上可见多少个项目。ListView使用视图回收(如果正确实现了适配器)。
ataulm 2014年

1
如果ListView项具有背景,则将无法使用
vovahost 2014年

11

我增加更多空间但保持水平线的解决方案是divider.xmlres/drawable文件夹中定义线形:

Divider.xml

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

    <stroke
        android:width="1px"
        android:color="@color/nice_blue" />

</shape>

然后在我的列表中引用如下的分隔符:

<ListView
    android:id="@+id/listViewScheduledReminders"
    android:layout_width="match_parent"
    android:layout_height="0dip"
    android:layout_marginBottom="@dimen/mediumMargin"
    android:layout_weight="1"
    android:divider="@drawable/divider"
    android:dividerHeight="16.0dp"
    android:padding="@dimen/smallMargin" >

</ListView>

注意,android:dividerHeight="16.0dp"通过增加和减小此高度,我基本上是在分隔线的顶部和底部添加更多填充。

我将此页面用作参考:http : //developer.android.com/guide/topics/resources/drawable-resource.html#stroke-element


8

如果要显示带边距且不拉伸的分隔线,请使用InsetDrawable(尺寸必须为格式,@ Nik Reiman表示该格式):

列表显示:

<ListView
    android:id="@+id/listView"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:cacheColorHint="#00000000"
    android:divider="@drawable/separator_line"
    android:dividerHeight="10.0px"/>

@ drawable / separator_line:

<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:insetLeft="5.0px"
    android:insetRight="5.0px"
    android:insetTop="8.0px"
    android:insetBottom="8.0px">

    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
        <gradient
            android:startColor="@color/colorStart"
            android:centerColor="@color/colorCenter"
            android:endColor="@color/colorEnd"
            android:type="linear"
            android:angle="0">
        </gradient>
    </shape>
</inset>

7

您可以使用:

android:divider="@null"
android:dividerHeight="3dp"

例:

<ListView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/listView" android:layout_gravity="center_horizontal"
        android:dividerHeight="3dp"
        android:divider="@null" android:clickable="false"/>

将null与列表项布局结合使用可产生最佳效果
教授

6

对于我的应用程序,我已经这样做

 <ListView
    android:id="@+id/staff_jobassigned_listview"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:divider="@null"
    android:dividerHeight="10dp">

</ListView>

公正,set the divider to null并为分隔线提供高度对我来说是成功的。

范例:

android:divider="@null"

要么

android:divider="@android:color/transparent"

这是结果

在此处输入图片说明


我认为更好android:divider="@android:color/transparent"
CoolMind

5

我意识到已经选择了一个答案,但是我只想分享在遇到此问题时最终对我有用的答案。

我有一个listView,其中listView中的每个条目都由其自己的布局定义,类似于Sammy在他的问题中发布的内容。我尝试了建议的方法来更改分隔线的高度,但是即使使用了不可见的分隔线,也没有看起来太漂亮。经过一些试验,我只是android:paddingBottom="5dip"在XML文件的最后一个TextView布局元素中添加了一个,该元素定义了单个listView条目。

最终给了我确切的信息,我试图通过使用来实现android:layout_marginBottom。我发现此解决方案比试图增加分隔线的高度产生了更美观的结果。


4

而不是给裕度,您应该给填充:

<ListView
    android:id="@+id/listView1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:divider="@android:color/green"
    android:dividerHeight="4dp"
    android:layout_alignParentTop="true"
    android:padding="5dp" >

</ListView>

要么

<ListView
    android:id="@+id/listView1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:paddingTop="2dp"
    android:divider="@android:color/green"
    android:dividerHeight="4dp"
    android:paddingLeft="1dp"
    android:paddingRight="1dp"
    android:paddingBottom="2dp"
    android:paddingStart="0dp"
    android:paddingEnd="0dp" >

</ListView>

3

使用OP现有代码(列表项已经填充)的最简单解决方案是添加以下代码:

listView.setDivider(new ColorDrawable(Color.TRANSPARENT));  //hide the divider
listView.setClipToPadding(false);   // list items won't clip, so padding stays

这样的回答对我有所帮助。

注意:您可能面临的列表项上旧平台太快循环的一个错误,因为已经被问在这里


1
您可以将divider设置为null,并将dividerHeight设置为任意值。
Andrew Gallasch 2015年

1
@Andy我认为它也会删除项目之间的填充。这将创造OP想要解决的问题
。– Sufian

2
<ListView
    android:clipToPadding="false"
    android:paddingTop="10dp"
    android:paddingBottom="10dp"
    android:dividerHeight="10dp"
    android:divider="@null"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
</ListView>

并设定paddingToppaddingBottom以及dividerHeight其为相同的值,以使所有元素之间的间距以及列表顶部和底部的间距相等。

我设置clipToPaddingfalse在该填充区域中绘制视图。

我设置divider@null删除列表元素之间的线。


2

增加列表项之间间距的另一种方法是,通过为layout_height属性提供所需的间距,向适配器代码添加一个空视图。例如,为了增加列表项之间的底部间距,请将此虚拟视图(空视图)添加到列表项的末尾。

<View
    android:layout_width="match_parent"
    android:layout_height="15dp"/>

因此,这将在列表视图项之间提供15 dp的底部间距。如果父布局是LinearLayout且方向是垂直的,则可以直接添加它,也可以针对其他布局采取适当的步骤。希望这可以帮助 :-)


2

您只需要使背景透明于列表分隔符,并根据所需的间隙设置高度即可。

<ListView 
         android:id="@+id/custom_list"
         android:layout_height="match_parent"
         android:layout_width="match_parent"
         android:divider="#00ffffff"
         android:dividerHeight="20dp"/>

1

如果您使用Horizo​​ntalListView,我发现了一个不太好的解决方案,因为分隔符似乎无法使用它,但是我认为对于更常见的ListView来说,它都可以使用。

只需添加:

<View
android:layout_marginBottom="xx dp/sp"/>

在适配器类中填充的布局的最底部视图中,将在项目之间创建间距


1

为了在listView内部的视图之间留出间距,请在填充视图上使用填充。

您可以在视图中使用android:paddingBottom="(number)dp"&& android:paddingTop="(number)dp"或在列表视图中将其放大的视图。

分频器解决方案只是一个解决办法,因为有一天,当您要使用分频器颜色时(现在它是透明的),您会看到分频器线被拉伸了。


1

这些解决方案中的许多工作。但是,如果您只想设置项目之间的边距,那么我想出的最简单的方法是将您的项目(在您的情况下为CheckedTextView)包装在LinearLayout中,然后在其中放置项目的边距格式,而不是根布局。确保为该包装布局指定一个ID,并在适配器中将其与CheckedTextView一起创建。

而已。实际上,您正在实例化ListView在项目级别的边距。因为ListView不知道任何项目布局-只有适配器知道。基本上,这会使以前被忽略的项目布局部分膨胀。


0

这将帮助您增加分隔线的高度。

 getListView().setDividerHeight(10)

如果要添加自定义视图,则可以在listView项布局本身中添加一个小视图。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.