Android中,为了方便开发者对一些比较复杂的绘制效果进行处理,提供了一个非常实用的绘图工具——layer-list,它可以将多种Drawable或图形组合起来,形成多层次的绘制效果,极大地为开发者提高绘制效率和精度。
什么是layer-list
layer-list是Android中的一种Drawable类型,它可以将多个Drawable或图形组合在一起,形成一个图层堆叠的效果。
可以通过在XML文件中定义一个layer-list来使用它,如下所示:
<!-- 定义一个layer-list -->
<layer-list xmlns:android=\"http://schemas.android.com/apk/res/android\">
<item>
<shape android:shape=\"rectangle\">
<solid android:color=\"#FF0000\" />
</shape>
</item>
<item>
<shape android:shape=\"rectangle\">
<solid android:color=\"#00FF00\" />
</shape>
<rotate android:fromDegrees=\"45\">
<shape android:shape=\"rectangle\">
<solid android:color=\"#0000FF\" />
</shape>
</rotate>
</item>
</layer-list>
上面的代码就定义了一个layer-list,其中有两个子元素(<item>),第一个子元素<shape>代表一个矩形,颜色为红色;第二个子元素内部又包含了两个子元素,第一个代表一个矩形,颜色为绿色,第二个经过旋转后代表一个矩形,颜色为蓝色。
layer-list的属性及使用
layer-list的属性比较多,这里列举其中一些常用的,方便使用时进行参考。
1. android:padding
表示整个layer-list的padding值。例如,设置了android:padding=\"10dp\",则整个layer-list的四边各增加10dp的padding。
2. android:opacity
true表示整个layer-list的透明度与子元素透明度相乘得到,false表示整个layer-list透明度独立设置。默认值为true。
3. android:gravity
表示子元素的位置。子元素会在layout_width和layout_height所指定的圆形内部摆放,可以通过layout_gravity属性改变摆放位置。常见的摆放属性有:
<item
android:drawable=\"@drawable/test1\"
android:gravity=\"center\"
android:width=\"50dp\"
android:height=\"50dp\"/>
表示将test1居中放置,宽为50dp,高为50dp
4. android:height和android:width
表示整个layer-list的宽度和高度。设置该属性将会覆盖其中所有子元素的宽度和高度。
除了上述属性外,layer-list还有一些其他属性可以进行配置,可以根据实际需求选择使用。另外,在layer-list中,还可以使用其他Drawable类型,如Shape,Bitmap等。
layer-list的使用场景
layer-list非常适合用于处理多层次的绘制效果,例如Android中的图标、按钮等。下面以按钮为例,详细讲解如何使用layer-list创建多层次的绘制效果。
使用layer-list制作按钮
对于一个按钮而言,它需要有背景和前景两部分。背景通常是一个圆角矩形,前景则为按钮上的文字。其实,这样的效果可以通过layer-list来实现,具体代码如下:
<!-- 定义一个背景 -->
<layer-list xmlns:android=\"http://schemas.android.com/apk/res/android\">
<item>
<shape android:shape=\"rectangle\">
<corners android:radius=\"10dp\" />
<solid android:color=\"#FFA500\" />
</shape>
</item>
</layer-list>
上述代码定义了一个圆角矩形背景,颜色为橙色。该背景所包含的属性如下:
1. android:shape=\"rectangle\"
表示该Drawable类型为矩形。
2. <corners android:radius=\"10dp\" />
圆角属性,用于设置圆角半径。本例设置10dp。
3. <solid android:color=\"#FFA500\" />
填充颜色属性,将矩形填充为橙色。
定义好了背景,接下来就是利用layer-list将背景和前景组合起来,形成一个完整的按钮。具体代码如下:
<!-- 定义一个按钮 -->
<layer-list xmlns:android=\"http://schemas.android.com/apk/res/android\">
<item>
<!-- 背景 -->
<item>
<shape android:shape=\"rectangle\">
<corners android:radius=\"10dp\" />
<solid android:color=\"#FFA500\" />
</shape>
</item>
</item>
<item>
<!--前景-->
<shape android:shape=\"rectangle\">
<corners android:radius=\"10dp\" />
<solid android:color=\"#F8F8FF\" />
</shape>
<item>
<bitmap android:src=\"@drawable/icon\" />
<!-- 图片资源 -->
<!-- 矩形内的偏移量,横向和纵向都是20dp -->
<padding android:left=\"20dp\" android:top=\"20dp\" android:right=\"20dp\" android:bottom=\"20dp\" />
</item>
</item>
</layer-list>
上述代码定义了一个按钮,这个按钮由背景和前景两部分组成。其中,背景使用的是上文定义的圆角矩形,颜色为橙色;前景部分实际上是一个颜色为白色的矩形,同时,里面包含了一个bitmap类型的图像作为按钮的图标。
除了上述两部分之外,还需要注意以下几点:
1. 需要在前景部分内使用<item>来放置位图。
2. 在前景drawable中添加padding属性可以让位图距可点击部分留有一定的空白区域。
3. 在Android中的按钮、TextView等部件中,经常需要设置其点击状态表现。通过在layer-list外包裹一个selector标签可以让button可以有点击状态效果。
最后,图1是我们使用layer-list制作的按钮效果图:
<?xml version=\"1.0\" encoding=\"utf-8\"?>
<selector xmlns:android=\"http://schemas.android.com/apk/res/android\">
<item android:drawable=\"@drawable/button_pressed\">
</item>
<item android:drawable=\"@drawable/button_normal\">
</item>
<item android:drawable=\"@drawable/button_selected\">
</item>
</selector>
这是一个简单的在按钮中实现选中、点击、默认三种状态的实现方法。