style-drawable

  • 普通图片:涉及手机分辨率,适配问题
  • bitmap可以对图片做一些设置,如:平铺,拉伸或者保持原始大小,图片的对齐方式
  • nine-patch(点九图片)
  • color标签
  • insert标签:设置drawable边距,与viewpadding类似,padding只可以设置内容与边界距离,insert可以设置背景
  • clip标签:可以对drawable进行裁剪,做进度条时比较有用,level设置
  • scale标签:可以对drawable进行缩放,level设置
  • level-list标签:当需要在一个view中显示不同的图片时,如手机剩余电量显示不同的图片
  • transition标签:提供了两层drawable之间的切换方法,且只可以存在两层,即两个item
  • rotate标签:可以对drawable进行旋转,是静态的
  • animation-list标签:可以将一系列的drawable构建成帧动画
  • animated-rotate标签:让drawable不停的旋转

 

1、普通图片

图片是最常用的drawable资源,格式包括:png(推荐)、jpg(可接受)、gif(不建议)。用图片资源需要根据不同屏幕密度提供多张不同尺寸的图片,它们的关系如下表:

密度分类

密度值范围

代表分辨率

图标尺寸

图片比例

ldpi

 

 

 

 

mdpi

120~160dpi

320x480px

48x48px

1

hdpi

160~240dpi

480x800px

72x72px

1.5

xhdpi

240~320dpi

720x1280px

96x96px

2

xxhdpi

320~480dpi

1080x1920px

144x144px

3

xxxhdpi

480~640dpi

1440x2560px

192x192px

4

切图工具,可以让切图变得简单,这里推荐两款:Cutterman和Cut&Sliceme,都是Photoshop下的插件,输出支持android、ios和web三种平台。

 

2、bitmap

可以对图片做一些设置,如:平铺,拉伸或者保持原始大小,图片的对齐方式,以下是属性:

android:src必填,指定的图片资源,只能是图片

android:gravity设置图片的对齐方式,如在layer-list中,默认会尽量填满整个视图,导致图片被拉伸,为避免这种情况可以设置对齐方式,可以设置多个用“|”分隔

  • top:图片放在容器顶部,不改变图片的大小
  • bottom:图片放在容器底部,不改变图片的大小
  • left:图片放在容器左侧,不改变图片大小
  • right:图片放在容器右侧,不改变图片大小
  • center:图片放在容器中间,包括水平和垂直方向,不改变图片大小
  • center_vertical:图片放在容器垂直方向的中心位置,不改变图片大小
  • center_horizontal:图片放在容器水平方向的中心位置,不改变图片大小
  • fill:拉伸整张图片以填满整个容器的宽和高,默认值
  • fill_vertical:在垂直方向上拉伸图片以填满整个容器的高度
  • fill_horizontal:在水平方向上拉伸图片以填满整个容器的宽度
  • clip_vertical:附加选项,裁剪基于垂直方向的gravity设置,设置top时裁剪底部,设置bottom时裁剪顶部
  • clip_horizontal:附加选项,裁剪基于水平方向的fravity设置,设置left时裁剪右侧,设置right时裁剪左侧

android:antialias设置是否开启抗锯齿

android:dither设置是否抖动,图片与屏幕的像素配置不同时会用到,如图片设置的是ARGB8888,而屏幕是RGB565

android:filter设置是否允许对图片进滤波,对图片进行收缩或者延展使用滤波可以获得平滑的外观效果

android:tint给图片着色,比如图片本来是黑色的,着色后变成白色的

android:tintMode着色模式,API Level最低要求21

android:tileMode设置图片的平铺方式,去下面的字四个值之一

  • disable 不做任何处理,默认值
  • repeat 图片重复铺满
  • mirror 使用交替镜像的方式重复图片的绘制
  • clamp 复制图片边缘的颜色来填充容器剩下的空白,如引入图片是白色边缘,那图片所在容器里除了图片都被填充成白色

android:tileModeX和tileMode一样,设置图片平铺方式,这个属性只设置水平方向的平铺,API Level最低要求21

