Layer-list介绍与使用

layer-list 其实就是将多个图片或两种效果按照顺序层叠起来

一. 用于叠加多个图片

实现方式如下：

第一步，在 drawable 文件夹中新建 xml 文件: img_layers.xml 代码如下：

<?xml version="1.0" encoding="utf-8"?>  <layer-list xmlns:android="http://schemas.android.com/apk/res/android">      <item>        <bitmap android:src="@drawable/android_red"          android:gravity="center" />      </item>      <item android:top="10dp" android:left="10dp">        <bitmap android:src="@drawable/android_green"          android:gravity="center" />      </item>      <item android:top="20dp" android:left="20dp">        <bitmap android:src="@drawable/android_blue"          android:gravity="center" />      </item>  </layer-list> 

第二步，在 layout 中调用，代码如下：

<ImageView      android:layout_height="wrap_content"      android:layout_width="wrap_content"      android:src="@drawable/img_layers" />  

第三步，效果图如下：

二. 用于叠加两个样式

实现方式如下：

第一步：上方圆角，下方直角的边框样式
在 drawable 文件夹下新建 xml 文件： top_circular_shape.xml ，代码如下：

<?xml version="1.0" encoding="UTF-8"?><layer-list xmlns:android="http://schemas.android.com/apk/res/android">    <item >        <shape>            <solid android:color="#FFFFFF" />            <corners android:topLeftRadius="10dp" android:topRightRadius="10dp"                android:bottomRightRadius="0.1dp" android:bottomLeftRadius="0.1dp"/>            <stroke android:width="1dp" android:color="#ffa8abad" />        </shape>    </item>    <item android:top="1dp" android:left="1dp" android:right="1dp" >        <shape>            <solid android:color="#FFFFFF" />            <corners android:topLeftRadius="10dp" android:topRightRadius="10dp"                android:bottomRightRadius="0.1dp" android:bottomLeftRadius="0.1dp" />            <stroke android:width="1dp" android:color="#ffffffff" />        </shape>    </item></layer-list>

第二步：中间矩形的的边框样式
在 drawable 文件夹下新建 xml 文件：rectangle_shape.xml ，代码如下：

<?xml version="1.0" encoding="UTF-8"?><layer-list xmlns:android="http://schemas.android.com/apk/res/android" >    <item>        <shape>            <solid android:color="#FFFFFF" />            <stroke                android:width="1dp"                android:color="#ffa8abad" />        </shape>    </item>    <item        android:left="1dp"        android:right="1dp"        android:top="1dp">        <shape>            <solid android:color="#FFFFFF" />            <stroke                android:width="1dp"                android:color="#ffffffff" />        </shape>    </item></layer-list>

第三步：下方圆角，上方直角的边框样式
在 drawable 文件夹下新建 xml 文件： bottom_circular_shape.xml ，代码如下：

<?xml version="1.0" encoding="UTF-8"?><layer-list xmlns:android="http://schemas.android.com/apk/res/android">    <item>        <shape>            <solid android:color="#FFFFFF" />            <corners android:topLeftRadius="0.1dp" android:topRightRadius="0.1dp"                android:bottomRightRadius="10dp" android:bottomLeftRadius="10dp" />            <stroke android:width="1dp" android:color="#ffa8abad" />        </shape>    </item>    <item android:top="1dp" android:bottom="1dp" android:left="1dp" android:right="1dp">        <shape>            <solid android:color="#FFFFFF" />            <corners android:topLeftRadius="0.1dp" android:topRightRadius="0.1dp"                android:bottomRightRadius="10dp" android:bottomLeftRadius="10dp" />            <stroke android:width="1dp" android:color="#ffffffff" />        </shape>    </item></layer-list>

第四步，实现效果如下：

博客借鉴

1. Android开发：shape和selector和layer-list的（详细说明）
2. 通过layer-list多图层叠加效果实现圆角功能