Android样式研究

概述

今天我们来探究一下android的样式。
其实,几乎所有的控件都可以使用 background属性去引用自定义的XML样式,所以研究样式显得特别重要。
先来看一段样式代码:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape
            android:innerRadiusRatio="10"
            android:shape="ring"
            android:thicknessRatio="9"
            android:useLevel="false">
            <stroke
                android:width="1dp"
                android:color="@android:color/black" />
        </shape>
    </item>
</selector>

说一下一些基本的知识:(我也是刚刚才知道的)

<?xml version="1.0" encoding="utf-8"?>

  • 这个是声明了XML的版本信息为1.0,字符编码为UTF-8

(一)selector的内属性

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

  • 这个是XML的命名空间,也就是有了它,你可以 alt+/ 作为提示,不该输入什么,什么是对的,什么是错的。

android:visiable

  • true设置该效果改样式可见

android:autoMirrored

  • true设置单行显示,例如是TextView有多行文字,那么只显示一行,后面显示...

android:constantSize

  • 这个是布尔型,false表示各个状态的大小(size)各自不同,true表中所有的状态大小相同(以最大的为准)。默认为false

android:dither

  • 图像的抖动处理,当每个颜色值以低于8位表示时,对应图像做抖动处理可以实现在可显示颜色总数比较低(比如256色)时还保持较好的显示效

android:enterFadeDuration

  • 表示样式淡入的时间,毫秒

android:exitFadeDuration

  • 表示样式淡出的时间,毫秒

android:variablePadding

  • 布尔型。选择true时,drawable的内边距会根据状态的变化而变化,设置为true时,你必须为不同的状态配置layout,但是通常不建议这么做。选择false时,内边距保持一致,所有状态中最大的内边距。默认为false

(二)selector下的标签:item标签的内属性

selector标签下只有item标签。item的标签内属性如下:都是设置控件在什么状态下的样式:

android:drawable 需要入别的xml,默认是背景图片

android:state_above_achor

android:state_accelerated 硬件加速true时的效果

android:state_activated true被激活时的效果,false未激活时的效果

android:state_active true激活后的效果

android:state_checkable true,当CheckBox能使用时显示该图片

android:state_checked true,当CheckBox选中时显示该图片

android:state_drag_can_accept true 能够 drag 拖拽时图片

android:state_drag_hovered true 能够 drag 鼠标指针移动到该位置图片

android:state_empty

android:state_enabled true,当该组件能使用时显示该图片

android:state_expanded

android:state_first

android:state_focused true非触摸模式下获得焦点时显示图片

android:state_hovered 鼠标移动到该位置时的样式

android:state_last

android:state_long_pressable 长按的样式

android:state_middle

android:state_multiline

android:state_pressed 按下的样式

android:state_selected 选择时的样式

android:state_single true 只有一个元素显示图片

android:state_window_focused 当此activity获得焦点在最前面时显示该图片

(三)item下的标签

  • color 设置颜色
  • animated-rotate
  • animated-selector
  • animation-list
  • bitmap
  • clip
  • inset
  • layer-list
  • level-list
  • nine-patch
  • ripple
  • rotate
  • scale
  • selector
  • set
  • shape
  • transition

(1)shape标签

标签内属性:

  • visible 是否可见
  • dither 图像的抖动处理,当每个颜色值以低于8位表示时,对应图像做抖动处理可以实现在可显示颜色总数比较低(比如256色)时还保持较好的显示效果
  • innerRadius
  • innerRadiusRatio
  • shape 指定画的图形(常用)
  • thickness
  • thicknessRatio
  • useLevel

