Android CardView阴影未舍入

问题描述

使用卡片视图后,我意识到盒子阴影没有圆滑并且在电话屏幕上看起来很糟糕,下面是使用的示例代码以及阴影的屏幕截图,我添加了更多阴影来强调,因此您可以清楚地看到看到当盒子变圆时,阴影的边缘是矩形的。

<androidx.cardview.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"
android:layout_marginBottom="8dp"
android:background="@drawable/card"
android:elevation="5dp"
app:cardCornerRadius="5dp"
app:contentPaddingTop="8dp"
app:contentPaddingBottom="8dp"
app:contentPaddingLeft="@dimen/sideSpace"
app:contentPaddingRight="@dimen/sideSpace"
app:cardElevation="12dp">...

enter image description here

如何解决

解决方法

You can use this drawable as a background of any view for shadow

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Drop Shadow Stack -->
    <item>
        <shape>
            <padding android:top="0.5dp" android:right="0.5dp" android:bottom="1dp" android:left="0.5dp" />
            <solid android:color="#10CCCCCC" />
            <corners android:radius="8dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="0.5dp" android:right="0dp" android:bottom="1dp" android:left="0.5dp" />
            <solid android:color="#10CCCCCC" />
            <corners android:radius="7dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <solid android:color="#20CCCCCC" />
            <corners android:radius="6dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="0dp" android:right="0dp" android:bottom="1dp" android:left="0dp" />
            <solid android:color="#30CCCCCC" />
            <corners android:radius="5dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="0dp" android:right="0dp" android:bottom="1dp" android:left="0dp" />
            <solid android:color="#40CCCCCC" />
            <corners android:radius="4dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="0dp" android:right="0dp" android:bottom="1dp" android:left="0dp" />
            <solid android:color="#50CCCCCC" />
            <corners android:radius="3dp" />
        </shape>
    </item>
    <item>
        <shape>

            <padding android:top="0dp" android:right="0.1dp" android:bottom="0.5dp" android:left="0.1dp" />
            <solid android:color="#60CCCCCC" />
            <corners android:radius="3dp" />
        </shape>
    </item>

    <!-- Background -->
    <item>
        <shape>
            <solid android:color="#ffffff" />
            <corners android:radius="3dp" />
        </shape>
    </item>
</layer-list>
,
<androidx.cardview.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/dimen_10dp"
    android:divider="@android:color/transparent"
    android:dividerHeight="0.0px"
    android:clipToPadding="false"
    android:clipChildren="false"
    app:cardElevation="10dp"
    app:cardPreventCornerOverlap="false"
    android:elevation="@dimen/dimen_20dp"
    app:cardCornerRadius="@dimen/dimen_15dp"
    >

应该有一个孩子也要有拐角半径。

,

这是你想要的吗?

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="100dp"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_centerInParent="true"
android:layout_marginTop="100dp"

xmlns:tools="http://schemas.android.com/tools"
    >
<com.google.android.material.card.MaterialCardView

    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginBottom="8dp"
    android:elevation="0dp"
    android:background="@drawable/round"
    app:cardCornerRadius="100dp"
    android:layout_marginLeft="20dp"
    android:layout_marginRight="20dp"
    app:contentPaddingTop="8dp"
    app:contentPaddingBottom="8dp"

    app:cardElevation="12dp">
</com.google.android.material.card.MaterialCardView>

<com.google.android.material.card.MaterialCardView
    android:layout_marginLeft="20dp"
    android:layout_marginRight="20dp"
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:layout_marginBottom="8dp"
        android:elevation="5dp"
        app:cardCornerRadius="5dp"
        app:contentPaddingTop="8dp"
        app:contentPaddingBottom="8dp"
        app:cardElevation="12dp"
      android:background="@drawable/round2">
    </com.google.android.material.card.MaterialCardView>


</RelativeLayout>

round.xml:-

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
<!-- you can use any color you want I used here gray color-->
<solid android:color="#80000000"/>
<corners android:radius="30dp"/>
 </shape>

round2.xml:-

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
<!-- you can use any color you want I used here gray color-->
<solid android:color="@color/colorAccent"/>
<corners android:radius="20dp"/>
</shape>

输出:-

enter image description here