recyclerview - CardView no muestra Shadow en Android L

implementation cardview

Question

Mi Cardview dentro de Listview no muestra sombra en Android L (Nexus 5). Además, los bordes redondos no se muestran correctamente. Aquí está el código para la vista de adaptador de Listview:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res/com.example.myapp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >

<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/card_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardBackgroundColor="@android:color/white"
    android:foreground="?android:attr/selectableItemBackground"
    app:cardCornerRadius="4dp"
    app:cardElevation="4dp" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:paddingTop="@dimen/activity_vertical_margin" >

        <TextView
            android:id="@+id/tvName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_marginTop="@dimen/padding_small"
            android:paddingLeft="@dimen/activity_horizontal_margin"
            android:paddingRight="@dimen/activity_horizontal_margin"
            android:textAppearance="?android:attr/textAppearanceLarge" />

        <ImageView
            android:id="@+id/ivPicture"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/tvName"
            android:layout_centerHorizontal="true"
            android:scaleType="fitCenter" />

        <TextView
            android:id="@+id/tvDetail"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/ivPicture"
            android:layout_centerHorizontal="true"
            android:paddingLeft="@dimen/activity_horizontal_margin"
            android:paddingRight="@dimen/activity_horizontal_margin" />
    </RelativeLayout>
</android.support.v7.widget.CardView>

Y el ListView xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res/com.example.myapp"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/app_bg" >

<ListView
    android:id="@android:id/list"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentTop="true"
    android:cacheColorHint="#00000000"
    android:divider="@android:color/transparent"
    android:drawSelectorOnTop="true"
    android:smoothScrollbar="true" />

<ProgressBar
    android:id="@+id/progressBarMain"
    style="?android:attr/progressBarStyleLarge"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:visibility="gone" /></RelativeLayout>

Funciona bien en dispositivos pre-L con sombra adecuada y esquinas redondeadas. Pero no funciona en un dispositivo Android L. ¿Puedes decir lo que me estoy perdiendo aquí?

Answer 1

Agregue android: hardwareAccelerated = "true" en su archivo de manifiestos como a continuación funciona para mí

 <activity
        android:name=".activity.MyCardViewActivity"
        android:hardwareAccelerated="true"></activity>

Answer 2

Agregue esta línea a CardView ...

card_view:cardUseCompatPadding="true" //for enable shadow
card_view:cardElevation="9dp" // this for how much shadow you want to show

Consejos

Puede evitar layout_marginTop y layout_marginBottom ya que la sombra misma ocupa un poco de espacio hacia arriba y hacia abajo. La cantidad de espacio se define por la cantidad que usará en card_view: cardElevation = "ndp".

