前言:这几天做客户回访,感触很大,用户只要是留反馈信息,总是一种恨铁不成钢的心态,想用你的app,却是因为你的技术问题,让他们不得不放弃,而你一个回访电话却让他们尽释前嫌,当最后把手机号留给他们以便随时沟通的时候,总会发来一条条的鼓励短信,让我不自主的开始内疚。哎,多么可爱的用户,多么无耐的现实。

相关文章:

Android自定义控件三部曲文章索引》:http://blog.csdn.net/harvic880925/article/details/50995268

一、概述

Android的animation由四种类型组成:alpha、scale、translate、rotate,对应android官方文档地址:《Animation Resources》

1、XML配置文件中

alpha 渐变透明度动画效果
scale 渐变尺寸伸缩动画效果
translate 画面转换位置移动动画效果
rotate 画面转移旋转动画效果

下面我们逐个讲讲每个标签的属性及用法。

2、动作文件存放位置

动作定义文件应该存放在res/anim文件夹下,访问时采用R.anim.XXX.xml的方式,位置如图:

二、scale标签——调节尺寸

1、自有属性

scale标签是缩放动画,可以实现动态调控件尺寸的效果,有下面几个属性:

  • android:fromXScale    起始的X方向上相对自身的缩放比例,浮点值,比如1.0代表自身无变化,0.5代表起始时缩小一倍,2.0代表放大一倍;
  • android:toXScale        结尾的X方向上相对自身的缩放比例,浮点值;
  • android:fromYScale    起始的Y方向上相对自身的缩放比例,浮点值,
  • android:toYScale        结尾的Y方向上相对自身的缩放比例,浮点值;
  • android:pivotX
               缩放起点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如
    50、50%、50%p,当为数值时,表示在当前View的左上角,即原点处加上50px,做为起始缩放点;如果是50%,表示在当前控件的左上角加上自己宽度的50%做为起始点;如果是50%p,那么就是表示在当前的左上角加上父控件宽度的50%做为起始点x轴坐标。(具体意义,后面会举例演示)
  • android:pivotY           缩放起点Y轴坐标,取值及意义跟android:pivotX一样。

下面看一个实例,当scale里的属性这样设置时,效果会怎样呢:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <scale xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:fromXScale="0.0"
  4. android:toXScale="1.4"
  5. android:fromYScale="0.0"
  6. android:toYScale="1.4"
  7. android:pivotX="50"
  8. android:pivotY="50"
  9. android:duration="700" />

(1)、pivotX取值数值时(50)

这个控件,宽度和高度都是从0放大到1.4倍,起始点坐标在控件左上角(坐标原点),向x轴正方向和y轴正方向都加上50像素;

根据pivotX,pivotY的意义,控件的左上角即为控件的坐标原点,这里的起始点是在控件的原点的基础上向X轴和Y轴各加上50px,做为起始点,如下图中图二所示

图一                                                             图二
    

(2)、pivotX取值百分数时(50%)
下面再看看当pivotX、pivotY取百分数的时候,起始点又在哪里?

上面我们讲了,pivotX的值,当取50%时,表示在原点坐标的基础上加上的自己宽度的50%,看看效果:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <scale xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:fromXScale="0.0"
  4. android:toXScale="1.4"
  5. android:fromYScale="0.0"
  6. android:toYScale="1.4"
  7. android:pivotX="50%"
  8. android:pivotY="50%"
  9. android:duration="700" />

缩放位置大小仍然从0-1.4,只改变pivotX和pivotY;起始点位置如下图中图二所示:

图一                                                                 图二

   
(3)、pivotX取值50%p时

前面说过,当取值在百分数后面加上一个字母p,就表示,取值的基数是父控件,即在原点的基础上增加的值是父标签的百分值。

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <scale xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:fromXScale="0.0"
  4. android:toXScale="1.4"
  5. android:fromYScale="0.0"
  6. android:toYScale="1.4"
  7. android:pivotX="50%p"
  8. android:pivotY="50%p"
  9. android:duration="700" />

效果图,及起始点坐标图如下所示:

        

2、从Animation类继承的属性