(A)shape=rectangle: 矩形,默认的形状,可以画出直角矩形、圆角矩形、弧形等

  • solid: 设置形状填充的颜色,只有android:color一个属性

    • android:color 填充的颜色
  • padding: 设置内容与形状边界的内间距,可分别设置左右上下的距离

    • android:left 左内间距
    • android:right 右内间距
    • android:top 上内间距
    • android:bottom 下内间距
  • gradient: 设置形状的渐变颜色,可以是线性渐变、辐射渐变、扫描性渐变

    • android:type 渐变的类型
      • linear 线性渐变,默认的渐变类型
      • radial 放射渐变,设置该项时,android:gradientRadius也必须设置
      • sweep 扫描性渐变
    • android:startColor 渐变开始的颜色
    • android:endColor 渐变结束的颜色
    • android:centerColor 渐变中间的颜色
    • android:angle 渐变的角度,线性渐变时才有效,必须是45的倍数,0表示从左到右,90表示从下到上
    • android:centerX 渐变中心的相对X坐标,放射渐变时才有效,在0.0到1.0之间,默认为0.5,表示在正中间
    • android:centerY 渐变中心的相对X坐标,放射渐变时才有效,在0.0到1.0之间,默认为0.5,表示在正中间
    • android:gradientRadius 渐变的半径,只有渐变类型为radial时才使用
    • android:useLevel 如果为true,则可在LevelListDrawable中使用
  • corners: 设置圆角,只适用于rectangle类型,可分别设置四个角不同半径的圆角,当设置的圆角半径很大时,比如200dp,就可变成弧形边了

    • android:radius 圆角半径,会被下面每个特定的圆角属性重写
    • android:topLeftRadius 左上角的半径
    • android:topRightRadius 右上角的半径
    • android:bottomLeftRadius 左下角的半径
    • android:bottomRightRadius 右下角的半径
  • stroke: 设置描边,可描成实线或虚线。

    • android:color 描边的颜色
    • android:width 描边的宽度
    • android:dashWidth 设置虚线时的横线长度,0为实线
    • android:dashGap 设置虚线时的横线之间的距离,即虚线的间隔大小
  • size:设置组件大小

    • android:width 组件宽
    • android:height 组件高

矩形

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <solid android:color="#0ee"/>
    <corners android:radius="20dp"/>
    <size android:width="100dp" android:height="100dp"/>
    <stroke android:width="2dp" android:color="#000"/>
</shape>
image

圆形

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <solid android:color="#0ee"/>
    <corners android:radius="50dp"/>
    <size android:width="100dp" android:height="100dp"/>
    <stroke android:width="2dp" android:color="#000"/>
</shape>
image

(B)shape=oval: 椭圆形,用得比较多的是画正圆

主要是通过设置padding和size去实现圆的大小,扁正。

  • corners 圆角
  • gradient 渐变色
  • padding 内边距
  • size 组件大小
  • solid 设置形状填充的颜色
  • stroke 描边

椭圆

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
    <solid android:color="#0ee"/>
    <size android:width="200dp" android:height="100dp"/>
    <stroke android:width="2dp" android:color="#000"/>
    <gradient android:type="linear" android:startColor="#fff" android:endColor="#000"/>
</shape>
image

注意,使用radial渐变时,必须指定渐变的半径,即android:gradientRadius属性。

(C)shape=line: 线形,可以画实线和虚线,line主要用于画分割线,是通过stroke和size特性组合来实现的

  • corners 圆角
  • gradient 渐变色
  • padding 内边距
  • size 组件大小
  • solid 设置形状填充的颜色
  • stroke 描边

画线时,有几点特性必须要知道的:

  1. 只能画水平线,画不了竖线;
  2. 线的高度是通过stroke的android:width属性设置的;
  3. size的android:height属性定义的是整个形状区域的高度;
  4. size的height必须大于stroke的width,否则,线无法显示;
  5. 线在整个形状区域中是居中显示的;
  6. 线左右两边会留有空白间距,线越粗,空白越大;
  7. 引用虚线的view需要添加属性android:layerType,值设为”software”,否则显示不了虚线。

实线

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
    <size android:width="200dp" android:height="100dp"/>
    <stroke android:width="3dp" android:color="#000" />
</shape>
image

虚线

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
    <size android:width="200dp" android:height="100dp"/>
    <stroke android:width="3dp" android:color="#000" android:dashWidth="6dp" android:dashGap="2dp"/>
