Как установить пространство между элементами ListView в Android

371

Я попытался использовать marginBottom в listView, чтобы освободить место между 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>

Как я могу сделать интервал между элементами списка в этом случае?

Сэмми
источник

Ответы:

829

@Asahi довольно сильно ударил по голове, но я просто хотел добавить немного XML для тех, кто, возможно, попал сюда позже через Google:

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

По некоторым причинам такие значения, как «10», «10.0» и «10sp», все отклоняются Android для этого dividerHeightзначения. Он хочет число с плавающей запятой и единицу, такую ​​как "10.0sp". Как отмечает @Goofyahead, вы также можете использовать независимые от дисплея пиксели для этого значения (т. Е. «10dp»).

Ник Рейман
источник
24
Это не поможет, если вы также хотите показать разделитель, не растягивая его
Sojurn
4
К вашему сведению - это можно сделать с помощью кода - getListView (). SetDividerHeight (10)
AnhSirk Dasarp
2
или андроид: divider = "@ null"
Кевин
@ Sojurn Я бы попробовал 9-патч, если бы мне нужно что-то подобное.
Суфиан
@ Сожди, проверь мой ответ . Это добавляет отступы, но не растягивает разделитель.
Суфиан
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>
idunnololz
источник
Действительно лучшее решение. Спасибо.
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
Есть несколько способов ... и это плохо с точки зрения производительности компоновки ... попробуйте думать о списках с десятками (или сотнями) элементов :)
andrea.rinaldi
@ andrea.spot не будет иметь значения для списков с десятками или сотнями элементов, если только это не будет, сколько элементов было видно на экране одновременно. ListView использует переработку представления (если вы правильно внедрили свой адаптер).
ataulm
1
Это не будет работать, если элементы ListView будут иметь фон
vovahost
11

Мое решение добавить больше места, но сохранить горизонтальную линию, было добавить divider.xmlв res/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

kamelnyc
источник
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"/>

@ Вытяжка / 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"/>
mspapant
источник
Комбинирование нуля с расположением элементов списка дает лучший эффект
Проф.
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 определялась своим собственным макетом, аналогично тому, что Сэмми опубликовал в своем вопросе. Я попробовал предложенный подход к изменению высоты разделителя, но это не выглядело слишком красиво, даже с невидимым разделителем. После некоторых экспериментов я просто добавил android:paddingBottom="5dip"последний элемент макета TextView в XML-файл, который определяет отдельные записи 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
Вы можете установить делитель на ноль и установить dividerHeight на что угодно.
Эндрю Галлаш
1
@ И я думаю, это также уберет отступы между элементами. Который будет создавать проблему, которую ОП хотел решить ..
Суфиан
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>

и установите paddingTop, paddingBottomи dividerHeightв то же значение, чтобы получить равный интервал между всеми элементами и пробелом в верхней и нижней части списка.

Я установил, clipToPaddingчтобы falseпозволить рисовать виды в этой области.

Я установил, dividerчтобы @nullудалить линии между элементами списка.

Эндрю Галлаш
источник
2

Еще один способ увеличить интервал между элементами списка - добавить пустой код в код адаптера, предоставив атрибуту layout_height необходимый интервал. Например, чтобы увеличить нижний интервал между элементами списка, добавьте этот фиктивный вид (пустой вид) в конец элементов списка.

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

Таким образом, это обеспечит нижний интервал 15 dp между элементами представления списка. Вы можете напрямую добавить это, если родительский макет имеет LinearLayout, а ориентация вертикальная, или предпримите соответствующие шаги для другого макета. Надеюсь это поможет :-)

Fingersmith
источник
2

вам просто нужно сделать фон прозрачным из разделителя списка и сделать высоту в соответствии с вашим нужным промежутком.

<ListView 
         android:id="@+id/custom_list"
         android:layout_height="match_parent"
         android:layout_width="match_parent"
         android:divider="#00ffffff"
         android:dividerHeight="20dp"/>
Паван Кумар
источник
1

Я нашел не очень хорошее решение для этого в случае, если вы используете HorizontalListView, так как разделители, кажется, не работают с ним, но я думаю, что это будет работать в любом случае для более общего ListView.

Просто добавляю:

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

в представлении нижнего макета, который вы надуете в классе адаптера, будет создан интервал между элементами

Juliagu
источник
1

Чтобы обеспечить интервал между представлениями внутри listView, пожалуйста, используйте отступы для ваших завышенных представлений.

Вы можете использовать android:paddingBottom="(number)dp"&& android:paddingTop="(number)dp"в своем представлении или просмотрах, которые вы надуваете внутри своего списка.

Решение делителя - это просто исправление, потому что однажды, когда вы захотите использовать цвет делителя (сейчас он прозрачный), вы увидите, что линия делителя растянута.

Ави Левин
источник
1

Многие из этих решений работают. Однако, если все, что вам нужно, - это установить границу между элементами, то самый простой метод, который я придумал, - это обернуть ваш элемент - в вашем случае CheckedTextView - в LinearLayout и поместить в него форматирование полей для элемента, не рут-макет. Обязательно дайте этому макету упаковки идентификатор и создайте его вместе с CheckedTextView в своем адаптере.

Вот и все. По сути, вы создаете экземпляр поля на уровне элемента для ListView. Потому что ListView не знает ни о каком элементе макета - знает только ваш адаптер. Это в основном раздувает ту часть макета элемента, которая раньше игнорировалась.

jwehrle
источник
0

Это поможет вам добавить высоту делителя.

 getListView().setDividerHeight(10)

Если вы хотите добавить пользовательское представление, вы можете добавить небольшое представление в макет элемента listView.

Аканши Шривастава
источник