Animation类是所有动画(scale、alpha、translate、rotate)的基类,这里以scale标签为例,讲解一下,Animation类所具有的属性及意义。关于Animation类的官方文档位置为:《Animation》

  • android:duration        动画持续时间,以毫秒为单位
  • android:fillAfter          如果设置为true,控件动画结束时,将保持动画最后时的状态
  • android:fillBefore       如果设置为true,控件动画结束时,还原到开始动画前的状态
  • android:fillEnabled    与android:fillBefore 效果相同,都是在动画结束时,将控件还原到初始化状态
  • android:repeatCount 重复次数
  • android:repeatMode 重复类型,有reverse和restart两个值,reverse表示倒序回放,restart表示重新放一遍,必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型,即回放时的动作。
  • android:interpolator  设定插值器,其实就是指定的动作效果,比如弹跳效果等,不在这小节中讲解,后面会单独列出一单讲解。

对于android:duration,就不再讲解了,就是动画的持续时长,以毫秒为单位,下面看看android:fillAfter和android:fillBefore

(1)android:fillAfter:保持动画结束的状态

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <scale xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:fromXScale="0.0"
  4. android:toXScale="1.4"
  5. android:fromYScale="0.0"
  6. android:toYScale="1.4"
  7. android:pivotX="50%"
  8. android:pivotY="50%"
  9. android:duration="700"
  10. android:fillAfter="true"
  11. />

(2)android:fillBefore  还原初始化状态

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <scale xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:fromXScale="0.0"
  4. android:toXScale="1.4"
  5. android:fromYScale="0.0"
  6. android:toYScale="1.4"
  7. android:pivotX="50%"
  8. android:pivotY="50%"
  9. android:duration="700"
  10. android:fillBefore="true"
  11. />

android:fillBefore="true"                                 android:fillEnable="true"

   

上面顺便列出了,当仅设定fillEanble为true时的效果,这两个的标签的效果完全相同。

(3)、android:repeatMode="restart /reverse"  设定回放类型

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <scale xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:fromXScale="0.0"
  4. android:toXScale="1.4"
  5. android:fromYScale="0.0"
  6. android:toYScale="1.4"
  7. android:pivotX="50%"
  8. android:pivotY="50%"
  9. android:duration="700"
  10. android:fillBefore="true"
  11. android:repeatCount="1"
  12. android:repeatMode="restart"
  13. />

androidRepeatMode设为restart                       androidRepeatMode设为reverse
       

三、alpha标签——调节透明度

1、自身属性

  • android:fromAlpha   动画开始的透明度,从0.0 --1.0 ,0.0表示全透明,1.0表示完全不透明
  • android:toAlpha       动画结束时的透明度,也是从0.0 --1.0 ,0.0表示全透明,1.0表示完全不透明

使用示例:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <alpha xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:fromAlpha="1.0"
  4. android:toAlpha="0.1"
  5. android:duration="3000"
  6. android:fillBefore="true">
  7. </alpha>

2、从Animation类继承的属性

  • android:duration        动画持续时间,以毫秒为单位
  • android:fillAfter          如果设置为true,控件动画结束时,将保持动画最后时的状态
  • android:fillBefore       如果设置为true,控件动画结束时,还原到开始动画前的状态
  • android:fillEnabled    与android:fillBefore 效果相同,都是在动画结束时,将控件还原到初始化状态
  • android:repeatCount 重复次数
  • android:repeatMode 重复类型,有reverse和restart两个值,reverse表示倒序回放,restart表示重新放一遍,必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型,即回放时的动作。
  • android:interpolator  设定插值器,其实就是指定的动作效果,比如弹跳效果等,不在这小节中讲解,后面会单独列出一单讲解。

与scale标签意义一样,就不再缀述。

四、rotate标签——旋转

1、自身属性

  • android:fromDegrees     开始旋转的角度位置,正值代表顺时针方向度数,负值代码逆时针方向度数
  • android:toDegrees         结束时旋转到的角度位置,正值代表顺时针方向度数,负值代码逆时针方向度数
  • android:pivotX               缩放起点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p,具体意义已在scale标签中讲述,这里就不再重讲
  • android:pivotY               缩放起点Y轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <rotate xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:fromDegrees="0"
  4. android:toDegrees="-650"
  5. android:pivotX="50%"
  6. android:pivotY="50%"
  7. android:duration="3000"
  8. android:fillAfter="true">
  9. </rotate>