android:tileModeY和tileMode一样,设置图片平铺方式,这个属性只设置垂直方向的平铺,API Level最低要求21

android:alpha设置图片的透明度,取值范围0.0~1.0,0.0表示全透明,1.0表示为不透明,API Level最低要求11

android:mipmap设置是否可以使用mipmap,但API Level最低要求17

android:autoMirrored设置图片是否需要镜像反转,当布局方向是RTL,即从左到右布局时有效,API Level最低要求19

 

3、nine-patch(点九图片)

android:src必填,必须是.9类型的图片

android:dither设置是否抖动,图片与屏幕的像素配置不同时会用到,如图片是ARGB8888,而屏幕是RGB565

android:tint给图片着色,如图片原来是黑色的,着色后变成白色

android:tintMode着色模式,API Level最低要求21

android:alpha设置图片的透明度,取值范围0.0~1.0,0.0为全透明,1.0为不透明,API Level 最低要求11

android:autoMirrored设置图片是否需要镜像反转,当布局方向为RTL时(从右到左)时才有用,API Level 最低要求19

 

4、color标签-基本不用

 

5、insert标签

可以设置drawable的边距,使用方法与view的padding类似,不过padding只可以设置内容与边界的距离,insert可以设置背景drawable与view之间的边距,具体属性如下:

android:drawable指定drawable资源,如果不设置该属性,也可以定义drawable类型的子标签

android:visible设置初始的可见性,默认值false

android:insetLeft左边距

android:insetRight右边距

android:insetTop顶部边距

android:insetBottom底部边距

android:inset设置统一边距,会覆盖上面4个属性,但API Level最低要求21

 

6、clip标签

可以对drawable进行裁剪,做进度条时比较有用,可以通过设置level的值控制裁剪的多少,level取值范围是0~10000,默认值是0,表示完全裁剪,图片不可见,10000表示完全不裁剪,完整图片可见。以下是clip的可设置的属性:

android:drawable指定drawable资源,如果不设置该属性,也可以定义drawable类型的子标签

android:clipOrientation设置裁剪的方向,取值为下面的2个之一:

  • horizontal 在水平方向上进行裁剪,条状的进度条就是水平裁剪
  • vertical 在垂直方向上进行裁剪

android:gravity设置裁剪的位置,可以取值如下,多个值用“|”分隔

  • top:图片放在容器的顶部,不改变图片大小,当裁剪方向为vertical时,裁掉图片底部
  • bottom:图片位于容器的底部,不改变图片大小,当裁剪方向为vertical时,裁掉图片顶部
  • left:图片位于容器的左侧,不改变图片大小,默认值,当裁剪方向为horizantal时,裁掉图片右侧
  • right:图片位于容器的右侧,不改变图片大小,当裁剪方向为horizantal时,裁掉图片左侧
  • center:图片位于容器的中心位置,包括水平和垂直方向,不改变图片大小,当裁剪方向为horizontal时,裁掉图片左右两侧,当裁剪方向为vertical时,裁掉图片上下两侧
  • center_vertical:图片位于容器的垂直方向中心位置,不改变图片大小,裁剪和center时一样
  • center_horizantal:图片位于容器的水平方向中心位置,不改变图片大小,裁剪和center时一样
  • fill:拉伸整张图片,使其充满整个容器的宽和高,图片不会被裁剪,除非level设置为0,此图片不可见
  • fill_vertical:在垂直方向上拉伸,使其充满容器的整个高度,当裁剪方向为vertical时,图片不会被裁剪,除非level设置为0,此时图片不可见
  • fill_horizontal 在水平方向上拉伸,其实充满容器的整个宽度,当裁剪方向horizontal时,图片不会被裁剪,除非level设置为0,此时图片不可见
  • clip_vertical:附加选项,裁剪基于垂直方向的gravity设置,设置top时会裁剪底部,设置bottom时会裁剪顶部,其他情况同时裁剪顶部和底部
  • clip_horizontal:附加选项,裁剪基于水平方向的gravity设置,设置left时会裁剪右侧,设置right时会裁剪左侧,其他情况同时裁剪左右两侧

