web-dev-qa-db-fra.com

CardView ne montre pas Shadow dans Android L

Mon Cardview dans Listview n’affiche pas d’ombre dans Android L (Nexus 5). De plus, les bords arrondis ne sont pas bien représentés. Voici le code pour la vue adaptateur 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>

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

Cela fonctionne bien sur les appareils pré-L avec une ombre appropriée et des angles arrondis. Mais ne fonctionne pas sur un appareil Android L. Pouvez-vous dire ce qui me manque ici?

98
isumit

Enfin, j'ai pu obtenir des ombres sur le périphérique Lollipop en ajoutant une marge à la vue carte. Voici la mise en page finale de cardview:

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

19
isumit

Après avoir examiné à nouveau la documentation, j'ai finalement trouvé la solution.

Ajoutez simplement card_view:cardUseCompatPadding="true" à votre CardView et les ombres apparaîtront sur les appareils Lollipop.

Ce qui se passe, c’est que la zone de contenu dans une CardView prend différentes tailles sur les périphériques pré-Lollipop et Lollipop. Ainsi, dans les appareils Lollipop, l'ombre est recouverte par la carte et n'est donc pas visible. En ajoutant cet attribut, la zone de contenu reste la même sur tous les périphériques et l'ombre devient visible.

Mon code XML est comme:

<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>
236
Ram Patra

N'oubliez pas que pour dessiner une ombre, vous devez utiliser le dessin hardwareAccelerated

hardwareAccelerated = true enter image description here

hardwareAccelerated = false hardwareAccelerated CardView

Voir Accélération matérielle Android pour plus de détails

42
AndreyICE

utilisezapp:cardUseCompatPadding="true"dans votre vue de carte . Par exemple

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

check hardwareAccelerated in manifest le rend vrai, le rendant faux supprime les ombres, lorsque le faux masque apparaît dans l'aperçu xml mais pas dans le téléphone.

25
JSONParser

Ajoutez cette ligne à CardView ....

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

Conseils

Vous pouvez éviter layout_marginTop et layout_marginBottom car l’ombre prend un peu d’espace entre ses positions. La quantité d’espace définie par la quantité que vous allez utiliser dans card_view: cardElevation = "ndp".

Bonne codage (:

10
Shahriar Nasim Nafi

Vous pouvez ajouter cette ligne de code pour l'ombre en mode carte

card_view:cardElevation="3dp"

Ci-dessous vous avez un exemple

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

J'espère que cela t'aides!

9
Ye Min Htut

Ajoutez simplement ces tags:

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

Alors c'est devenu:

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

Vous pouvez essayer en ajoutant cette ligne

 card_view:cardUseCompatPadding="true"

Tout le code va ressembler à ça

  <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
8
yubaraj poudel

Dans mon cas, l'ombre n'apparaissait pas sur les appareils Android L parce que je n'ai pas ajouté de marge. Le problème est que CardView crée cette marge automatiquement sur <5 appareils, je le fais maintenant comme ceci:

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);
7
Simon Heinen

Tout d’abord, assurez-vous que les dépendances suivantes sont correctement ajoutées et compilées dans le fichier build.gradle

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

    }

et après cela, essayez le code suivant:

     <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

problème se pose sous Android L car l'attribut layout_margin n'est pas ajouté

4
prat3ik-patel

Ajoutez Android: hardwareAccelerated = "true" dans votre fichier manifeste comme ci-dessous cela fonctionne pour moi

 <activity
        Android:name=".activity.MyCardViewActivity"
        Android:hardwareAccelerated="true"></activity>
3
yatin deokar

déplacez votre attribut "uses-sdk" en haut du manifeste, comme dans la réponse ci-dessous https://stackoverflow.com/a/27658827/1394139

0
Dinesh T A

Le chargement de mon recyclerview a été lent, donc en lisant le stackoverflow.com, j’ai modifié hardwareAccelerated en "false", l’élévation n’apparaissant pas dans le périphérique. Je suis redevenu vrai. Ça marche pour moi. 

0
Lathesh

Je pense que si vous vérifiez d'abord votre manifeste si vous avez écrit Android:hardwareAccelerated="false", vous devriez le rendre true pour avoir l'ombre de la carte. Comme cette réponse ici

0
amr ismail

La vue Carte ne peut pas afficher d'ombre car votre RelativeLayout est sur l'ombre de la vue Carte. Pour afficher l'ombre, ajoutez des marges à la vue Carte. Par exemple:

<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>
0
Sudip Sadhukhan