Android: box shadow和border radius布局

Question

我想要 box shadow 和 radius 如下图，但在 android box shadow 中不起作用

如何使用 xml 解决这个问题？

Answer 1

对于角落，您必须使用 drawable，如下所示：

<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
>

<!-- view border color and width -->
<stroke
    android:width="1dip"
    android:color="#a4a2a2" >
</stroke>

<corners android:radius="180px">

</corners>
<!-- Here is the corner radius -->

关于阴影

我想你的意思是android:elevation="8dp"

<Yourbox
android:width="match_parent"
android:height="match_parent"
....
android:elevation="8dp"
android:layout_gravity="center"
..
/>

Answer 2

您可以将此形状设置为任何视图的背景

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- Drop Shadow Stack -->
    <item>
        <shape>
            <corners android:radius="4dp" />

            <padding
                android:bottom="1dp"
                android:left="1dp"
                android:right="1dp"
                android:top="1dp" />

            <solid android:color="#00CCCCCC" />
        </shape>
    </item>
    <item>
        <shape>
            <corners android:radius="4dp" />

            <padding
                android:bottom="1dp"
                android:left="1dp"
                android:right="1dp"
                android:top="1dp" />

            <solid android:color="#10CCCCCC" />
        </shape>
    </item>
    <item>
        <shape>
            <corners android:radius="4dp" />

            <padding
                android:bottom="1dp"
                android:left="1dp"
                android:right="1dp"
                android:top="1dp" />

            <solid android:color="#20d5d5d5" />
        </shape>
    </item>
    <item>
        <shape>
            <corners android:radius="6dp" />

            <padding
                android:bottom="1dp"
                android:left="1dp"
                android:right="1dp"
                android:top="1dp" />

            <solid android:color="#30cbcbcb" />
        </shape>
    </item>
    <item>
        <shape>
            <corners android:radius="4dp" />

            <padding
                android:bottom="1dp"
                android:left="1dp"
                android:right="1dp"
                android:top="1dp" />

            <solid android:color="#50bababa" />
        </shape>
    </item>

    <!-- Background -->
    <item>
        <shape>
            <solid android:color="@color/gray_100" />

            <corners android:radius="4dp" />
        </shape>
    </item>

</layer-list>

Answer 3

    <?xml version="1.0" encoding="utf-8"?>
<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="270dp"
    android:layout_height="130dp"
    android:layout_margin="15dp"
    android:translationZ="4dp"
    app:cardCornerRadius="6dp"
    app:cardElevation="0dp">
    .....
</androidx.cardview.widget.CardView>

只用translationZ

Android: box shadow和border radius布局

Android: box shadow and border radius layout

xml

android

box-shadow