</shape>
image

(D)shape=ring: 环形,可以画环形进度条

首先,shape根元素有些属性只适用于ring类型,先过目下这些属性吧:

  • android:innerRadius 内环的半径
  • android:innerRadiusRatio 浮点型,以环的宽度比率来表示内环的半径,默认为3,表示内环半 径为环的宽度除以3,该值会被android:innerRadius覆盖
  • android:thickness 环的厚度
  • android:thicknessRatio 浮点型,以环的宽度比率来表示环的厚度,默认为9,表示环的厚度为环的宽度除以9,该值会被android:thickness覆盖
  • android:useLevel 一般为false,否则可能环形无法显示,只有作为LevelListDrawable使用时才设为true
  • corners 圆角
  • gradient 渐变色
  • padding 内边距
  • size 组件大小
  • solid 设置形状填充的颜色
  • stroke 描边

普通的环形

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring" android:innerRadius="50dp" android:useLevel="false"
    android:thickness="5dp">
    <solid android:color="#21e1f2"/>
</shape>
image

(2)layer-list标签:

layer-list经过一系列的item标签,从上到下的顺序,从低到上把item的效果叠加起来。layer-list可以作为根节点,也可以作为selector中item的子节点。layer-list可以添加多个item子节点,每个item子节点对应一个drawable资源,按照item从上到下的顺序叠加在一起,再通过设置每个item的偏移量就可以看到阴影等效果了。layer-list的item可以通过下面四个属性设置偏移量:

  • android:top 顶部的偏移量
  • android:bottom 底部的偏移量
  • android:left 左边的偏移量
  • android:right 右边的偏移量

这四个偏移量和控件的margin设置差不多,都是外间距的效果。如何不设置偏移量,前面的图层就完全挡住了后面的图层,从而也看不到后面的图层效果了。比如上面的例子,Tab背景中的白色背景设置了android:bottom之后才能看到一点红色背景。那么如果偏移量设为负值会怎么样呢?经过验证,偏移超出的部分会被截掉而看不到,不信可以自己试一下。有时候这很有用,比如当我想显示一个半圆的时候。

另外,关于item的用法,也做下总结:

根节点不同时,可设置的属性是会不同的,比如selector下,可以设置一些状态属性,而在layer-list下,可以设置偏移量;
就算父节点同样是selector,放在drawable目录和放在color目录下可用的属性也会不同,比如drawable目录下可用的属性为android:drawable,在color目录下可用的属性为android:color;
item的子节点可以为任何类型的drawable类标签,除了上面例子中的shape、color、layer-list,也可以是selector,还有其他没讲过的bitmap、clip、scale、inset、transition、rotate、animated-rotate、lever-list等等。

for example,以下是一个白色背景,有灰色阴影的矩形框。

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <layer-list>
            <!-- 灰色阴影 -->
            <item
                android:left="1dp"
                android:top="2dp">
                <shape>
                    <size android:width="20dp" android:height="10dp"/>
                    <solid android:color="@android:color/darker_gray" />
                    <corners android:radius="10dp" />
                </shape>
            </item>
            <!-- 白色前景 -->
            <item
                android:bottom="2dp"
                android:right="1dp">
                <shape>
                    <solid android:color="#FFFFFF" />
                    <corners android:radius="10dp" />
                </shape>
            </item>
        </layer-list>
    </item>
</selector>
image

(3)bitmap标签

