Android Drawable资源讲解之shape篇
分类:Android, Java
阅读 (2,201)
Add comments
1月 252017
运用好Android的drawable资源,在开发中就可以减少图片的使用量,这样既缩小了app的体积,也省去了设计图片的时间,而且也容易适配不同的屏幕尺寸。
今天首先来讲讲shape资源的使用。
1. Shape的属性介绍
shape共支持四种形状,在根节点通过android:shape=””来定义
rectangle | 方形 |
oval | 椭圆形 |
line | 线形,需要<stroke>节点来定义其属性 |
ring | 环形 |
我们常用的应该是rectangle和oval形状,我们上个图来看一下总体效果:
其中下面几个属性是环形时才会用到的:
android:innerRadius | 尺寸。环内部(中间的孔)的半径,以尺寸值或尺寸资源表示。 |
android:innerRadiusRatio | 浮点型。环内部的半径,以环宽度的比率表示。例如,如果 android:innerRadiusRatio=”5″,则内半径等于环宽度除以 5。此值被 android:innerRadius 覆盖。默认值为 9。 |
android:thickness | 尺寸。环的厚度,以尺寸值或尺寸资源表示。 |
android:thicknessRatio | 浮点型。环的厚度,表示为环宽度的比率。例如,如果 android:thicknessRatio=”2″,则厚度等于环宽度除以 2。此值被 android:innerRadius 覆盖。默认值为 3。 |
android:useLevel | 布尔值。如果这用作 LevelListDrawable,则此值为“true”。这通常应为“false”,否则形状不会显示。当我们要设计一个圆形时必须设置它为false。 |
2.子节点之实色填充效果
solid节点可以实现形状的填充效果,通过android:color属性设置颜色值,如下示例:
1 2 3 4 5 6 |
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <solid android:color="#aa33aa"></solid> </shape> |
3.子节点之渐变填充效果
gradient节点可以实现渐变的填充效果,示例如下:
1 2 3 4 5 6 7 8 9 10 11 12 |
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <gradient android:startColor="#ccddee" android:endColor="#33ddee" android:centerColor="#eedd33" android:angle="90" android:centerX="0.4" android:centerY="0.4" android:type="linear"></gradient> </shape> |
4.子节点之实现边框效果
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <gradient android:startColor="#ccddee" android:endColor="#33ddee" android:centerColor="#eedd33" android:angle="90" android:centerX="0.4" android:centerY="0.4" android:type="linear"></gradient> <stroke android:color="#aaaaaa" android:width="2dp" android:dashGap="2dp" android:dashWidth="2dp"></stroke> </shape> |
各个属性值的解释:
android:color | 线框的颜色 |
android:width | 线框的宽度 |
android:dashGap | 如果画虚线框,虚线框的间隙 |
android:dashWidth | 如果画虚线框,虚线框的宽度 |
5.子节点之实现圆角效果
为了美观,我们在画按钮时都会给按钮背影加个圆角效果,在shape里可以通过corner节点来实现圆角效果,如下所示:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <gradient android:startColor="#ccddee" android:endColor="#33ddee" android:centerColor="#eedd33" android:angle="90" android:centerX="0.4" android:centerY="0.4" android:type="linear"></gradient> <stroke android:color="#aaaaaa" android:width="1dp"></stroke> <corners android:radius="6dp"></corners> </shape> |
radius用于设置圆角的半径大小,也可以通过android:topLeftRadius,android:topRightRadius,android:bottomLeftRadius,android:bottomRightRadius分别设置四个角的圆角半径大小,比如在实现tab标签头部按钮时,我们可能只需要为左上和右上角设置圆角效果。比如还可以实现一些特殊形状的导航按钮等等。
6.padding节点
padding节点用于设置形状相对于四边的内部间距,可以用于在layer-list中设置阴影的效果。