안드로이드에서 listView 항목 사이에 공백을 설정하는 방법


371

listView Item에서 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>

이 경우 목록 항목 사이에 간격을 두려면 어떻게해야합니까?

답변:


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

어떤 이유로 "10", "10.0"및 "10sp"와 같은 값은 모두 dividerHeight값으로 거부됩니다 . 부동 소수점 숫자와 "10.0sp"와 같은 단위를 원합니다. @Goofyahead 메모와 마찬가지로이 값에 디스플레이 독립적 픽셀을 사용할 수도 있습니다 (예 : "10dp").


24
스트레칭을하지 않고 분배기를 보여주고 싶을 때는 도움이되지 않습니다
Sojurn

4
참고 - 코드를 통해 수행 할 수 있습니다 - 위에서 getListView () setDividerHeight (10).
AnhSirk Dasarp

2
또는 android : divider = "@ null"
kevin

@Sojurn 나는 그와 같은 것이 필요하다면 9 패치를 시도했을 것입니다.
Sufian

@Sojurn 내 대답을 확인하십시오 . 패딩을 추가하지만 디바이더를 늘리지 않습니다.
Sufian


43

Nik Reiman의 솔루션은 작동하지만, 내가하고 싶은 일에 최적의 솔루션이 아니라는 것을 알았습니다. 디바이더를 사용하여 여백을 설정하면 디바이더가 더 이상 보이지 않아 항목 사이에 명확한 경계를 표시하는 데 사용할 수없는 문제가있었습니다. 또한 각 항목에 더 많은 "클릭 가능 영역"을 추가하지 않으므로 항목을 클릭 가능하게 만들고 항목을 얇게 만들려면 분배기가 추가 한 높이가 아니므로 누구나 항목을 클릭하기가 매우 어렵습니다. 품목의 일부.

다행히도 나눗셈을 표시하고 여백이 아니라 패딩을 사용하여 각 항목의 높이를 조정할 수있는 더 나은 솔루션을 찾았습니다. 예를 들면 다음과 같습니다.

목록보기

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

ListItem

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

@ 드로어 블 / 분리기 _ 라인 :

<?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을 목록 항목 레이아웃 과 결합 하면 최상의 효과를 얻을 수 있습니다.
Prov

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

답변이 이미 선택되었음을 알고 있지만이 문제가 발생했을 때 나에게 도움이되는 것을 공유하고 싶었습니다.

Sammy가 질문에 게시 한 것과 비슷한 listView의 각 항목이 자체 레이아웃으로 정의 된 listView가 있습니다. 나는 칸막이 높이를 변경하는 제안 된 접근법을 시도했지만 보이지 않는 칸막이로도 너무 아름답게 보이지는 않았습니다. 몇 가지 실험을 한 후 android:paddingBottom="5dip"개별 listView 항목을 정의하는 XML 파일의 마지막 TextView 레이아웃 요소에 간단히 추가했습니다 .

이것으로의 사용을 통해 내가 달성하려는 것을 정확하게 얻었습니다 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
분할기를 null로 설정하고 분할기 높이를 원하는대로 설정할 수 있습니다.
Andrew Gallasch

1
@ 앤디 나는 또한 항목 사이의 패딩을 제거 할 것이라고 생각합니다. 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>

및 설정 paddingTop, paddingBottomdividerHeight동일한 값리스트의 상단과 하단에 모든 요소와 공간 사이에 동일한 간격을 얻기 위해.

이 패딩 영역에 뷰를 그리도록 설정 clipToPadding했습니다 false.

목록 요소 사이의 줄을 제거하도록 설정 divider했습니다 @null.


2

목록 항목 사이의 간격을 늘리는 또 다른 방법은 layout_height 속성에 필요한 간격을 제공하여 어댑터 코드에 빈보기를 추가하는 것입니다. 예를 들어 목록 항목 사이의 하단 간격을 늘리려면이 더미보기 (빈보기)를 목록 항목 끝에 추가하십시오.

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

따라서 이것은 목록보기 항목 사이의 하단 간격이 15dp입니다. 부모 레이아웃이 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

디바이더가 작동하지 않기 때문에 HorizontalListView를 사용하는 경우이 방법이 좋지 않은 해결책을 찾았지만 더 일반적인 ListView에서는 어느 쪽이든 작동한다고 생각합니다.

그냥 추가 :

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

어댑터 클래스에서 팽창시킨 레이아웃의 최하위보기에서 항목 사이에 간격이 생깁니다.


1

listView 내부의 뷰 사이에 간격을 두려면 팽창 뷰에서 패딩을 사용하십시오.

뷰 또는 뷰 뷰에서 팽창 한 뷰에서 android:paddingBottom="(number)dp"&& android:paddingTop="(number)dp"를 사용할 수 있습니다 .

분배기 솔루션은 단지 수정입니다. 언젠가 분배기 색상을 사용하려고 할 때 (지금은 투명합니다) 분배기 선이 늘어난 것을 볼 수 있습니다.


1

이러한 많은 솔루션이 작동합니다. 그러나 원하는 항목 만 항목 사이에 여백을 설정하려면 가장 간단한 방법은 LinearLayout에서 항목-CheckedTextView-을 감싸고 항목의 여백 서식을 넣는 것입니다. 루트 레이아웃이 아닙니다. 이 랩핑 레이아웃에 ID를 제공하고 어댑터에서 CheckedTextView와 함께 작성하십시오.

그게 다야. 실제로, ListView의 항목 레벨에서 여백을 인스턴스화합니다. ListView는 항목 레이아웃에 대해 알지 못하므로 어댑터 만 알 수 있습니다. 이것은 기본적으로 이전에 무시되었던 항목 레이아웃의 일부를 팽창시킵니다.


0

이것은 칸막이 높이를 추가하는 데 도움이됩니다.

 getListView().setDividerHeight(10)

사용자 정의보기를 추가하려는 경우 listView 항목 레이아웃 자체에 작은보기를 추가 할 수 있습니다.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.