Android 使用xml实现边框阴影，背景渐变效果（附有RGB颜色查询对照表）

上图是显示效果，下面是代码实现：

个人理解就是使用layer-list实现两层view的叠加，其中top，left，bottom，left控制阴影

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

    <!--阴影-->
    <item
        android:left="6dp"
        android:top="6dp"
        >
        <shape android:shape="rectangle">
            <gradient
                android:angle="270"
                android:endColor="#0eeeef00"
                android:startColor="#0eeeef00"/>

            <corners
                android:bottomLeftRadius="6dip"
                android:bottomRightRadius="6dip"
                android:topLeftRadius="6dip"
                android:topRightRadius="6dip"/>
        </shape>
    </item>
    <!--阴影-->

    <!--白色背景-->
    <item
        android:left="8dp"
        android:top="8dp"
        android:bottom="4dp"
        android:right="4dp">

        <shape android:shape="rectangle">
            <gradient
                android:angle="270"
                android:endColor="#FFFFFF"
                android:startColor="#FFFFFF"/>

            <corners
                android:bottomLeftRadius="6dip"
                android:bottomRightRadius="6dip"
                android:topLeftRadius="6dip"
                android:topRightRadius="6dip"/>
        </shape>
    </item>

</layer-list>

渐变就是利用

gradient的属性endcolor和startcolor，centercolor来控制颜色的不同

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

    <item
        android:left="6dp"
        android:top="6dp"
        >
        <shape android:shape="rectangle">
            <gradient
                android:startColor="#FFFF0000"
                android:endColor="#80FF00FF"
                android:centerColor="#80ffff00"
                android:angle="270"/>

            <corners
                android:bottomLeftRadius="6dip"
                android:bottomRightRadius="6dip"
                android:topLeftRadius="6dip"
                android:topRightRadius="6dip"/>
        </shape>
    </item>

</layer-list>