zoukankan      html  css  js  c++  java
  • 【转】Android:Animation的简单学习--不错

    原文网址:http://blog.csdn.net/huangbiao86/article/details/6683665

    Animation动画效果。提供了一系列的动画效果,可以应用大多数 的控件。

    一、Animations从总体上来说可以分为两大类:

    1、TweenedAnimations:该类提供了旋转,移动,伸展,和淡出竺效果;

    2、Frame-by-FrameAmimations:这一类可以创建一个Drawable序列:这些Drawable可以按照指定的时间间歇一个一个的显示。

    二、TwenedAnimations的分类

    a)        Alpha:淡入淡出效果

    b)        Scale:缩放效果

    c)        Rotate:旋转效果

    d)        Translate:移动效果

    这四种动画效果对应四个不同的类,都有不同的参数,但是这四个不同的动画效果有共同的参数:下面简单介绍下面几种:

    setDuration(long durationMills)设置动画持续时间,单位毫秒 ;

    setFillAfter(boolean fillAfter)如果为true的话,动画执行后,控件停留在执行结束的状态;

    setFillBefore(boolean fillBefore)

    setStartOffSet(long startOffSet)设置动画执行之前等待时间;

    setRepeatCount(int repeatCount)设置动画重复的次数

    下面简单介绍一下,TewnedAnimation的使用步骤:

    1、创建一个AnimationSet,存放动画集合,也可以只有一个动画。

    2、根据需要创建对应的Animation

    3、根据动画的需求,为Animation创建相对应的数据。

    4、将Animation对象添加到AnimationSet

    5、使用控件开始执行Animation:textView.startAnimation(AnimateionSet)当然里面的参数也可以是Animate,由于Animation是AnimationSet的父类,所以不会出错

    我们来做一个简单的例子,了解Animation的用法 :

    1、 在main.xml文件里面添加四个按钮控件,和一个图片控件,用来进行测试,图片用于显示动画效果;

    [html] view plain copy
     
     print?
    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    3.     android:orientation="vertical"  
    4.     android:layout_width="fill_parent"  
    5.     android:layout_height="fill_parent"  
    6.     >  
    7. <ImageView android:id="@+id/image"  
    8.     android:src="@drawable/icon"  
    9.     android:layout_width="wrap_content"  
    10.     android:layout_height="wrap_content"  
    11.     android:layout_margin="100dip"/>  
    12. <Button android:id="@+id/alpha"  
    13.     android:layout_width="fill_parent"  
    14.     android:layout_height="wrap_content"  
    15.     android:text="@string/alpha"/>  
    16. <Button android:id="@+id/scale"  
    17.     android:layout_width="fill_parent"  
    18.     android:layout_height="wrap_content"  
    19.     android:text="@string/scale"/>  
    20. <Button android:id="@+id/rotate"  
    21.     android:layout_width="fill_parent"  
    22.     android:layout_height="wrap_content"  
    23.     android:text="@string/rotate"/>  
    24. <Button android:id="@+id/translate"  
    25.     android:layout_width="fill_parent"  
    26.     android:layout_height="wrap_content"  
    27.     android:text="@string/translate"/>  
    28. </LinearLayout>  

    2、编写Activity类,添加监听:并且在对应的监听事件上 加上动画效果(按上面介绍了的步骤进行)

    [java] view plain copy
     
     print?
    1. public class HelloAnimationActivity extends Activity {  
    2.     /** Called when the activity is first created. */  
    3.     Button b_alpha;  
    4.     Button b_scale;  
    5.     Button b_rotate;  
    6.     Button b_translate;  
    7.     ImageView iv;  
    8.     AnimationSet animationSet;  
    9.     @Override  
    10.     public void onCreate(Bundle savedInstanceState) {  
    11.         super.onCreate(savedInstanceState);  
    12.         setContentView(R.layout.main);  
    13.          
    14.         iv = (ImageView)findViewById(R.id.image);  
    15.         b_alpha = (Button)findViewById(R.id.alpha);  
    16.         b_scale = (Button)findViewById(R.id.scale);  
    17.         b_rotate = (Button)findViewById(R.id.rotate);  
    18.         b_translate = (Button)findViewById(R.id.translate);  
    19.           
    20.         b_alpha.setOnClickListener(new AlpahListener());  
    21.         b_scale.setOnClickListener(new ScaleListener());  
    22.         b_rotate.setOnClickListener(new RotateListener());  
    23.         b_translate.setOnClickListener(new TranslateListener());  
    24.           
    25.     }  
    26.       
    27.     class AlpahListener implements OnClickListener{  
    28.           
    29.         @Override  
    30.         public void onClick(View v) {  
    31.             //创建一个AnimationSet对象  
    32.             AnimationSet animationSet = new AnimationSet(true);  
    33.             //创建一个AlphaAnimation对象  
    34.             AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);  
    35.             //设置动画执行的时间(单位:毫秒)  
    36.             alphaAnimation.setDuration(1000);  
    37.             //将AlphaAnimation对象添加到AnimationSet当中  
    38.             animationSet.addAnimation(alphaAnimation);  
    39.             //使用ImageView的startAnimation方法开始执行动画  
    40.             iv.startAnimation(animationSet);  
    41.         }  
    42.           
    43.     }  
    44.       
    45.     class ScaleListener implements OnClickListener{  
    46.         /** 
    47.          * 从大到小的动画,x轴1到0.1,y轴1到0.1。中心为图片的中心(0.5f,0.5f) 
    48.          */  
    49.         @Override  
    50.         public void onClick(View arg0) {  
    51.             AnimationSet animationSet = new AnimationSet(true);  
    52.             ScaleAnimation scaleAnimation = new ScaleAnimation(1, 0.1f, 1, 0.1f,  
    53.                     Animation.RELATIVE_TO_SELF, 0.5f,  
    54.                     Animation.RELATIVE_TO_SELF, 0.5f);  
    55.             animationSet.addAnimation(scaleAnimation);  
    56.             animationSet.setStartOffset(1000);  
    57.             animationSet.setFillAfter(true);  
    58.             animationSet.setFillBefore(false);  
    59.             animationSet.setDuration(2000);  
    60.             iv.startAnimation(animationSet);  
    61.               
    62.         }  
    63.           
    64.     }  
    65.       
    66.     class RotateListener implements OnClickListener{  
    67.         /** 
    68.          * 以图片中心旋转360度;(0.5f,0.5f)表示图片的中心 
    69.          */  
    70.         @Override  
    71.         public void onClick(View arg0) {  
    72.             // TODO Auto-generated method stub  
    73.             animationSet = new AnimationSet(true);  
    74.             RotateAnimation rotateAnimation = new RotateAnimation(0, 360,  
    75.                     Animation.RELATIVE_TO_SELF, 0.5f,  
    76.                     Animation.RELATIVE_TO_SELF, 0.5f);  
    77.             rotateAnimation.setDuration(5000);  
    78.             animationSet.addAnimation(rotateAnimation);  
    79.             iv.setAnimation(rotateAnimation);  
    80.         }  
    81.           
    82.     }  
    83.       
    84.     class TranslateListener implements OnClickListener{  
    85.   
    86.         @Override  
    87.         public void onClick(View arg0) {  
    88.             // TODO Auto-generated method stub  
    89.             animationSet = new AnimationSet(true);  
    90.             TranslateAnimation translateAnimation = new TranslateAnimation(  
    91.                     Animation.RELATIVE_TO_SELF, 0f,  
    92.                     Animation.RELATIVE_TO_SELF, 0.5f,  
    93.                     Animation.RELATIVE_TO_SELF, 0f,  
    94.                     Animation.RELATIVE_TO_SELF, 1.0f);  
    95.             animationSet.addAnimation(translateAnimation);  
    96.             iv.setAnimation(animationSet);  
    97.         }  
    98.           
    99.     }  
    100. }  

    下面来看看Animation的第二种用法 :

    这种方法跟上一种差不多,只不过是将动画的布局,在xml文件里配置,配置动画;这样做的好处是一个动画配置可以重复应用,这种方法在面向对象的语言中是很注重的;

    在上一例子的基础上,在res目录下新建目录anim;在下面新建xml文件,就做为Animation的布局文件。

    xml文件编写方法:

    1、首先加入set标签。<set android:shareInterpolator="false" xmlns:android="http://schemas.android.com/apk/res/android">

    2、再在该标签当中加入rotate,alpha,scale,translate标签;

    在代码中用AnimationUtils静态函数,加载动画xml文件。

    如:

    [html] view plain copy
     
     print?
    1. <set android:shareInterpolator="false" xmlns:android="http://schemas.android.com/apk/res/android">  
    2.     <scale  
    3.         android:interpolator="@android:anim/accelerate_decelerate_interpolator"  
    4.         android:fromXScale="1.0"  
    5.         android:toXScale="1.4"  
    6.         android:fromYScale="1.0"  
    7.         android:toYScale="0.6"  
    8.         android:pivotX="50%"  
    9.         android:pivotY="50%"  
    10.         android:fillAfter="false"  
    11.         android:duration="1000" />  
    12.     <set android:interpolator="@android:anim/decelerate_interpolator">  
    13.         <scale  
    14.            android:fromXScale="1.4"  
    15.            android:toXScale="0.0"  
    16.            android:fromYScale="0.6"  
    17.            android:toYScale="0.0"  
    18.            android:pivotX="50%"  
    19.            android:pivotY="50%"  
    20.            android:startOffset="700"  
    21.            android:duration="400"  
    22.            android:fillBefore="false" />  
    23.         <rotate  
    24.            android:fromDegrees="0"  
    25.            android:toDegrees="50"  
    26.            android:toYScale="1.0"  
    27.            android:pivotX="50%"  
    28.            android:pivotY="50%"  
    29.            android:startOffset="700"  
    30.            android:duration="1400" />  
    31.     </set>  
    32. </set>  

    上面在一个xml文件中定义了 一系列的动画效果,注意:

    android:pivotX="50"这种方法使用绝对位置定位,相当于代码中的  Animation.ABSOLUTE

    android:pivotX="50%"这种方法相对于控件本身定位,相当于代码中的 Animation.RELATIVE_TO_SELF

    android:pivotX="50%p" 这种方法相对于控件 的父控件定位,相当于代码中上 Animation.RELATIVE_TO_PARENT

    如果需要调用 这个动画效果到某个控件 ,可以用下面的方法,给图片添加上面的一系列的动画效果,如果只希望有一个动画效果 ,那么也是一个xml文件:

    [java] view plain copy
     
     print?
    1. class AlpahListener implements OnClickListener{  
    2.           
    3.         @Override  
    4.         public void onClick(View v) {  
    5.             Animation animation = AnimationUtils.loadAnimation(HelloAnimationActivity.this, R.anim.animation_test);  
    6.             iv.startAnimation(animation);  
    7.         }  
    8.     }  

    这只是一段监听器代码。

    另外,如果我们直接在xml文件里面,直接加两个或多个效果:如下面:

    [html] view plain copy
     
     print?
    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.     android:shareInterpolator="true">  
    5.           
    6.     <alpha   
    7.         android:fromAlpha="1.0"  
    8.         android:toAlpha="0.0"  
    9.         android:startOffset="500"  
    10.         android:duration="2000" />  
    11.   
    12.     <rotate android:fromDegrees="0"  
    13.         android:toDegrees="360"  
    14.         android:pivotX="50%"  
    15.         android:pivotY="50%"  
    16.         android:duration="2000" />  
    17. </set>  

    这时候,如果给控件添加这个动画效果,那么这个xml文件里面的alpha和rotate会叠加,而且这两个动画效果共享@android:anim/accelerate_interpolator.都是逐渐加速;如果需要单个设置速率就需要在每个效果里添加属性

    [html] view plain copy
     
     print?
    1. android:interpolator="@android:anim/accelerate_interpolator"  

    Android 提供了几个 Interpolator 子类,实现了不同的速度曲线,如下:

    AccelerateDecelerateInterpolator 在动画开始与介绍的地方速率改变比较慢,在中间的时候加速
    AccelerateInterpolator 在动画开始的地方速率改变比较慢,然后开始加速
    CycleInterpolator 动画循环播放特定的次数,速率改变沿着正弦曲线
    DecelerateInterpolator 在动画开始的地方速率改变比较慢,然后开始减速
    LinearInterpolator 在动画的以均匀的速率改变


    Frame-by-FrameAmimations这一类可以创建一个Drawable序列:这些Drawable可以按照指定的时间间歇一个一个的显示,就像win7桌面背景图片切换一样,循环切换;

    使用方法:定义资源文件xml:

    [html] view plain copy
     
     print?
    1. <animation-list xmlns:android="http://schemas.android.com/apk/res/android"  
    2.     android:oneshot="true">  
    3.     <item android:drawable="@drawable/rocket_thrust1" android:duration="200" />  
    4.     <item android:drawable="@drawable/rocket_thrust2" android:duration="200" />  
    5.     <item android:drawable="@drawable/rocket_thrust3" android:duration="200" />  
    6. </animation-list>  

    其中item是轮流切换的图片;

    在代码中使用资源文件:

    [java] view plain copy
     
     print?
    1. AnimationDrawable rocketAnimation;  
    2.   
    3. public void onCreate(Bundle savedInstanceState) {  
    4.   super.onCreate(savedInstanceState);  
    5.   setContentView(R.layout.main);  
    6.   
    7.   ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);  
    8.   rocketImage.setBackgroundResource(R.drawable.rocket_thrust);  
    9.   rocketAnimation = (AnimationDrawable) rocketImage.getBackground();  
    10. }  
    11.   
    12. public boolean onTouchEvent(MotionEvent event) {  
    13.   if (event.getAction() == MotionEvent.ACTION_DOWN) {  
    14.     rocketAnimation.start();  
    15.     return true;  
    16.   }  
    17.   return super.onTouchEvent(event);  
    18. }  

    如果我们要给每一个动画添加监听器:如下面代码 :

    [java] view plain copy
     
     print?
    1. public class MainActivity extends Activity {  
    2.     /** Called when the activity is first created. */  
    3.     private Button removeButton = null;  
    4.     private Button addButton = null;  
    5.     private ImageView imageView = null;  
    6.     private ViewGroup viewGroup = null;  
    7.     @Override  
    8.     public void onCreate(Bundle savedInstanceState) {  
    9.         super.onCreate(savedInstanceState);  
    10.         setContentView(R.layout.main);  
    11.         removeButton = (Button)findViewById(R.id.removeButtonId);  
    12.         imageView = (ImageView)findViewById(R.id.imageViewId);  
    13.         removeButton.setOnClickListener(new RemoveButtonListener());  
    14.         viewGroup = (ViewGroup)findViewById(R.id.layoutId);//这里viewGroup是LinearLayout的id,这个viewGroup包括了下面所有的控件。  
    15.         addButton = (Button)findViewById(R.id.addButtonId);  
    16.         addButton.setOnClickListener(new AddButtonListener());  
    17.     }  
    18.     private class AddButtonListener implements OnClickListener{  
    19.         @Override  
    20.         public void onClick(View v) {  
    21.             //创建了一个淡入效果的Animation对象  
    22.             AlphaAnimation animation = new AlphaAnimation(0.0f,1.0f);  
    23.             animation.setDuration(1000);  
    24.             animation.setStartOffset(500);  
    25.             //创建一个新的ImageView  
    26.             ImageView imageViewAdd = new ImageView(MainActivity.this);  
    27.             imageViewAdd.setImageResource(R.drawable.icon);  
    28.             //将新的ImageView添加到viewGroup当中  
    29.             viewGroup.addView(imageViewAdd, new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT));  
    30.             //启动动画  
    31.             imageViewAdd.startAnimation(animation);  
    32.         }  
    33.           
    34.     }  
    35.       
    36.     private class RemoveButtonListener implements OnClickListener{  
    37.         @Override  
    38.         public void onClick(View v) {  
    39.             //创建一个淡出效果的Animation对象  
    40.             AlphaAnimation animation = new AlphaAnimation(1.0f,0.0f);  
    41.             //为Animation对象设置属性  
    42.             animation.setDuration(1000);  
    43.             animation.setStartOffset(500);  
    44.             //为Animation对象设置监听器  
    45.             animation.setAnimationListener(new RemoveAnimationListener());  
    46.             imageView.startAnimation(animation);  
    47.         }  
    48.     }  
    49.       
    50.     private class RemoveAnimationListener implements AnimationListener{  
    51.         //该方法在淡出效果执行结束之后被调用  
    52.         @Override  
    53.         public void onAnimationEnd(Animation animation) {  
    54.             System.out.println("end");  
    55.             //从viewGroup当中删除掉imageView控件  
    56.             viewGroup.removeView(imageView);  
    57.         }  
    58.        //该方法在动画重复执行的时候调用   
    59.         @Override  
    60.         public void onAnimationRepeat(Animation animation) {  
    61.             System.out.println("repeat");  
    62.         }  
    63.          //该方法在动画开始执行的时候,调用 。  
    64.         @Override  
    65.         public void onAnimationStart(Animation animation) {  
    66.             System.out.println("start");  
    67.         }  
    68.           
    69.     }  
    70. }  

    在实际应用中,后者可能会多一些,但是由于写xml的时候,编译器很多地方不会报错,所以维护也是一个问题;

  • 相关阅读:
    增强MyEclipse提示功能
    Mysql安装配置,修改初试密码。
    在我的电脑里面创建图标
    popup non topmost
    多线程下载或上传数据限速
    SynchronizationContext
    linux运维笔记——常用命令详解diff
    linux运维笔记——curl
    linux下mysql的源码安装
    shell编程——变量的数值计算
  • 原文地址:https://www.cnblogs.com/wi100sh/p/5379004.html
Copyright © 2011-2022 走看看