学而实习之 不亦乐乎

Android:LayerDrawable资源

2022-07-17 10:46:31

与 StateListDrawable 类似,LayerDrawable 也可以包含一个 Drawable 数组,因此系统将会按这些 Drawable 对象的数组顺序来绘制它们,索引最大的 Drawable 对象将会被绘制在最上面,可以通过将 drawable 摆放到不同位置来达到一些特殊的叠加效果。

一、使用简介

XML文件根元素为<layer-list>,可以包含多个<item>元素,该元素是一种层次化的drawable集合,可以指定下列属性:

  • android:drawable:指定作为LayerDrawable元素之一的Drawable对象。
  • android:id:指定一个标识
  • android:buttom|top|left|button:指定一个长度值,用于指定将该Drawable对象绘制到目标组件的指定位置。

语法格式

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <!--指定特定状态下的颜色-->
    <item android:id="@+id/background" android:drawable="@drawable/grow" />
    <item android:id="@+id/progress" android:drawable="@drawable/ok" />
</layer-list>
<?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" android:gravity="center" />
    </item>
    <item android:top="25dp" android:left="25dp">
        <bitmap android:src="@drawable/ic_launcher" android:gravity="center" />
    </item>
    <item android:top="50dp" android:left="50dp">
        <bitmap android:src="@drawable/ic_launcher" android:gravity="center" />
    </item>
</layer-list>

二、实例

1.按钮阴影效果

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- layer-list设置图层效果:每一个item是一张图层,从下往上叠放 -->
    <!-- item前景层-->
    <item
        android:left="2dp"
        android:top="2dp">
        <shape>
            <gradient
                android:angle="45"
                android:endColor="#66ffd87c"
                android:startColor="#6696CDCD"
                android:type="linear" />
            <corners android:radius="10dp" />
        </shape>
    </item>
    <!-- item预览层-->
    <!-- 这层item会覆盖在之前上一层的item之上,会产生叠加的效果。-->
    <item
        android:bottom="2dp"
        android:right="2dp">
        <shape>
            <solid android:color="@android:color/white" />
            <corners android:radius="10dp" />
        </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 android:shape="rectangle">
            <solid android:color="#0ac39e" />
        </shape>
    </item>
    <!-- 第二层,当前drawable为一个纯白色,相对view底部6dp外间距。-->
    <item android:bottom="6dp">
        <shape android:shape="rectangle">
            <solid android:color="#ffffff" />
        </shape>
    </item>
    <!--第三层,当前drawable为一个纯白色,相对view下,左,右各1dp的外间距。-->
    <item
        android:bottom="1dp"
        android:left="1dp"
        android:right="1dp">
        <shape android:shape="rectangle">
            <solid android:color="#ffffff" />
        </shape>
    </item>
</layer-list>