围绕自身从0度逆时针旋转650度                            围绕自身从0度顺时针旋转650度

android:fromDegrees="0"                                       android:fromDegrees="0"

android:toDegrees="-650"                                      android:toDegrees="650"

     

2、从Animation类继承的属性

  • android:duration        动画持续时间,以毫秒为单位
  • android:fillAfter          如果设置为true,控件动画结束时,将保持动画最后时的状态
  • android:fillBefore       如果设置为true,控件动画结束时,还原到开始动画前的状态
  • android:fillEnabled    与android:fillBefore 效果相同,都是在动画结束时,将控件还原到初始化状态
  • android:repeatCount 重复次数
  • android:repeatMode 重复类型,有reverse和restart两个值,reverse表示倒序回放,restart表示重新放一遍,必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型,即回放时的动作。
  • android:interpolator  设定插值器,其实就是指定的动作效果,比如弹跳效果等,不在这小节中讲解,后面会单独列出一单讲解。

与scale标签意义一样,就不再缀述。

五、translate标签 —— 平移

1、自身属性

  • android:fromXDelta     起始点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p,具体意义已在scale标签中讲述,这里就不再重讲
  • android:fromYDelta    起始点Y轴从标,可以是数值、百分数、百分数p 三种样式;
  • android:toXDelta         结束点X轴坐标
  • android:toYDelta        结束点Y轴坐标
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <translate xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:fromXDelta="0"
  4. android:toXDelta="-80"
  5. android:fromYDelta="0"
  6. android:toYDelta="-80"
  7. android:duration="2000"
  8. android:fillBefore="true">
  9. </translate>

2、从Animation类继承的属性

  • android:duration        动画持续时间,以毫秒为单位
  • android:fillAfter          如果设置为true,控件动画结束时,将保持动画最后时的状态
  • android:fillBefore       如果设置为true,控件动画结束时,还原到开始动画前的状态
  • android:fillEnabled    与android:fillBefore 效果相同,都是在动画结束时,将控件还原到初始化状态
  • android:repeatCount 重复次数
  • android:repeatMode 重复类型,有reverse和restart两个值,reverse表示倒序回放,restart表示重新放一遍,必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型,即回放时的动作。
  • android:interpolator  设定插值器,其实就是指定的动作效果,比如弹跳效果等,不在这小节中讲解,后面会单独列出一单讲解。

与scale标签意义一样,就不再缀述。

六、set标签——定义动作合集

前面我们讲解了各个标签动画的意义及用法,但他们都是独立对控件起作用,假设我现在想上面的textView控件做一个动画——从小到大,旋转出场,而且透明度也要从0变成1,即下面的这个效果,该怎么办?

这就需要对指定的控件定义动作合集,Set标签就可以将几个不同的动作定义成一个组;

属性:

set标签自已是没有属性的,他的属性都是从Animation继承而来,但当它们用于Set标签时,就会对Set标签下的所有子控件都产生作用。

属性有:(从Animation类继承的属性)

  • android:duration        动画持续时间,以毫秒为单位
  • android:fillAfter          如果设置为true,控件动画结束时,将保持动画最后时的状态
  • android:fillBefore       如果设置为true,控件动画结束时,还原到开始动画前的状态
  • android:fillEnabled    与android:fillBefore 效果相同,都是在动画结束时,将控件还原到初始化状态
  • android:repeatCount 重复次数
  • android:repeatMode 重复类型,有reverse和restart两个值,reverse表示倒序回放,restart表示重新放一遍,必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型,即回放时的动作。
  • android:interpolator  设定插值器,其实就是指定的动作效果,比如弹跳效果等,不在这小节中讲解,后面会单独列出一单讲解。

与scale标签意义一样,就不再缀述。

上面这个效果,所对应的XML代码为:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <set xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:duration="3000"
  4. android:fillAfter="true">
  5. <alpha
  6. android:fromAlpha="0.0"
  7. android:toAlpha="1.0"/>
  8. <scale
  9. android:fromXScale="0.0"
  10. android:toXScale="1.4"
  11. android:fromYScale="0.0"
  12. android:toYScale="1.4"
  13. android:pivotX="50%"
  14. android:pivotY="50%"/>
  15. <rotate
  16. android:fromDegrees="0"
  17. android:toDegrees="720"
  18. android:pivotX="50%"
  19. android:pivotY="50%"/>
  20. </set>