主要可以通过bitmap标签对图片做一些设置,如平铺、拉伸或保持图片原始大小,也可以指定对齐方式。

  • android:src 必填项,指定图片资源,只能是图片,不能是xml定义的drawable资源

  • android:gravity 设置图片的对齐方式,比如在layer-list中,默认会尽量填满整个视图,导致图片可能会被拉伸,为了避免被拉伸,就可以设置对齐方式,可取值为下面的值,多个取值可以用 | 分隔:

    • top 图片放于容器顶部,不改变图片大小
    • bottom 图片放于容器底部,不改变图片大小
    • left 图片放于容器左边,不改变图片大小
    • right 图片放于容器右边,不改变图片大小
    • center 图片放于容器中心位置,包括水平和垂直方向,不改变图片大小
    • fill 拉伸整张图片以填满容器的整个高度和宽度,默认值
    • center_vertical 图片放于容器垂直方向的中心位置,不改变图片大小
    • center_horizontal 图片放于容器水平方向的中心位置,不改变图片大小
    • fill_vertical 在垂直方向上拉伸图片以填满容器的整个高度
    • fill_horizontal 在水平方向上拉伸图片以填满容器的整个宽度
    • clip_vertical 附加选项,裁剪基于垂直方向的gravity设置,设置top时会裁剪底部,设置bottom时会裁剪顶部,其他情况会同时裁剪顶部和底部
    • clip_horizontal 附加选项,裁剪基于水平方向的gravity设置,设置left时会裁剪右侧,设置right时会裁剪左侧,其他情况会同时裁剪左右两侧
  • android:antialias 设置是否开启抗锯齿

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

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

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

  • android:tileMode 设置图片平铺的方式,取值为下面四种之一:
    --disable 不做任何平铺,默认设置
    --repeat 图片重复铺满
    --mirror 使用交替镜像的方式重复图片的绘制
    --clamp 复制图片边缘的颜色来填充容器剩下的空白部分,比如引入的图片如果是白色的边缘,那么图片所在的容器里除了图片,剩下的空间都会被填充成白色

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

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

  • android:autoMirrored 设置图片是否需要镜像反转,当布局方向是RTL,即从右到左布局时才有用,API Level 19(Android 4.4)才添加的属性

  • android:tileModeX 和tileMode一样设置图片的平铺方式,只是这个属性只设置水平方向的平铺方式,这是API Level 21(Android 5.0)才添加的属性

  • android:tileModeY 和tileMode一样设置图片的平铺方式,只是这个属性只设置垂直方向的平铺方式,这是API Level 21(Android 5.0)才添加的属性

  • android:tintMode 着色模式,也是API Level 21(Android 5.0)才添加的属性

(4)nine-patch标签

点九图片文件扩展名为:.9.png,通过点九图片可以做局部拉伸,比如,一张圆角矩形图片,我们不想让它的四个边角都被拉伸从而导致模糊失真,使用点九图就可以控制拉伸区域,让四个边角保持完美显示。画点九图一般用Android SDK工具集里的draw9patch工具,只需要在四条边画黑线就可以了,使用nine-patch标签可以对点九图片做一些设置处理,不过可设置的属性并不多:

  • android:src 必填项,必须指定点九类型的图片
  • android:dither 设置是否抖动,图片与屏幕的像素配置不同时会用到,比如图片是ARGB 8888的,而屏幕是RGB565
  • android:tint 给图片着色,比如图片本来是黑色的,着色后可以变成白色
  • android:tintMode 着色模式,API Level 21(Android 5.0)才添加的属性
  • android:alpha 设置图片的透明度,取值范围为0.0~1.0之间,0.0为全透明,1.0为全不透明,API Level最低要求是11
  • android:autoMirrored 设置图片是否需要镜像反转,当布局方向是RTL,即从右到左布局时才有用,API Level 19(Android 4.4)才添加的属性

(5)color标签

color标签是drawable里最简单的标签了,只有一个属性:android:color,指定颜色值。这个标签一般很少用,因为基本都可以通过其他更方便的方式定义颜色。另外,颜色值一般都在colors.xml文件中定义,其根节点为resources。

(6)inset标签

使用inset标签可以对drawable设置边距,其用法和View的padding类似,只不过padding是设置内容与边界的距离,而inset则可以设置背景drawable与View边界的距离。inset标签的可设置属性如下:

  • android:drawable 指定drawable资源,如果不设置该属性,也可以定义drawable类型的子标签
  • android:visible 设置初始的可见性状态,默认为false
  • android:insetLeft 左边距
  • android:insetRight 右边距
  • android:insetTop 顶部边距
  • android:insetBottom 底部边距
  • android:inset 设置统一边距,会覆盖上面四个属性,但API Level要求为21,即Android 5.0

