Android layer-list基本用法

layer-list 作为图层列表，原理是图层一层层的叠加，后添加的会覆盖先添加的，有点类似 RelativeLayout属性。在 layer-list 中可以通过控制后添加图层距离最底部图层的左、上、右、下的四个边距等属性，来得到不同的显示效果。

1. 圆环

效果图：

同心圆效果图

代码示例：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape
            android:dither="true"
            android:shape="oval">
            <solid android:color="#ffffff" />
            <stroke
                android:width="2dp"
                android:color="#ffaa00" />
        </shape>
    </item>

    <item
        android:bottom="10dp"
        android:left="10dp"
        android:right="10dp"
        android:top="10dp">
        <shape android:shape="oval">
            <solid android:color="#ff0000" />
            <size
                android:width="5dp"
                android:height="5dp" />
        </shape>
    </item>
</layer-list >

2. 单一边线

效果图：

单一边线效果图

代码示例：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <solid android:color="#0ea0ef"/>
        </shape>
    </item>

    <item android:top="1dp">
        <shape>
            <solid android:color="#fff"/>
        </shape>
    </item>
</layer-list>

3. 双边线

效果图：

双边线效果图

代码示例：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <solid android:color="#02a0ef"/>
        </shape>
    </item>

    <item android:bottom="1dp"
        android:top="1dp">
        <shape>
            <solid android:color="#fff"/>
        </shape>
    </item>
</layer-list>

4. 阴影

效果图：

阴影效果图

代码示例：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:left="3dp"
        android:top="6dp">
        <shape>
            <solid android:color="#b4b5b6" />
        </shape>
    </item>

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

5. 图片层叠

1）缩放层叠
效果图：

缩放层叠效果

代码示例：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!--默认缩放-->
    <item>
        <bitmap
            android:src="@drawable/ic_launcher"/>
    </item>

    <item android:left="30dp"
        android:top="30dp">
        <bitmap
            android:src="@drawable/ic_launcher"/>
    </item>

    <item android:left="50dp"
        android:top="50dp">
        <bitmap
            android:src="@drawable/ic_launcher"/>
    </item>
</layer-list>

2）不缩放层叠
效果图：

不缩放层叠效果

代码示例：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!--不缩放-->
    <item>
        <bitmap
            android:gravity="center"
            android:src="@drawable/ic_launcher" />
    </item>

    <item
        android:left="30dp"
        android:top="30dp">
        <bitmap
            android:gravity="center"
            android:src="@drawable/ic_launcher" />
    </item>

    <item
        android:left="50dp"
        android:top="50dp">
        <bitmap
            android:gravity="center"
            android:src="@drawable/ic_launcher" />
    </item>
</layer-list>