Android'de listView Öğeleri arasında boşluk ayarlama


371

ListView Öğe arasında boşluk yapmak için listView marginBottom kullanmaya çalıştım, ancak yine de öğeleri birbirine eklenir.

Hatta mümkün mü? Evet ise, bunu yapmanın belirli bir yolu var mı?

Kodum aşağıda

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

Özel Liste öğem:

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

Bu durumda liste öğeleri arasında nasıl boşluk bırakabilirim?

Yanıtlar:


829

@Asahi hemen kafasına çiviyi vurdu, ama ben sadece belki daha sonra google üzerinden burada yüzen herkes için biraz XML eklemek istedim:

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

Bazı nedenlerden dolayı, "10", "10.0" ve "10sp" gibi değerlerin tümü Android tarafından dividerHeightdeğer için reddedilir . Kayan nokta sayısı ve "10.0sp" gibi bir birim istiyor. @Goofyahead'ın belirttiği gibi, bu değer için ekrandan bağımsız pikselleri de kullanabilirsiniz (yani, "10dp").


24
Bir bölücüyü
uzatmadan

4
FYI - kod ile yapılabilir - getListView (). SetDividerHeight (10)
AnhSirk Dasarp

2
veya android: divider = "@ null"
kevin

@Sojurn Eğer böyle bir şeye ihtiyacım olsaydı 9 yamayı denerdim.
Sufyan

Kontrol @Sojurn cevabımı . Dolgu ekler, ancak ayırıcıyı germez.
Sufyan


43

Nik Reiman'ın çözümü işe yarıyor olsa da, yapmak istediklerim için en uygun çözüm olmadığını buldum. Kenar boşluklarını ayarlamak için bölücüyü kullanmak, bölücünün artık görünmeyeceği sorunu yaşadı, böylece öğeleriniz arasında net bir sınır göstermek için kullanamazsınız. Ayrıca, her öğeye daha fazla "tıklanabilir alan" eklemez, bu nedenle öğelerinizi tıklanabilir yapmak ve öğelerinizi ince yapmak istiyorsanız, bölücü tarafından eklenen yükseklik olmadığı için bir öğeyi tıklamak çok zor olacaktır. öğenin bir parçası.

Neyse ki, hem bölücüler göstermenize hem de kenar boşluklarını değil dolguları kullanarak her bir öğenin yüksekliğini ayarlamanıza izin veren daha iyi bir çözüm buldum. İşte bir örnek:

Liste görünümü

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

Gerçekten daha iyi bir çözüm. Teşekkürler.
Bigyellowbee

17

ListViewÖğenizi (örneğin your_listview_item) başka bir düzende sarmanız LinearLayoutve örneğin 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>

Bu şekilde, gerekirse ListViewöğenin sağına ve soluna da boşluk ekleyebilirsiniz .


3
Sol / sağ kenar boşluğu istedim, bu yüzden cevabınız benim için yararlı oldu, ancak sadece kenar boşluğu amacıyla başka bir düzeni sarma fikrini sevmiyorum
2cupsOfTech

Birkaç yol var .. ve bu da performans düzenleme açısından kötü olanı .. onlarca (veya yüzlerce) öğe içeren listelerde düşünmeye çalışın :)
andrea.rinaldi

@ andrea.spot Ekranda aynı anda kaç öğe göründüğü sürece, onlarca veya yüzlerce öğe içeren listeler için önemli değildir. ListView görünüm geri dönüşümünü kullanır (bağdaştırıcınızı doğru şekilde uyguladıysanız).
ataulm

1
ListView öğelerinin bir arka planı varsa bu çalışmaz
vovahost

11

Daha fazla alan eklemek, ancak yatay çizgiyi tutmak benim çözümüm divider.xml, res/drawableklasöre eklemek ve içindeki çizgi şeklini tanımlamaktı:

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>

daha sonra listemde aşağıdaki gibi bölücüme başvuruyorum:

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

fark android:dividerHeight="16.0dp"artırılması ve temelde bölücü çizginin üstünde ve altında daha dolgu ekliyorum bu yükseklik azaltarak.

Bu sayfayı referans olarak kullandım: http://developer.android.com/guide/topics/resources/drawable-resource.html#stroke-element


8