level的设置在xml中没有直接提供属性,需要在代码中设置

代码示例:

1.定义clip.xml

"1.0"encoding="utf-8"?>

xmlns:android="http://schemas.android.com/apk/res/android"

android:clipOrientation="horizontal"

android:drawable="@drawable/img4clip"

android:gravity="left" />

2.在ImageView中引用:

android:id="@+id/img"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:background="@drawable/bg_img"

android:src="@drawable/clip" />

3.在代码中设置level:

ImageView img = (ImageView) findViewById(R.id.img);

img.getDrawable().setLevel(5000);// level设置范围0~10000

 

7、scale标签

使用scale标签可以对drawable进行缩放,和clip一样,通过设置level控制缩放比例

android:drawable指定drawable的资源,若不设置该属性,可以定义drawable类型的子标签

android:scaleHeight设置可以缩放的高度,用百分比表示,格式为xx%,0%表示不做任何缩放,50%表示只能缩放一半

android:scaleWidth设置可以缩放的宽度,用百分比表示,格式为xx%,0%表示不做任何缩放,50%表示只能缩放一半

android:scaleGravity设置drawable缩放后的位置,取值与bitmap标签一样,默认值是left

android:useIntrinsicSizeAsMinimum设置drawable原尺寸作为最小尺寸,设置为true时,缩放基本无效,API Level最低为11

用法与clip一样:

1. 定义scale.xml:

"1.0"encoding="utf-8"?>

xmlns:android="http://schemas.android.com/apk/res/android"

android:drawable="@drawable/img4scale"

android:scaleGravity="left"

android:scaleHeight="50%"

android:scaleWidth="50%"

android:useIntrinsicSizeAsMinimum="false" />

2. 在ImageView中引用:

android:id="@+id/img"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:background="@drawable/bg_img"

android:src="@drawable/scale" />

3. 在代码中设置level:

ImageView img = (ImageView) findViewById(R.id.img);

img.getDrawable().setLevel(5000);//level范围值0~10000

 

8、level-list标签

当需要在一个view中显示不同的图片时,如手机剩余电量显示不同的图片,level-list就可以使用了,level-list可以管理一组drawable,每个drawable设置一组level范围,最中会根据level值选取对应的drawable绘制,通过对其子标签的item设置drawable实现,item的属性有三个:

android:drawable 指定drawable资源,如果不设置该属性,也可以定义drawable类型的子标签

android:minLevel item的最小level

android:maxLevelitem的最大level

代码示例:

"1.0"encoding="utf-8"?>

xmlns:android="http://schemas.android.com/apk/res/android">

android:drawable="@drawable/battery_low"

android:maxLevel="10"

android:minLevel="0" />

android:drawable="@drawable/battery_below_half"

android:maxLevel="50"

android:minLevel="10" />

android:drawable="@drawable/battery_over_half"

android:maxLevel="99"

android:minLevel="50" />

android:drawable="@drawable/battery_full"

android:maxLevel="100"

android:minLevel="100" />

那么,当电量剩下10%时则可以设置level值为10,将会匹配第一张图片:

img.getDrawable().setLevel(10);

item的匹配规则是从上到下匹配,当设置的level值与前面的itemlevel范围匹配时,则采用,一般item的添加按maxLevel从小到达排序,此时的minLevel可以不用指定也能匹配,因此上述代码可以简化为:

"1.0" encoding="utf-8"?>

<level-listxmlns:android="http://schemas.android.com/apk/res/android">

android:drawable="@drawable/battery_low"

android:maxLevel="10" />

android:drawable="@drawable/battery_below_half"

android:maxLevel="50" />

android:drawable="@drawable/battery_over_half"

android:maxLevel="99" />

android:drawable="@drawable/battery_full"

android:maxLevel="100" />

但是不可以反过来讲maxLevel="100"item放在最前面,那样所有的电量都只能匹配第一条了

 

9、transition标签

transition其实是继承自layer-list,只是,transition只能管理两层的drawable,另外提供了两层drawable之间的切换方法,切换时有淡入淡出效果

示例代码:

"1.0"encoding="utf-8"?>

