web-dev-qa-db-fra.com

Android CardView avec coins arrondis affiche les coins gris

Je gonfle une mise en page personnalisée avec CardView à l'intérieur de la mise en page. Les coins arrondis sont affichés comme prévu, mais j'ai également un fond gris derrière les coins.

Le code est simple, utilise un CardView avec un rayon de coin et une couleur de fond. J'ai essayé de définir un fond transparent mais cela ne fonctionne pas. Cependant, si je mets une autre couleur opaque, elle est affichée dans les coins.

Le code est attaché.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:background="@Android:color/transparent">

    <Android.support.v7.widget.CardView
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        app:cardBackgroundColor="@Android:color/white"
        app:cardCornerRadius="6dp"
        app:cardElevation="5dp">

        <RelativeLayout
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            Android:background="@Android:color/transparent">

            <TextView
                Android:id="@+id/tvProgress"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_alignParentLeft="true"
                Android:layout_alignParentStart="true"
                Android:layout_centerVertical="true"
                Android:layout_toLeftOf="@+id/ivIcon"
                Android:layout_toStartOf="@+id/ivIcon"
                Android:background="@Android:color/transparent"
                Android:padding="@dimen/elementPaddingSmall"
                Android:text="Initial Discussion"
                Android:textAppearance="?android:attr/textAppearanceMedium"
                Android:textColor="@Android:color/black" />

            <ImageView
                Android:id="@+id/ivIcon"
                Android:layout_width="50dp"
                Android:layout_height="50dp"
                Android:layout_alignParentEnd="true"
                Android:layout_alignParentRight="true"
                Android:background="@color/lightBrown"
                Android:scaleType="centerInside"
                Android:src="@drawable/ic_checkmark_circle" />
        </RelativeLayout>


    </Android.support.v7.widget.CardView>
</RelativeLayout>

Résultat:

 enter image description here

7
Prasad Pawar

C'est à cause de l'ombre, vous devez laisser un espace à cardview pour afficher une ombre complète. Ajoutez Android:layout_margin="5dp" à CardView et vous verrez que la couleur "grise" est une ombre coupée. 

Solution ajoute app:cardUseCompatPadding="true" à CardView et donnera l’espacement requis.

10
Misha Akopov

Essaye ça...

Il suffit de définir la valeur 0 sur app: cardElevation

.....
<Android.support.v7.widget.CardView
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    app:cardBackgroundColor="@Android:color/white"
    app:cardCornerRadius="6dp"
    app:cardElevation="0dp">
.....

OUvous pouvez appeler cardView.setCardElevation (0) pour désactiver l’ombre par programme.

2

Supprimez le parent RelativeLayout qui enveloppe la CardView et vous pouvez continuer. Juste comme ça:

<?xml version="1.0" encoding="utf-8"?>
<Android.support.v7.widget.CardView
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    app:cardBackgroundColor="@Android:color/white"
    app:cardCornerRadius="6dp"
    app:cardElevation="5dp">

    <RelativeLayout
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:background="@Android:color/transparent">

        <TextView
            Android:id="@+id/tvProgress"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_alignParentLeft="true"
            Android:layout_alignParentStart="true"
            Android:layout_centerVertical="true"
            Android:layout_toLeftOf="@+id/ivIcon"
            Android:layout_toStartOf="@+id/ivIcon"
            Android:background="@Android:color/transparent"
            Android:padding="@dimen/elementPaddingSmall"
            Android:text="Initial Discussion"
            Android:textAppearance="?android:attr/textAppearanceMedium"
            Android:textColor="@Android:color/black"/>

        <ImageView
            Android:id="@+id/ivIcon"
            Android:layout_width="50dp"
            Android:layout_height="50dp"
            Android:layout_alignParentEnd="true"
            Android:layout_alignParentRight="true"
            Android:background="@color/lightBrown"
            Android:scaleType="centerInside"
            Android:src="@drawable/ic_checkmark_circle"/>
    </RelativeLayout>


</Android.support.v7.widget.CardView>
0
Pulak

Si quelqu'un fait face au problème lorsque la couleur des bords est plus sombre que vous avez définie, cela peut arriver si vous définissez la couleur au format #AARRGGBB. Pour résoudre ce problème, définissez simplement la couleur au format #RRGGBB normal.

0
ivan8m8