Happy Coding (:

Answer 3

Creo que si primero revisas tu manifiesto si escribiste android:hardwareAccelerated="false" deberías hacer que sea true tener sombra para la tarjeta Como esta respuesta here

Answer 4

Después de revisar los documentos nuevamente, finalmente encontré la solución.

Simplemente agregue card_view:cardUseCompatPadding="true" a su CardView y aparecerán sombras en los dispositivos Lollipop.

Lo que sucede es que el área de contenido en un CardView toma diferentes tamaños en dispositivos pre-lollipop y lollipop. Entonces, en los dispositivos de piruleta, la sombra está realmente cubierta por la tarjeta, por lo que no es visible. Al agregar este atributo, el área de contenido permanece igual en todos los dispositivos y la sombra se hace visible.

Mi código xml es como:

<android.support.v7.widget.CardView
    android:id="@+id/media_card_view"
    android:layout_width="match_parent"
    android:layout_height="130dp"
    card_view:cardBackgroundColor="@android:color/white"
    card_view:cardElevation="2dp"
    card_view:cardUseCompatPadding="true"
    >
...
</android.support.v7.widget.CardView>

Answer 5

En mi caso, la sombra no se mostraba en los dispositivos Android L porque no agregué un margen. El problema es que CardView crea este margen automáticamente en <5 dispositivos, así que ahora lo hago así:

CardView card = new CardView(context);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
        LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
if (Build.VERSION_CODES.LOLLIPOP == Build.VERSION.SDK_INT) {
    params.setMargins(shadowSize, shadowSize, shadowSize,
            shadowSize);
} else {
    card.setMaxCardElevation(shadowSize);
}
card.setCardElevation(shadowSize);
card.setLayoutParams(params);

Answer 6

En primer lugar, asegúrese de que las siguientes dependencias se hayan agregado y compilado correctamente en el archivo build.gradle

    dependencies {
    ...
    compile ''com.android.support:cardview-v7:21.0.+''

    }

y después de esto intente el siguiente código:

     <android.support.v7.widget.CardView 
            xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:card_view="http://schemas.android.com/apk/res-auto"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:layout_margin="5dp"
            android:orientation="horizontal"
            card_view:cardCornerRadius="5dp">
     </android.support.v7.widget.CardView

el problema aumenta en Android L porque el atributo layout_margin no se agrega

Answer 7

Finalmente pude obtener sombras en el dispositivo Lollipop agregando margen a la vista de la tarjeta. Aquí está el diseño final de la vista de tarjeta:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    xmlns:app="http://schemas.android.com/apk/res/com.example.myapp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/card_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardBackgroundColor="@android:color/white"
    android:foreground="?android:attr/selectableItemBackground"
    android:layout_marginLeft="@dimen/activity_horizontal_margin"
    android:layout_marginRight="@dimen/activity_horizontal_margin"
    android:layout_marginTop="@dimen/padding_small"
    android:layout_marginBottom="@dimen/padding_small"
    app:cardCornerRadius="4dp"
    app:cardElevation="4dp" >

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingTop="@dimen/activity_vertical_margin" >

    <TextView
        android:id="@+id/tvName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_marginTop="@dimen/padding_small"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <ImageView
        android:id="@+id/ivPicture"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/tvName"
        android:layout_centerHorizontal="true"
        android:scaleType="fitCenter" />

    <TextView
        android:id="@+id/tvDetail"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/ivPicture"
        android:layout_centerHorizontal="true"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin" />
</RelativeLayout>

Answer 8

La vista de tarjeta no puede mostrar sombras debido a que RelativeLayout está en la sombra de la vista de tarjeta. Para mostrar la sombra, agregue márgenes en la vista de su Tarjeta. Por ejemplo:

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

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="8dp"
    android:layout_marginRight="8dp"
    android:layout_marginTop="4dp"
    android:layout_marginBottom="8dp">

</android.support.v7.widget.CardView>

</RelativeLayout>

Answer 9

Mi vista de reciclado tardó en cargarse, así que al leer .com cambié hardware Acelerado a "falso" y la elevación no se muestra en el dispositivo. El cambio de nuevo a la verdad. Esto funciona para mi.

Answer 10

No olvides que para dibujar sombras debes usar hardwareAccelerated Dibujo hardwareAccelerated

hardwareAccelerated = true

hardwareAccelerated = false

Consulte Aceleración de hardware de Android para más detalles.

Answer 11

Puede agregar esta línea de código para shadow en la vista de tarjeta

card_view:cardElevation="3dp"

Abajo tienes un ejemplo

<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/card_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardBackgroundColor="@android:color/white"
    android:foreground="?android:attr/selectableItemBackground"
    card_view:cardElevation="3dp"
    card_view:cardCornerRadius="4dp">

¡Espero que esto ayude!

Answer 12

Puedes probar agregando esta línea

 card_view:cardUseCompatPadding="true"

Todo el código será así

  <android.support.v7.widget.CardView 
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:card_view="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_margin="5dp"
        android:orientation="horizontal"
        card_view:cardUseCompatPadding="true"
        card_view:cardCornerRadius="5dp">
 </android.support.v7.widget.CardView

Answer 13

Simplemente agregue estas etiquetas:

app:cardElevation="2dp"
app:cardUseCompatPadding="true"

Entonces se convirtió en:

<android.support.v7.widget.CardView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:cardBackgroundColor="?colorPrimary"
    app:cardCornerRadius="3dp"
    app:cardElevation="2dp"
    app:cardUseCompatPadding="true"
    app:contentPadding="1dp" />

Answer 14

compruebe el hardware Acelerado en manifiesto, hágalo verdadero, haciéndolo falso elimina las sombras, cuando la sombra falsa aparece en la vista previa xml pero no en el teléfono.

Answer 15

mueva su atributo "uses-sdk" en la parte superior del manifiesto como la respuesta a continuación https://.com/a/27658827/1394139

Answer 16

use la app:cardUseCompatPadding="true" dentro de su vista de tarjeta. Por ejemplo

<android.support.v7.widget.CardView
        android:id="@+id/card_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginRight="@dimen/cardviewMarginRight"
        app:cardBackgroundColor="@color/menudetailsbgcolor"
        app:cardCornerRadius="@dimen/cardCornerRadius"
        app:cardUseCompatPadding="true"
        app:elevation="0dp">
    </android.support.v7.widget.CardView>