zoukankan      html  css  js  c++  java
  • Android中Animation 详细解读

    Animation从总体来说可以分为两类:

    1.Tweened Animations:该类提供了旋转,移动,伸展,淡入淡出等效果

    Tweened Animations也有四种类型:

    1.     Alpha:淡入淡出效果

    2.     Scale:缩放效果

    3.     Rotate:旋转效果

    4.     Translate:移动效果

    设置动画有两种方式:在xml文件中或者在java代码中

    在XML中设置动画效果步骤:

    1.     在res文件夹下新建一个名为anim的文件夹

    2.     创建xml文件,并首先加入set标签(set标签就相当于Java代码中的AnimationSet)

    3.     在Set标签中加入alpha,scale,rotate,translate标签(相当于Java代码中的AlphaAnimation,ScaleAnimation,RotateAnimation,TranslateAnimation)

    4.     在Java代码中使用AnimationUtils的loadAnimation方法来加载XML文件,并得到一个Animation对象

    5.     使用控件的startAnimation()方法执行这个Animation对象

    那么通用的属性:

    • android:duration:设置动画持续时间
    • android:fillAfter:如果fillAfter设为true,则动画执行后,控件将停留在动画结束的状态
    • android:fillBefore:如果fillBefore设为true,则动画执行后,控件将回到动画开始的状态
    • android:startOffset(long startOffset):设置动画执行之前等待的时间(单位:毫秒)
    • android:repeatCount(int repeatCount):设置动画重复的次数
    • android:interpolator:设置动画的变化速度,其值:

    android:interpolator="@android:anim/accelerate_decelerate_interpolator":先加速,后减速

    android:interpolator="@android:anim/accelerate_interpolator":加速

    android:interpolator="@android:anim/decelerate_interpolator":减速

    android:interpolator="@android:anim/cycle_Interpolator":动画循环播放特定次数,速率改变沿着正弦曲线

    android:interpolator="@android:anim/linear_Interpolator":匀速

    示例:

    1. 1.  <?xml version="1.0" encoding="utf-8"?>    
    2. 2.  <set xmlns:android="http://schemas.android.com/apk/res/android"    
    3. 3.      android:interpolator="@android:anim/accelerate_interpolator" >    
    4. 4.      
    5. 5.      <alpha    
    6. 6.          android:duration="500"    
    7. 7.          android:fromAlpha="1.0"    
    8. 8.          android:startOffset="500"    
    9. 9.          android:toAlpha="0.0" />    
    10. 10.     
    11. 11. </set>    
    1.	<?xml version="1.0" encoding="utf-8"?>  
    2.	<set xmlns:android="http://schemas.android.com/apk/res/android"  
    3.	    android:interpolator="@android:anim/accelerate_interpolator" >  
    4.	  
    5.	    <alpha  
    6.	        android:duration="500"  
    7.	        android:fromAlpha="1.0"  
    8.	        android:startOffset="500"  
    9.	        android:toAlpha="0.0" />  
    10.	  
    11.	</set>  
    

    rotate.xml

    1. 1.  <?xml version="1.0" encoding="utf-8"?>    
    2. 2.  <set xmlns:android="http://schemas.android.com/apk/res/android"    
    3. 3.      android:interpolator="@android:anim/accelerate_interpolator" >    
    4. 4.      
    5. 5.      <rotate    
    6. 6.          android:duration="5000"    
    7. 7.          android:fromDegrees="0"    
    8. 8.          android:pivotX="50%"    
    9. 9.          android:pivotY="50%"    
    10. 10.         android:toDegrees="360" />    
    11. 11.     
    12. 12. </set>   
    1.	<?xml version="1.0" encoding="utf-8"?>  
    2.	<set xmlns:android="http://schemas.android.com/apk/res/android"  
    3.	    android:interpolator="@android:anim/accelerate_interpolator" >  
    4.	  
    5.	    <rotate  
    6.	        android:duration="5000"  
    7.	        android:fromDegrees="0"  
    8.	        android:pivotX="50%"  
    9.	        android:pivotY="50%"  
    10.	        android:toDegrees="360" />  
    11.	  
    12.	</set> 
    

    scale.xml

    1. 1.  <?xml version="1.0" encoding="utf-8"?>    
    2. 2.  <set xmlns:android="http://schemas.android.com/apk/res/android"    
    3. 3.      android:interpolator="@android:anim/accelerate_interpolator" >    
    4. 4.      
    5. 5.      <scale    
    6. 6.          android:duration="2000"    
    7. 7.          android:fromXScale="1.0"    
    8. 8.          android:fromYScale="1.0"    
    9. 9.          android:pivotX="50%"    
    10. 10.         android:pivotY="50%"    
    11. 11.         android:toXScale="0.0"    
    12. 12.         android:toYScale="0.0" />    
    13. 13.     
    14. 14. </set>   
    1.	<?xml version="1.0" encoding="utf-8"?>  
    2.	<set xmlns:android="http://schemas.android.com/apk/res/android"  
    3.	    android:interpolator="@android:anim/accelerate_interpolator" >  
    4.	  
    5.	    <scale  
    6.	        android:duration="2000"  
    7.	        android:fromXScale="1.0"  
    8.	        android:fromYScale="1.0"  
    9.	        android:pivotX="50%"  
    10.	        android:pivotY="50%"  
    11.	        android:toXScale="0.0"  
    12.	        android:toYScale="0.0" />  
    13.	  
    14.	</set> 
    


      translate.xml

    1. 1.  <?xml version="1.0" encoding="utf-8"?>    
    2. 2.  <set xmlns:android="http://schemas.android.com/apk/res/android"    
    3. 3.      android:interpolator="@android:anim/accelerate_interpolator" >    
    4. 4.      
    5. 5.      <translate    
    6. 6.          android:duration="2000"    
    7. 7.          android:fromXDelta="50%"    
    8. 8.          android:fromYDelta="0%"    
    9. 9.          android:toXDelta="100%"    
    10. 10.         android:toYDelta="100%" />    
    11. 11.     
    12. 12. </set>    
    1.	<?xml version="1.0" encoding="utf-8"?>  
    2.	<set xmlns:android="http://schemas.android.com/apk/res/android"  
    3.	    android:interpolator="@android:anim/accelerate_interpolator" >  
    4.	  
    5.	    <translate  
    6.	        android:duration="2000"  
    7.	        android:fromXDelta="50%"  
    8.	        android:fromYDelta="0%"  
    9.	        android:toXDelta="100%"  
    10.	        android:toYDelta="100%" />  
    11.	  
    12.	</set>  
    

     

    使用:

    1. case R.id.alphaButton:    
    2.             Animation alphaAnimation = AnimationUtils.loadAnimation(this, R.anim.alpha);    
    3.             mImageView.startAnimation(alphaAnimation);    
    4.             break;    
    5.     
    6.         case R.id.scaleButton:    
    7.             Animation scaleAnimation = AnimationUtils.loadAnimation(this, R.anim.scale);    
    8.             mImageView.startAnimation(scaleAnimation);    
    9.             break;    
    10.     
    11.         case R.id.rotateButton:    
    12.             Animation rotateAnimation = AnimationUtils.loadAnimation(this, R.anim.rotate);    
    13.             mImageView.startAnimation(rotateAnimation);    
    14.             break;    
    15.     
    16.         case R.id.translateButton:    
    17.             Animation translateAnimation = AnimationUtils.loadAnimation(this, R.anim.translate);    
    18.             mImageView.startAnimation(translateAnimation);    
    19.             break;  
    case R.id.alphaButton:  
                Animation alphaAnimation = AnimationUtils.loadAnimation(this, R.anim.alpha);  
                mImageView.startAnimation(alphaAnimation);  
                break;  
      
            case R.id.scaleButton:  
                Animation scaleAnimation = AnimationUtils.loadAnimation(this, R.anim.scale);  
                mImageView.startAnimation(scaleAnimation);  
                break;  
      
            case R.id.rotateButton:  
                Animation rotateAnimation = AnimationUtils.loadAnimation(this, R.anim.rotate);  
                mImageView.startAnimation(rotateAnimation);  
                break;  
      
            case R.id.translateButton:  
                Animation translateAnimation = AnimationUtils.loadAnimation(this, R.anim.translate);  
                mImageView.startAnimation(translateAnimation);  
                break;

    java代码实现

    Java代码中的通用属性:

    •    setDuration(long durationMillis):设置动画持续事件(单位:毫秒)
    • setFillAfter(boolean fillAfter):如果fillAfter设为true,则动画执行后,控件将停留在动画结束的状态
    • setFillBefore(boolean fillBefore):如果fillBefore设为true,则动画执行后,控件将回到动画开始的状态
    • setStartOffset(long startOffset):设置动画执行之前等待的时间(单位:毫秒)
    • setRepeatCount(int repeatCount):设置动画重复的次数
    • setInterpolator(Interpolator i):设置动画的变化速度

    setInterpolator(newAccelerateDecelerateInterpolator()):先加速,后减速

    setInterpolator(newAccelerateInterpolator()):加速

    setInterpolator(newDecelerateInterpolator()):减速

    setInterpolator(new CycleInterpolator()):动画循环播放特定次数,速率改变沿着正弦曲线

    setInterpolator(new LinearInterpolator()):匀速

    以及其他一些特定的动画效果

    java代码

     

    1. case R.id.alphaButton:    
    2.            // 创建一个AnimationSet对象(AnimationSet是存放多个Animations的集合)     
    3.            AnimationSet animationSet = new AnimationSet(true);    
    4.            // 创建一个AlphaAnimation对象(参数表示从完全不透明到完全透明)     
    5.            AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);    
    6.            // 设置动画执行的时间(单位:毫秒)     
    7.            alphaAnimation.setDuration(1000);    
    8.            // 将AlphaAnimation对象添加到AnimationSet当中     
    9.            animationSet.addAnimation(alphaAnimation);    
    10.            // 使用ImageView的startAnimation方法开始执行动画     
    11.            mImageView.startAnimation(animationSet);    
    12.            break;    
    13.    
    14.        case R.id.scaleButton:    
    15.            // 创建一个AnimationSet对象(AnimationSet是存放多个Animations的集合)     
    16.            animationSet = new AnimationSet(true);    
    17.            // 创建一个ScaleAnimation对象(以某个点为中心缩放)     
    18.            ScaleAnimation scaleAnimation = new ScaleAnimation(1, 0.1f, 1, 0.1f,    
    19.                    Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);    
    20.            // 设置动画执行之前等待的时间(单位:毫秒)     
    21.            scaleAnimation.setStartOffset(1000);    
    22.            // 设置动画执行的时间(单位:毫秒)     
    23.            scaleAnimation.setDuration(2000);    
    24.            // 如果fillAfter设为true,则动画执行后,控件将停留在动画结束的状态     
    25.            // 运行了一下发现以下奇怪的现象     
    26.            // scaleAnimation.setFillAfter(true);不会停留在动画结束的状态     
    27.            // animationSet.setFillAfter(true);则会停留在动画结束的状态     
    28.            animationSet.setFillAfter(true);    
    29.                        // 将ScaleAnimation对象添加到AnimationSet当中     
    30.                        animationSet.addAnimation(scaleAnimation);    
    31.                        // 使用ImageView的startAnimation方法开始执行动画     
    32.                        mImageView.startAnimation(animationSet);    
    33.            break;    
    34.    
    35.        case R.id.rotateButton:    
    36.            // 创建一个AnimationSet对象(AnimationSet是存放多个Animations的集合)     
    37.            animationSet = new AnimationSet(true);    
    38.            // 创建一个RotateAnimation对象(以某个点为圆心旋转360度)     
    39.            RotateAnimation rotateAnimation = new RotateAnimation(0, 360,    
    40.                    Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.25f);    
    41.            // 设置动画执行的时间(单位:毫秒)     
    42.            rotateAnimation.setDuration(5000);    
    43.            // 将RotateAnimation对象添加到AnimationSet当中     
    44.            animationSet.addAnimation(rotateAnimation);    
    45.            // 使用ImageView的startAnimation方法开始执行动画     
    46.            mImageView.startAnimation(animationSet);    
    47.            break;    
    48.    
    49.        case R.id.translateButton:    
    50.            // 创建一个AnimationSet对象(AnimationSet是存放多个Animations的集合)     
    51.            animationSet = new AnimationSet(true);    
    52.            // 创建一个RotateAnimation对象(从某个点移动到另一个点)     
    53.            TranslateAnimation translateAnimation = new TranslateAnimation(    
    54.                    Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0.5f,    
    55.                    Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 1.0f);    
    56.            // 设置动画执行的时间(单位:毫秒)     
    57.            translateAnimation.setDuration(1000);    
    58.            // 将TranslateAnimation对象添加到AnimationSet当中     
    59.            animationSet.addAnimation(translateAnimation);    
    60.            // 使用ImageView的startAnimation方法开始执行动画     
    61.            mImageView.startAnimation(animationSet);    
    62.            break;    
  • 相关阅读:
    oracle 分配表权限给用户的写法
    任务的一种写法:
    解决oracle 32位64位的问题
    设计模式学习
    Nginx 相关介绍
    (2) html 语义化
    (1)HTML5的常用新特性你必须知道
    less初学手记
    如何修改chrome记住密码后自动填充表单的黄色背景 ?
    HTML的水平居中和垂直居中解决方案
  • 原文地址:https://www.cnblogs.com/zhongle/p/4015719.html
Copyright © 2011-2022 走看看