七、实例——如何将动画XML文件应用于控件中

上面我仅仅是列出了每个标签及其属性的意义及应用之后的效果演示,但上面是如何将定义动画的xml应用到textView控件中的却迟迟没说,这一小节,就以scale动画为例,讲述如何将定义好的scle动作添加到指定控件中。

先看最终效果图:

1、新建工程、新建scale动画文件(scaleanim.xml)

新建一个工程,并且在res文件夹下,新建一个anim文件夹,然后再新建一个scaleanim.xml文件,结构如图所示:

scaleanim.xml的代码为:(从TextView中心点,从0放大到1.4倍,反复一次,最后还原到初始化状态)

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <scale xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:fromXScale="0.0"
  4. android:toXScale="1.4"
  5. android:fromYScale="0.0"
  6. android:toYScale="1.4"
  7. android:pivotX="50%"
  8. android:pivotY="50%"
  9. android:duration="700"
  10. android:fillBefore="true"
  11. android:repeatCount="1"
  12. android:repeatMode="restart"
  13. />

2、XML布局文件

  1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent"
  5. android:orientation="vertical"
  6. tools:context="com.harvic.animation_demo.MainActivity" >
  7. <Button android:id="@+id/btn_animation"
  8. android:layout_width="match_parent"
  9. android:layout_height="wrap_content"
  10. android:layout_margin="10dip"
  11. android:text="scale animation"/>
  12. <TextView
  13. android:id="@+id/tv"
  14. android:layout_width="100dip"
  15. android:layout_height="200dip"
  16. android:background="#ff00ff"
  17. android:text="@string/hello_world"
  18. android:layout_gravity="center_horizontal"/>
  19. </LinearLayout>

3、JAVA代码

  1. public class MainActivity extends Activity {
  2. Button scaleBtn ;
  3. Animation scaleAnimation;
  4. TextView tv;
  5. @Override
  6. protected void onCreate(Bundle savedInstanceState) {
  7. super.onCreate(savedInstanceState);
  8. setContentView(R.layout.activity_main);
  9. scaleAnimation = AnimationUtils.loadAnimation(this, R.anim.scaleanim);
  10. scaleBtn = (Button)findViewById(R.id.btn_animation);
  11. tv =(TextView)findViewById(R.id.tv);
  12. scaleBtn.setOnClickListener(new View.OnClickListener() {
  13. @Override
  14. public void onClick(View v) {
  15. // TODO Auto-generated method stub
  16. tv.startAnimation(scaleAnimation);
  17. }
  18. });
  19. }
  20. }

(1)通过scaleAnimation = AnimationUtils.loadAnimation(this, R.anim.scaleanim);从XML文件中获取动画

(2)利用startAnimation将动画传递给指定控件显示。

至此,本文就结束了,下篇将讲述有关插值器的相关属性及意义。

下面就是源码下载了,源码中包含两部分内容:

1、Harvic_animation_demo工程:是第七部分的实例源码;

2、tryAlpha_xml工程:是前六节动作代码的集合,包含了前六小节里的所有代码及动画定义。

源码下载地址:http://download.csdn.net/detail/harvic880925/8032579

请大家尊重原创者版权,转载请标明出处:http://blog.csdn.net/harvic880925/article/details/39996643 谢谢!