(7)clip标签

使用clip标签可以对drawable进行裁剪,在做进度条时很有用。通过设置level值控制裁剪多少,level取值范围为0~10000,默认为0,表示完全裁剪,图片将不可见;10000则完全不裁剪,可见完整图片。看看clip标签可以设置的属性:

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

  • android:clipOrientation 设置裁剪的方向,取值为以下两个值之一:

    • horizontal 在水平方向上进行裁剪,条状的进度条就是水平方向的裁剪
    • vertical 在垂直方向上进行裁剪
  • android:gravity 设置裁剪的位置,可取值如下,多个取值用 | 分隔:

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

level的设置需要在代码中动态去设置,假如有这样的图片:

image

1 . 定义clip.xml:

<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
    android:clipOrientation="horizontal"
    android:drawable="@drawable/img4clip"
    android:gravity="left" />

2 . 在ImageView中引用:

<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

效果如下:

image

clip里面设置的android:gravity="left"可以理解为,从右边开始裁剪,因为,裁剪的范围值是,0-10000,这里设置成了5000,也就是裁剪一半,效果如上图。

(8)scale标签

  • 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一样,在代码中设置level

(9)level-list标签

当需要在一个View中显示不同图片的时候,比如手机剩余电量不同时显示的图片不同,level-list就可以派上用场了。level-list可以管理一组drawable,每个drawable设置一组level范围,最终会根据level值选取对应的drawable绘制出来。level-list通过添加item子标签来添加相应的drawable,其下的item只有三个属性:

  • android:drawable 指定drawable资源,如果不设置该属性,也可以定义drawable类型的子标签
  • android:minLevel 该item的最小level值
  • android:maxLevel 该item的最大level值

以下是示例代码:

<?xml version="1.0" encoding="utf-8"?>
<level-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:drawable="@drawable/battery_low"
        android:maxLevel="10"
        android:minLevel="0" />
    <item
        android:drawable="@drawable/battery_below_half"
        android:maxLevel="50"
        android:minLevel="10" />
    <item
        android:drawable="@drawable/battery_over_half"
        android:maxLevel="99"
        android:minLevel="50" />
    <item
        android:drawable="@drawable/battery_full"
        android:maxLevel="100"
        android:minLevel="100" />
</level-list>

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

img.getDrawable().setLevel(10);

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

<?xml version="1.0" encoding="utf-8"?>
<level-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:drawable="@drawable/battery_low"
        android:maxLevel="10" />
    <item
        android:drawable="@drawable/battery_below_half"
        android:maxLevel="50" />
    <item
        android:drawable="@drawable/battery_over_half"
        android:maxLevel="99" />
    <item
        android:drawable="@drawable/battery_full"
        android:maxLevel="100" />
</level-list>

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

(9)transition标签

transition其实是继承自layer-list的,只是,transition只能管理两层drawable,另外提供了两层drawable之间切换的方法,切换时还会有淡入淡出的动画效果。示例代码如下:

<?xml version="1.0" encoding="utf-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/on" />
    <item android:drawable="@drawable/off" />
</transition>

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

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

(10)rotate标签

使用rotate标签可以对一个drawable进行旋转操作,在shape篇讲环形时最后举了个进度条时就用到了rotate标签。另外,比如你有一张箭头向上的图片,但你还需要一个箭头向下的图片,这时就可以使用rotate将向上的箭头旋转变成一张箭头向下的drawable。
先看看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度,转成一张箭头向下的图片:

