examples - recyclerview android

¿Cómo puedo establecer una sombra en cada celda de un ListView?

Question

Tengo una celda personalizada para un ListView de Android. Esta celda personalizada es un diseño relativo con algunas vistas dentro. Hay un espacio entre cada celda, así que quiero agregar una sombra a la parte inferior de las celdas.

He estado buscando en Google pero no he encontrado nada? Quiero lograr algo similar a esto:

¡Gracias!

Answer 1

Cree un rectángulo de lista de capas que salte de abajo y establezca el color de fondo principal de su vista de celda en su 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 todo en uno

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

Answer 2

La forma más fácil es definitivamente construir la sombra en un parche de 9. Un ejemplo de algo como esto es:

Esto es mucho más grande de lo que debe ser, como un parche de 9, pero quería hacerlo más grande por ejemplo.

Answer 3

Se puede hacer de dos maneras a continuación:

1. Imágenes de 9 parches: haga clic en el link para comprender 9 parches

2. Uso de la lista de capas: crea un nuevo archivo en "res / drawable" que 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>

Luego agregue este archivo de lista de capas como fondo en el diseño de su elemento de lista (es decir, Linearlayout o etc.).

Answer 4

Todavía no he probado su escenario exacto, pero así es como agregaría un divisor transparente a una vista de lista:

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

Esto es lo que necesitarías si quisieras agregar la línea de la sombra programáticamente.

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

Es posible que el color del trazo no aparezca en negro, ya que se representa en la parte superior de una capa alfa. Además, esto dibuja actualmente los cuatro lados de un rectángulo, no solo el lado inferior. (Tendré que investigar un poco más sobre estos dos temas).

Consulte este tutorial si necesita ayuda para averiguar cómo conectar todo.

Answer 5

aplico esta lista de capas como fondo en el diseño de su elemento de lista, el color seleccionado está deshabilitado ...

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