2013-05-01 25 views
17

Ho una cella personalizzata per un ListView Android. Questa cella personalizzata è un layout relativo con alcune viste all'interno. C'è uno spazio tra ogni cella, quindi voglio aggiungere al fondo delle celle un'ombra.Come posso impostare un'ombra in ogni cella di un ListView?

Ho cercato su google ma non ho trovato nulla? Voglio ottenere qualcosa di simile a questo:

enter image description here

Grazie!

+0

abbiamo sempre fatto queste cose con opere d'arte. Il modo più semplice per il programmatore sarebbe quello di fare qualcosa di simile alla dimensione desiderata che include il colore, il pannello bianco e l'ombra. Quindi posizionalo qui.In alternativa è possibile avere ogni pezzo - la striscia di colore, il pannello bianco e l'ombra come pezzi d'arte separati e unirli in un xml. – HalR

+0

Grazie per le vostre risposte ragazzi! @StephanBranczyk quello che sto chiedendo è come creare quell'effetto ombra che le righe hanno. Nell'immagine che ho allegato puoi vedere in fondo ad ogni riga che c'è un piccolo effetto ombra ... – Andres

risposta

37

può essere fatto in meno di due modi:

  1. immagini 9-toppa - clicca link per la comprensione 9 cerotto
  2. Utilizzando strato-list - Creare un nuovo file in "res/drawable", che contiene:

    <?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="@android:color/darker_gray" /> 
           <corners android:radius="5dp"/> 
         </shape> 
        </item> 
        <item android:right="1dp" android:left="1dp" android:bottom="2dp"> 
         <shape 
          android:shape="rectangle"> 
           <solid android:color="@android:color/white"/> 
           <corners android:radius="5dp"/> 
         </shape> 
        </item> 
        </layer-list> 
    

Quindi aggiungere questo file layer-list come sfondo nel vostro articolo list layout (es., LinearLayout o ecc ..).

+0

questo è esattamente quello che stavo cercando !! Grazie mille! – Andres

+0

grazie .... risposta perfetta – nitin

+0

Cool, seconde opere – antongorodezkiy

2

Il modo più semplice è sicuramente quello di costruire l'ombra in una 9 patch. Un esempio di qualcosa di simile a questo è:

Box 9-Patch

Questo è il modo più grande di quanto dovrebbe essere, come un 9-patch, ma ho voluto renderlo più grande per il bene di esempio.

1

Non ho ancora testato lo scenario esatto, ma questo è come si dovrebbe aggiungere un divisore trasparente per una visualizzazione elenco:

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"> 

    <ListView 
    android:id="@+id/android:list" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:divider="@android:color/transparent" 
    android:dividerHeight="4dip"/> 

</LinearLayout> 

Questo è quello che si avrebbe bisogno, se si vuole aggiungere la linea d'ombra a livello di codice.

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"> 
    <solid android:color="@android:color/transparent" /> 
    <stroke 
     android:layout_marginLeft="10dip" 
     android:layout_marginRight="10dip" 
     android:width="match_content" 
     android:color="@color/black" /> 
    <size android:height="1dp" /> 
</shape> 

Il colore del tratto potrebbe non apparire nero poiché è stato eseguito il rendering su un livello alfa. Inoltre, questo attualmente disegna i quattro lati di un rettangolo, non solo il lato inferiore. (Dovrò fare ulteriori ricerche su questi due problemi).

Vedere questo tutorial se si ha bisogno di aiuto per capire come collegare tutto insieme.

2

applico questa lista dei livelli come sfondo nel layout voce dell'Elenco, colore selezionato viene disabilitato ....

<?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="@android:color/darker_gray" /> 
       <corners android:radius="5dp"/> 
     </shape> 
    </item> 
    <item android:right="1dp" android:left="1dp" android:bottom="2dp"> 
     <shape 
      android:shape="rectangle"> 
       <solid android:color="@android:color/white"/> 
       <corners android:radius="5dp"/> 
     </shape> 
    </item> 
    </layer-list> 
1

creare un rettangolo lista dei livelli che i picchi fuori da sotto e impostare proprio sfondo principale del tuo cellulare vista colore nel suo xml.

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 
    <!--shadow to bottom and right--> 
    <!--by pushing offset from top and left--> 
    <!--then set foreground-color in android:background in xml--> 
    <item 
     android:left="2dp" 
     android:right="0dp" 
     android:top="2dp" 
     android:bottom="0dp"> 
     <shape 
      android:shape="rectangle"> 
      <solid android:color="@android:color/darker_gray" /> 
     </shape> 
    </item> 
</layer-list> 

in your cell.xml: 

<RelativeLayout 
    android:layout_width="match_content" 
    android:layout_height="wrap_content" 
    android:background="@drawable/shadow"> 

    <RelativeLayout 
     android:id="@+id/cell_stuff" 
     android:layout_width="match_content" 
     android:layout_height="match_content" 
     android:background="@android:color/holo_orange_light"> 

     <!--cell stuff--> 

    </RelativeLayout> 

</RelativeLayout> 

O all-in-one

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 
    <!--shadow to bottom and right--> 
    <!--by pushing offset from top and left--> 
    <item 
     android:left="2dp" 
     android:right="0dp" 
     android:top="2dp" 
     android:bottom="0dp"> 
     <shape 
      android:shape="rectangle"> 
      <solid android:color="@android:color/darker_gray" /> 
     </shape> 
    </item> 
    <!--foreground-color to cover over non-shadow--> 
    <!--need to also offset in opposite direction--> 
    <item 
     android:left="0dp" 
     android:right="2dp" 
     android:top="0dp" 
     android:bottom="2dp"> 
     <shape 
      android:shape="rectangle"> 
      <solid android:color="@android:color/holo_orange_light"/> 
     </shape> 
    </item> 
</layer-list> 

in your cell.xml: 

<RelativeLayout 
    android:layout_width="match_content" 
    android:layout_height="wrap_content" 
    android:background="@drawable/shadow_allinone"> 

    <!--cell stuff--> 

</RelativeLayout> 

enter image description here

Problemi correlati