自定义控件三部曲之动画篇(一)——alpha、scale、translate、rotate、set的xml属性及用法的更多相关文章

  1. 转:自定义控件三部曲之动画篇——alpha、scale、translate、rotate、set的xml属性及用法

    第一篇: 一.概述 Android的animation由四种类型组成:alpha.scale.translate.rotate,对应android官方文档地址:<Animation Resour ...

  2. 自定义控件三部曲之动画篇(四)——ValueAnimator基本使用

    前言:不要让别人的无知断送了你的梦想,永远坚信你所坚信的. 相关文章: <Android自定义控件三部曲文章索引>:http://blog.csdn.net/harvic880925/ar ...

  3. android.view.animation(1) - alpha、scale、translate、rotate、set的xml属性和用法(转)

    一.ScaleAnimation ScaleAnimation(float fromX, float toX, float fromY, float toY, int pivotXType, floa ...

  4. [转]Animation 动画详解(一)——alpha、scale、translate、rotate、set的xml属性及用法

    转载:http://blog.csdn.net/harvic880925/article/details/39996643 前言:这几天做客户回访,感触很大,用户只要是留反馈信息,总是一种恨铁不成钢的 ...

  5. 自己定义控件三部曲之动画篇(七)——ObjectAnimator基本使用

    前言: 假如生活欺骗了你, 不要悲伤,不要心急! 忧郁的日子里须要镇静: 相信吧,快乐的日子终将会来临! 心儿永远向往着未来: 如今却常是忧郁. 一切都是瞬息,一切都将会过去: 而那过去了的,就会成为 ...

  6. Animation 动画详解(一)——alpha、scale、translate、rotate、set的xml属性及用法

    一.概述 Android的animation由四种类型组成:alpha.scale.translate.rotate,对应android官方文档地址:<Animation Resources&g ...

  7. 自己定义控件三部曲之动画篇(十三)——实现ListView Item进入动画

    前言:宝剑锋从磨砺出,梅花香自苦寒来 相关文章: <Android自己定义控件三部曲文章索引>: http://blog.csdn.net/harvic880925/article/det ...

  8. [转]Android自定义控件三部曲系列完全解析(动画, 绘图, 自定义View)

    来源:http://blog.csdn.net/harvic880925/article/details/50995268 一.自定义控件三部曲之动画篇 1.<自定义控件三部曲之动画篇(一)—— ...

  9. android 最详细的动画大全,包括如何在代码和在XML中使用

    一.动画类型 Android的animation由四种类型组成:alpha.scale.translate.rotate XML配置文件中 alpha 渐变透明度动画效果 scale 渐变尺寸伸缩动画 ...

随机推荐

  1. JavaScript作用域闭包(你不知道的JavaScript)

    JavaScript闭包.是JS开发project师必须深入了解的知识. 3月份自己曾撰写博客<JavaScript闭包>.博客中仅仅是简单阐述了闭包的工作过程和列举了几个演示样例,并没有 ...

  2. 微信小程序实现tab页面切换功能

    wxml <scroll-view scroll-x="true" class="ip_tab_comtainer"> <view class ...

  3. sql server try catch

    一直不习惯Sql Server 2000提供的错误处理机制----繁琐,别扭...如今,Sql Server 2005提供了对Try...Catch的支持,我们总算可以象写程序一样写SQL语句了:) ...

  4. Boost解析xml——xml写入

    <?xml version="1.0" encoding="utf-8"?> <Config> <Item name=" ...

  5. CentOS搭建xfce桌面+VNC教程

    CentOS搭建xfce桌面+VNC教程 Linux的安全与性能向来为开发者所称道,你可以轻松地在搜索引擎中找到各种Linux优越性的说辞,其中不乏Linux的激进者.特别是当你步入VPS领域,更多地 ...

  6. 不安装谷歌市场,下载谷歌市场中的APK

    不安装谷歌市场,下载谷歌市场中的APK GooglePlayStore 是谷歌官方的的应用市场,有的时候还是需要从谷歌市场下载APK文件.国内的安卓手机厂商都不自带GooglePlay,甚至一些手机& ...

  7. 无法解决 React 启动的报错

    E:\React\react_blank>npm start > react_blank@0.1.0 start E:\React\react_blank > react-scrip ...

  8. leetcode 113. Path Sum II (路径和) 解题思路和方法

    Given a binary tree and a sum, find all root-to-leaf paths where each path's sum equals the given su ...

  9. Kaggle实战分类问题2

    Kaggle实战之二分类问题 0. 前言 1. MNIST 数据集 2. 二分类器 3. 效果评测 4. 多分类器与误差分析 5. Kaggle 实战 0. 前言 “尽管新技术新算法层出不穷,但是掌握 ...

  10. 芯片TPS76030、TPS76032、TPS76033、TPS76038、TPS76050 电源芯片

    下图是从网上摘出来的图片:TPS76033 它的作用就是改变电压: 输入电压:3.5V到16V       通过芯片的处理后     输出电压:3.3V 要学会看图,从中提取有用的信息 再看一个数据手 ...