<?xml version="1.0" encoding="utf-8"?>
<rotate 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取值范围为010000,应用到rotate,则与fromDegreestoDegrees相对应,如上面例子的角度范围为0~180,那么,level取值0时,则旋转为0度;level为10000时,则旋转180度;level为5000时,则旋转90度。因为level默认值为0,所以图片没有转变。那么,我们想转180度,其实可以将fromDegrees设为180,而不设置toDegrees,这样,不用再在代码里设置level图片就可以旋转180了。

(11)animation-list标签

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

  • android:oneshot 属性设置是否循环播放,设为true时,只播放一轮就结束,设为false时,则会轮询播放。
  • android:duration 属性设置该帧持续的时间,以毫秒数为单位。
  • animation-list 对应的Drawable类为AnimationDrawable,要让动画运行起来,需要主动调用AnimationDrawable的start()方法。另外,如果在Activity的onCreate()方法里直接调用start()方法会没有效果,因为view还没有初始化完成是播放不了动画的。

示例代码如下:

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false">
    <item
        android:drawable="@drawable/anim1"
        android:duration="1000" />
    <item
        android:drawable="@mipmap/anim2"
        android:duration="1000" />
    <item
        android:drawable="@mipmap/anim3"
        android:duration="1000" />
</animation-list>

注意:

  1. 必须要把 animated-list 设置成主标签
  2. 只有通过 andorid:src 引用才可以,也就是button类的控件不能这样设置动画
  3. 如果控件没有效果,需在代码中这样设置:
  4. 注意内存的消耗,animation-list默认把所有的图片都加载到内存中,如果是复杂和帧数高的帧动画切记不能用此方法
private ImageButton hh;
hh = (ImageButton) findViewById(R.id.imageButton);
Drawable drawable = hh.getDrawable();
if (!((AnimationDrawable) drawable).isRunning()) {
    ((AnimationDrawable) drawable).start();
}

(12)animated-rotate

rotate标签只是将原有的drawable转个角度变成另一个drawable,它是静态的。而animated-rotate则会让drawable不停地做旋转动画。animated-rotate可设置的属性只有四个:

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

  • android:pivotX 旋转中心的X坐标

  • android:pivotY 旋转中心的Y坐标

    旋转中心的坐标,浮点数或是百分比。
    浮点数表示相对于drawable的左边缘距离单位为px,如5;
    百分比表示相对于drawable的左边缘距离按百分比计算,
    如5%; 另一种百分比表示相对于父容器的左边缘,如5%p;
    一般设置为50%表示在drawable中心

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

<?xml version="1.0" encoding="utf-8"?>
<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/img_daisy"
    android:pivotX="50%"
    android:pivotY="50%"
    android:visible="false" />

注意:

  1. 必须要把 animated-rotate 设置成主标签
  2. 只有通过 andorid:src 引用才可以,也就是button类的控件不能这样设置动画
  3. 如果控件没有效果,需在代码中这样设置:
private ImageButton hh;
hh = (ImageButton) findViewById(R.id.imageButton);
Drawable drawable = hh.getDrawable();
if (!((Animatable) drawable).isRunning()) {
    ((Animatable) drawable).start();
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,847评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,208评论 1 292
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,587评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,942评论 0 205
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,332评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,587评论 1 218
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,853评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,568评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,273评论 1 242
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,542评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,033评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,373评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,031评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,073评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,830评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,628评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,537评论 2 269

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 170,568评论 25 707
  • 记得刚开始学Android时,看着自己完全用系统控件写出的不忍直视的界面,对于如何做出不一样的按钮,让它们在不同状...
    biloba阅读 1,626评论 1 11
  • 一、 Drawable简介 1 Drawable表示的是一种可以在Canvas上进行绘制的抽象的概念,可以是纯颜色...
    黄海佳阅读 1,120评论 0 10
  • 转载自Keegan小钢并标明原文链接:http://keeganlee.me/post/android/20150...
    坚持编程_lyz阅读 1,077评论 0 1
  • 我们都知道每天洗脸刷牙,打扮漂亮了去面对这个世界,却请别忘了清扫心灵,让思想变得健康,让大脑保持清爽,让心态保持阳光。
    三思必行阅读 234评论 0 0