Kenar boşlukları olan ve genişletmeden bir ayırıcı göstermek istiyorsanız - InsetDrawable kullanın (boyut, @Nik Reiman'ın söylediği bir biçimde olmalıdır):

Liste görünümü:

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

@ Çekilebilir / 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

Kullanabilirsiniz:

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

misal:

<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 değerini liste öğesi düzeniyle birleştirmek en iyi efekti üretir
Prof

6

Başvurum için bu şekilde yaptım

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

</ListView>

sadece set the divider to nullve bölücüye yükseklik sağlamak benim için yaptı.

Misal :

android:divider="@null"

veya

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

ve bu sonuç

resim açıklamasını buraya girin


Bence, daha iyi android:divider="@android:color/transparent".
CoolMind

5

Bir cevabın zaten seçildiğinin farkındayım, ama sadece bu sorunla karşılaştığımda benim için neyin işe yaradığını paylaşmak istedim.

ListView her giriş kendi Sammy tarafından sorusuna gönderdiğini benzer kendi düzeni tarafından tanımlanmış bir listView vardı. Bölücü yüksekliğini değiştirmek için önerilen yaklaşımı denedim, ancak bu görünmez bir bölücü ile bile çok güzel görünmüyordu. Bazı deneylerden sonra,android:paddingBottom="5dip" , XML dosyasındaki tek tek listView girdilerini tanımlayan son TextView mizanpaj öğesine .

Bu bana kullanarak elde etmeye çalıştığım şeyi tam olarak verdi android:layout_marginBottom. Bu çözümü, bölücü yüksekliğini artırmaya çalışmaktan daha estetik açıdan hoş bir sonuç üretmek için buldum.


4

Marj vermek yerine, dolgu vermelisiniz:

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

VEYA

<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'nin mevcut koduyla (liste öğelerinde zaten dolgu var) en basit çözüm aşağıdaki kodu eklemektir:

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

Bu SO yanıtı bana yardımcı oldu.

Not: Burada istendiği gibi, eski platformlarda liste öğesinin geri dönüşümüyle ilgili çok erken bir hatayla karşılaşabilirsiniz .


1
divider değerini null olarak ve dividerHeight değerini istediğiniz gibi ayarlayabilirsiniz.
Andrew Gallasch

1
@Andy, aynı zamanda öğeler arasındaki dolguyu da kaldıracağını düşünüyorum. Hangi OP çözmek istediği sorunu yaratacak ..
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>

ve set paddingTop, paddingBottomve dividerHeightaynı değere listenin üst ve alt elemanların hepsinin ve mekan arasında eşit boşluğu alır.

Ben set clipToPaddingiçinfalse görünümleri bu yastıklı alanda çekilecek izin.

Ben ayarlamak divideriçin @nullliste elemanları arasında çizgiler kaldırın.


2

Ayrıca, liste öğeleri arasındaki boşluğu artırmanın bir başka yolu da, düzen_height özniteliğine ihtiyacınız olan aralığı sağlayarak adaptör kodunuza boş bir görünüm eklemenizdir. Örneğin, liste öğeleriniz arasındaki alt boşluğu artırmak için bu sahte görünümü (boş görünüm) liste öğelerinizin sonuna ekleyin.

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

Bu, liste görünümü öğeleri arasında 15 dp'lik bir alt boşluk sağlayacaktır. Üst mizanpaj LinearLayout ise ve yön dikey ise bunu doğrudan ekleyebilirsiniz veya diğer mizanpaj için uygun adımları atabilirsiniz. Bu yardımcı olur umarım :-)


2

arka planı liste bölücüsünün saydam hale getirmeniz ve ihtiyacınız olan boşluğa göre yükseklik yapmanız yeterlidir.

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

1

Bir HorizontalListView kullanıyorsanız, bunun için iyi olmayan bir çözüm buldum, çünkü bölücüler onunla çalışmıyor gibi görünüyor, ama daha yaygın ListView için her iki şekilde de çalışacağını düşünüyorum.

Sadece ekliyorum:

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

bağdaştırıcı sınıfında şişirdiğiniz Düzenin en alt Görünümünde, öğeler arasında boşluk oluşturur


1

Bir liste görünümündeki görünümler arasında boşluk bırakmak için lütfen şişirilmiş görünümlerinizde dolgu kullanın.

android:paddingBottom="(number)dp"&& kullanabilirsinizandroid:paddingTop="(number)dp"Görünümünüzde veya liste görünümünüzde şişirdiğiniz görünümlerde .

Bölücü çözümü sadece bir çözümdür, çünkü bir gün, bölücü rengini kullanmak istediğinizde (şu anda şeffaftır) bölücü çizgisinin uzatıldığını göreceksiniz.


1

Bu çözümlerin çoğu işe yarıyor. Bununla birlikte, istediğiniz tek şey öğeler arasındaki kenar boşluğunu ayarlayabiliyorsa, bulduğum en basit yöntem öğenizi - örneğinizde CheckedTextView - bir LinearLayout'a sarmak ve bu öğenin kenar boşluğu biçimlendirmesini koymak, kök düzeni değil. Bu kaydırma düzenine bir kimlik verdiğinizden ve bağdaştırıcınızda CheckedTextView ile birlikte oluşturduğunuzdan emin olun.

Bu kadar. Aslında, kenar boşluğunu ListView için öğe düzeyinde somutlaştırıyorsunuz. ListView herhangi bir öğe düzeni hakkında bilgi sahibi olmadığından, yalnızca adaptörünüz bunu yapar. Bu, temel olarak öğe düzeninin daha önce yok sayılan kısmını şişirir.


0

Bu, ayırıcı yüksekliğini eklemenize yardımcı olacaktır.

 getListView().setDividerHeight(10)

Özel bir görünüm eklemek istiyorsanız, listView öğe düzeninin kendisine küçük bir görünüm ekleyebilirsiniz.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.