Android layer實作圓角陰影

分析Android的采用layer-list效果實作圓角陰影背景

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

<!--    先整個背景設定為灰色，然後上層疊加一個白色的，bottom right進行偏移不去遮擋底部的layer-->
    <item
        android:left="3dp"
        android:top="3dp">
        <shape>
            <solid android:color="#b4b5b6" />
        </shape>
    </item>
    <item android:bottom="6dp" android:right="3dp">
        <shape>
            <solid android:color="#fff"/>
        </shape>
    </item>
    <item>
        <shape>
<!--            shape 使用solid的填充内部-->
<!--            <solid android:color="#0099CC" />-->

            <corners android:radius="50dp"/>
<!--            stroke描邊-->
            <stroke android:width="1dp" android:color="#000000"/>
        </shape>
    </item>
</layer-list>

複制

自帶預覽效果

我們看看怎麼使用

<TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:background="@drawable/layer_shape"
        android:gravity="center"
        android:minHeight="55dp"
        android:text="shape" />

複制

在drawable的那個layer布局xml中采用item的方式将各個圖形控制分開，依照層級堆疊

1 使用shape設定背景為gray，同時在left top留出3dp的空間，也就是進行偏移，其餘的空間部分塗成gray的顔色

<item
        android:left="3dp"
        android:top="3dp">
        <shape>
            <solid android:color="#b4b5b6" />
        </shape>
    </item>

複制

2 在1的上層添加一個shape塗成白色--bottom預留6dp，right預留3dp

<item android:bottom="6dp" android:right="3dp">
        <shape>
            <solid android:color="#fff"/>
        </shape>
    </item

複制

通過 1 2 我們可以可到一個右側和底部有陰影的暈的效果

3 在 12之上疊加在疊加一個shape---設定圓角半徑為50dp，stroke描邊寬為1dp

<item>
        <shape>
<!--            shape 使用solid的填充内部-->
<!--            <solid android:color="#0099CC" />-->

            <corners android:radius="50dp"/>
<!--            stroke描邊-->
            <stroke android:width="1dp" android:color="#000000"/>
        </shape>
    </item>

複制

Android layer實作圓角 陰影

Android layer實作圓角陰影