• Android 常用动画之RotateAnimation


    前两天接到任务做一个UI,有用到动画,于是抽空看了下Android动画相关知识。

    Android Animation共有四大类型,分别是

    Alpha      透明度动画

    Scale      大小伸缩动画

    Translate 位移动画

    Rotate     旋转动画

    这四类动画按模式又可分为:

    tweened animation(渐变动画) —— alpha  与   scale

    frame by frame(画面转换动画) ——  translate  与 rotate

    讲一下我所了解到的rotate动画的各个属性:

    在XML中:

     

    官方给予的Rotate属性如上所示。

    android:drawable    需要进行旋转动画的图片

    android:fromDegrees  旋转的起始点(旋转开始的角度)

    android:toDegrees     旋转的结束点(旋转最终角度)

    andoird:pivotX       旋转点的X值(距离左侧的偏移量)

    android:pivotY旋转点的Y值(距离顶部的偏移量)

    android: visible这个好理解,就是图片初始的显示状态

    我对这个的理解是:

    rotate动画是以设置的旋转点(pivotX,pivotY)为坐标原点,顺时针方向从旋转起始角度(fromDegrees)到旋转最终角度(toDegrees)的动画,

    其中旋转点默认为图片左上角是(0,0)。

    现在写一个rotate动画的XML文件:rotate_anim.xml

    [java] view plain copy
     
    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <rotate xmlns:android="http://schemas.android.com/apk/res/android" >  
    3.       <rotate  
    4.             android:fromDegrees="0"   
    5.             android:interpolator="@android:anim/linear_interpolator"//设置转动速率,这里设置的是匀速转动  
    6.             android:pivotX="50%"  
    7.             android:pivotY="50%"  
    8.             android:toDegrees="359"  
    9.             android:duration = "1500"  
    10.             android:repeatCount = "-1"  
    11.             android:drawable = "@drawable/ic_launcher"  
    12.             android:visible = "true">  
    13.         </rotate>  
    14.   
    15. </rotate>  

    这里需要注意下:

    android:pivotX 与 android:pivotY 这两个属性值为float,可以给具体数也可以给百分比。比如你知道图片大小是100,你可以给(50,50)表示旋转中心点距图片左边50,右边50

    如果不知道图片的准确大小,可以跟代码所示,给百分比。

    上面的代码中还有一些在官方API中并未提及的属性,但是这些属性依旧可以使用到。

    
    

    android:interpolator:这个属性是用来设置转动速率的。

    LinearInterpolator为匀速效果,Accelerateinterpolator为加速效果、DecelerateInterpolator为减速效果,

    android:repeatCount 重复的次数,默认为0,必须是int,可以为-1表示不停止

    android:duration属性表示从android:fromDegrees转动到android:toDegrees所花费的时间,单位为毫秒。可以用来计算速度。

    android:startOffset 在调用start函数之后等待开始运行的时间,单位为毫秒,若为10,表示10ms后开始运行

    android:repeatMode 重复的模式,默认为restart,即重头开始重新运行,可以为reverse即从结束开始向前重新运行。

    在android:repeatCount大于0或为infinite时生效

    android:detachWallpaper 表示是否在壁纸上运行

    android:zAdjustment 表示被animated的内容在运行时在z轴上的位置,默认为normal。normal保持内容当前的z轴顺序top运行时在最顶层显示bottom运行时在最底层显示

    
    
    

    以上属性中,博主亲测,均可以正常使用。

    布局文件 activity_main.xml,没什么特别的:

    [java] view plain copy
     
    1. <RelativeLayout 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.   
    6.     <ImageView  
    7.         android:id="@+id/img"  
    8.         android:layout_centerInParent="true"  
    9.         android:layout_width="wrap_content"  
    10.         android:layout_height="wrap_content"/>  
    11.   
    12. </RelativeLayout>  

    MainActivity.java

    [java] view plain copy
     
    1. package com.example.rotateanimation;  
    2.   
    3. import android.app.Activity;  
    4. import android.os.Bundle;  
    5. import android.view.animation.Animation;  
    6. import android.view.animation.AnimationUtils;  
    7. import android.view.animation.LinearInterpolator;  
    8. import android.widget.ImageView;  
    9.   
    10. public class MainActivity extends Activity {  
    11.   
    12.     @Override  
    13.     protected void onCreate(Bundle savedInstanceState) {  
    14.         super.onCreate(savedInstanceState);  
    15.         setContentView(R.layout.activity_main);  
    16.         Animation rotate = AnimationUtils.loadAnimation(this, R.drawable.rotate_anim);  
    17.         ((ImageView)findViewById(R.id.img)).setAnimation(rotate);  
    18.         ((ImageView)findViewById(R.id.img)).startAnimation(rotate);  
    19.     }  
    20. }  



    这样,运行工程,一个旋转的Android小绿人就出现了。PS:不知道怎么制作动态图,效果展示不了。

    在编写过程中有两个地方需要大家注意:

    1、在rotate_anim.xml文件中,最外层的item名字要为rotate,而不是set

    [java] view plain copy
     
    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <set xmlns:android="http://schemas.android.com/apk/res/android" >  
    3.       <rotate  
    4.             android:fromDegrees="0"   
    5.             android:interpolator="@android:anim/linear_interpolator"//设置转动速率,这里设置的是匀速转动  
    6.             android:pivotX="50%"  
    7.             android:pivotY="50%"  
    8.             android:toDegrees="359"  
    9.             android:duration = "1500"  
    10.             android:repeatCount = "-1"  
    11.             android:drawable = "@drawable/ic_launcher"  
    12.             android:visible = "true">  
    13.         </rotate>  
    14.   
    15. </set>  

    如果代码如上所示,是set的话,属性android:interpolator就会失效。具体原因我没有找到,有知道的朋友希望能在博文下方解惑,多谢。

    这种情况下 需要在代码中设置动画的interpolator:

    [java] view plain copy
     
    1. Animation rotate = AnimationUtils.loadAnimation(this, R.drawable.rotate_anim);  
    2.         LinearInterpolator lin = new LinearInterpolator();    
    3.         rotate.setInterpolator(lin);    
    4.         ((ImageView)findViewById(R.id.img)).setAnimation(rotate);  
    5.         ((ImageView)findViewById(R.id.img)).startAnimation(rotate);  

    2.我试过在布局文件中直接设置ImageView的src:android:src="@drawable/rotate_anim" 结果是图片会出现,但是不会旋转,所以不要这样做。

    3. 如果ImageView本身就带图片了,那么rotate里面设置的drawable属性是无效的。会优先使用ImageView自身的图片


    4.设置android:drawable属性的时候,不要忘了设置android:visible = "true",因为它默认是false(不可见)的。

    在Java代码中:

    RotateAnimation共有三个构造方法,这里详细讲述第三个,也就是参数最多的那个。
    下面是Google官网中对于RotateAnimation的相关参数介绍:
     

    这里面大部分参数已经在上面介绍过了,重点说下pivotXType与pivotYType

    int pivotXType,  动画在X轴相对于物件位置类型,与下面的pivotXValue结合,确定X轴上旋转中心。

    可能值为:Animation.ABSOLUTE,Animation.RELATIVE_TO_SELF, Animation.RELATIVE_TO_PARENT

    如果pivotXType=Animation.ABSOLUTE,则此参数为旋转中心在屏幕上X轴的值;

    如果pivotXType=Animation.RELATIVE_TO_PARENT,则参数pivotXValue为旋转中心在父控件水平位置百分比,如0.5表示在父控件水平方向中间位置;
    如果pivotXType=Animation.RELATIVE_TO_SELF,则参数pivotXValue为旋转中心在控件自身水平位置百分比,如果X和Y的Value都设置为0.5,则该控件以自身中心旋转。

    好了,贴代码: activity_main.xml

    [java] view plain copy
     
    1. <RelativeLayout 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.   
    6.     <ImageView  
    7.         android:id="@+id/img"  
    8.         android:layout_centerInParent="true"  
    9.         android:layout_width="wrap_content"  
    10.         android:layout_height="wrap_content"  
    11.         android:src="@drawable/ic_launcher"/>  
    12.   
    13. </RelativeLayout>  

    MainActivity.java

    [java] view plain copy
     
    1. package com.example.rotateanimation;  
    2.   
    3. import android.app.Activity;  
    4. import android.os.Bundle;  
    5. import android.view.animation.Animation;  
    6. import android.view.animation.AnimationUtils;  
    7. import android.view.animation.LinearInterpolator;  
    8. import android.view.animation.RotateAnimation;  
    9. import android.widget.ImageView;  
    10.   
    11. public class MainActivity extends Activity {  
    12.     private ImageView img;  
    13.     @Override  
    14.     protected void onCreate(Bundle savedInstanceState) {  
    15.         super.onCreate(savedInstanceState);  
    16.         setContentView(R.layout.activity_main);  
    17.         img = (ImageView) findViewById(R.id.img);  
    18.         //用xml实现  
    19.     /*    Animation rotate = AnimationUtils.loadAnimation(this, R.drawable.rotate_anim); 
    20. //        LinearInterpolator lin = new LinearInterpolator();   
    21. //        rotate.setInterpolator(lin);   
    22.         img.setAnimation(rotate); 
    23.        img.startAnimation(rotate);*/  
    24.         //用Java code实现  
    25.         RotateAnimation rotate  = new RotateAnimation(0f, 360f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);  
    26.         LinearInterpolator lin = new LinearInterpolator();    
    27.         rotate.setInterpolator(lin);  
    28.         rotate.setDuration(1500);//设置动画持续时间   
    29.         rotate.setRepeatCount(-1);//设置重复次数   
    30.         rotate.setFillAfter(true);//动画执行完后是否停留在执行完的状态   
    31.         rotate.setStartOffset(10);//执行前的等待时间   
    32.         img.setAnimation(rotate);   
    33.     }  
    34. }  

    rotate里还有很多set属性的方法,跟XML中的属性一一对应,有兴趣的可以自己去尝试一下。

    原创博文,转载请注明出处

    以上就是RotateAnimation的内容,有不对的地方欢迎指正~

    点击下载源码

    参考文章:

    1.http://my.oschina.net/ryanisme/blog/109674

    2.http://www.android100.org/html/201304/24/2282.html

    3.http://blog.csdn.net/jason0539/article/details/16370405

  • 相关阅读:
    ios开发系列-准备工作
    tests
    腾讯DBA官方博客开通了,欢迎交流
    腾讯DBA官方博客开通了
    [HNOI2008]水平可见直线
    BZOJ-4518 征途
    CDQ分治与整体二分
    HYSBZ-1176 Mokia
    二逼平衡树
    可持久化数组
  • 原文地址:https://www.cnblogs.com/dongweiq/p/6863521.html
Copyright © 2020-2023  润新知