xmlns:android="http://schemas.android.com/apk/res/android">

android:drawable="@drawable/on" />

android:drawable="@drawable/off" />

transition标签生成的Drawable对应的类为TransitionDrawable,要切换时,需要主动调用TransitionDrawabledstartTransition()方法,参数为动画的毫秒数,也可以调用reverseTransition()方法逆向切换。

((TransitionDrawable)drawable).startTransition(500);//正向切换,即从第一个drawable切换到第二个

((TransitionDrawable)drawable).recerseTransition(500);//逆向切换,即从第二个drawable切换到第一个

 

10、rotate标签

使用rotate标签可以对drawable进行旋转,在shape中讲环形时使用到了rotate,另外如果一张向上箭头的图片,还需要向下的箭头时,可以使用rotate进行反转,具体属性如下:

android:drawable 指定的drawable资源,如果不设置该属性,可以定义drawable类型的子标签

android:fromDegrees 起始的角度度数

android:toDegrees 结束的角度度数,正数表示顺时针,负数表示逆时针

android:pivotX 旋转中心的X坐标,浮点数或百分比。

浮点数表示相对于drawable的左边缘距离单位为px,如5

百分比表示相对于drawable的左边缘距离按百分比计算,如5%

另外一种百分比表示相对于富容器的左边缘,如5%p,一般设置为50%表示在drawable中心

android:pivotY 旋转中心点Y坐标

android:visible 初始的可见性状态,默认false

示例代码,将一张向上的箭头图片旋转180°,成为一张向下的箭头:

"1.0"encoding="utf-8"?>

xmlns:android="http://schemas.android.com/apk/res/android"

android:drawable="@drawable/ic_arrow"

android:fromDegrees="0"

android:pivotX="50%"

android:pivotY="50%"

android:toDegrees="180" />

注意:

将它引用到ImageView里,发现图片根本没有转变。其实,要让它可以旋转,还需要设置level值。level取值范围为0~10000,应用到rotate,则与fromDegrees~toDegrees相对应,如上面例子的角度范围为0~180,那么,level取值0时,则旋转为0度;level为10000时,则旋转180度;level为5000时,则旋转90度。因为level默认值为0,所以图片没有转变。那么,我们想转180度,其实可以将fromDegrees设为180,而不设置toDegrees,这样,不用再在代码里设置level图片就可以旋转180了。

 

11、animation-list标签

annimation-list可以将一系列的drawable构建成帧动画,即将一个个drawable,一帧一帧的播放,通过添加item子标签设置每一帧使用的drawable资源,以及每帧的持续时间。

示例代码:

"1.0"encoding="utf-8"?>

xmlns:android="http://schemas.android.com/apk/res/android"

android:oneshot="false">

android:drawable="@drawable/anim1"

android:duration="1000" />

android:drawable="@mipmap/anim2"

android:duration="1000" />

android:drawable="@mipmap/anim3"

android:duration="1000" />

android:oneshot属性设置是否循环播放,true时,只播放一轮结束,false时,会轮询播放

android:duration属性设置该帧的持续时间,以毫秒数为单位

animation-list对应的Drawable类为AnimationDrawable,要让动画运行起来,需要主动调用AnimationDrawable的start()方法,另外在onCreate()方法中直接调用start()方法无效,因为view还没有初始化完成,播放不了动画

 

12、animated-rotate标签

rotate标签可以将原有的drawable转个角度编程另一个drawable,是静态的,而animated-rotate则是让drawable不停的旋转,其属性有4个,具体如下:

android:drawable指定drawable资源,不设置该属性可以定义drawable类型的子标签

android:pivotX旋转中心的X坐标

android:pivotY旋转中心的Y坐标

android:visible设置初始的可见性状态,默认值false

示例代码:

"1.0"encoding="utf-8"?>

xmlns:android="http://schemas.android.com/apk/res/android"

android:drawable="@drawable/img_daisy"

android:pivotX="50%"

android:pivotY="50%"

android:visible="false" />

 

PS:selector标签下的item其实还可以添加set标签,这是添加动画集的标签。

你可能感兴趣的:(Android)