Animation動畫詳解

這兩天總結了一下animation動畫的基礎知識，但願對初學者有個幫助，同時我也是名初學者，如下主要寫的是核心代碼，相信你們能夠理解的，如有須要源代碼的能夠回帖哦！但願獲得你們的支持，這將是我發展的動力！ Animations動畫介紹： Animation動畫是將動畫經過xml或者java代碼定義，並按照定義好的圖像變換方式、觸發時間、持續時間、循環次數等相關定義來播放動畫。 Android中動畫的實現分兩種方式，一種方式是補間動畫 Tween Animation，就是說你定義一個開始和結束，中間的部分由程序運算獲得。另外一種叫逐幀動畫 Frame Animation，就是說一幀一幀的連起來播放就變成了動畫。 AnimationSet的使用方法： 什麼是 AnimationSet ？        一、AnimationSet是Animation的子集；        二、一個AnimationSet包含了一系列的Animation；        三、針對AnimationSet設置一些Animation的常見屬性（如startOffset，duration等等），能夠被包含在AnimationSet當中的Animation集成； Interpolator的使用方法： 什麼是 Interpolator ？ Interpolator 定義了動畫變化的速率，提供了對動畫進度的控制，在 Animations 框架當中定義瞭如下幾種 Interpolator ： LinearInterpolator：在動畫開始和結束過程當中以均勻的速率改變； AccelerateInterpolator：在動畫開始的地方速率改變比較慢，而後開始加速； DecelerateInterpolator：在動畫開始的地方速率改變比較慢，而後開始減速； AccelerateDecelerateInterpolator：在動畫開始與結束的地方速率改變比較慢，在中間的時候加速； CycleInterpolator：動畫循環放特定的次數，速率改變沿着正弦曲線； 1、補間動畫(一)補間動畫介紹： 補間動畫  Tween Animation ，就是說你定義一個開始和結束，中間的部分由程序運算獲得。 (二)補間動畫的分類： 這四種補間動畫都是Animation的子類 透明補間動畫:  AlphaAnimation   淡入淡出效果 縮放補間動畫:  ScaleAnimation  縮放效果 旋轉補間動畫:  RotateAnimation  旋轉效果 轉移補間動畫:  TranslateAnimation   移動效果 (三)補間動畫的通用屬性(設置animationSet) 1 、 setDuration(longdurationMills); 設置動畫持續時間 ( 單位：毫秒 ) 2 、 setFileAfter(booleanfillAfter); 若是 fillAfter 的值爲 true ，則動畫執行後，空間將停留在執行結束的狀態； 3 、 setFillBefore(booleanfillBefore); 若是 fillBefore 的值爲 true ，則動畫執行後，控件將回到動畫執行以前的狀態； 4 、 setStartOffSet(longstartOffSet); 設置動畫執行以前的等待時間； 5 、 setRepeatCount(intrepeatCount); 設置動畫重複執行的次數； (四)使用補間動畫的第一種方法步驟（純java代碼）： 一、建立一個AnimationSet對象 二、根據須要建立相應的Animation對象 三、根據軟件動畫的需求，爲Animation對象設置相應的數據； 四、將Animation對象添加到AnimationSet對象當中； 五、使用控件對象開始執行AnimationSet； AlphaAnimation（淡入淡出效果）： AlphaAnimation alphaAnimation= new AlphaAnimation(fromAlpha, toAlpha); 參數介紹： fromAlpha: 動畫開始時的透明度， 1 表示徹底不透明， 0 表示全透明 toAlpha: 動畫結束時的透明度 代碼以下： // 建立一個 AnimationSet 對象 AnimationSet animationSet =  new  AnimationSet( true ); // 建立一個 AlphaAnimation 對象 AlphaAnimation alphaAnimation =  new  AlphaAnimation(1, 0); // 設置動畫執行的時間（單位：毫秒）       alphaAnimation.setDuration(1000); // 將 AlphaAnimation 對象添加到 AnimationSet 當中       animationSet.addAnimation(alphaAnimation); // 使用 ImageView 的 startAnimation 方法開始執行動畫        imageView .startAnimation(animationSet); TranslateAnimation（移動效果）： TranslateAnimationtranslateAnimation= new  TranslateAnimation( fromXType,fromXValue, toXType, toXValue, fromYType, fromYValue, toYType, toYValue); 參數介紹： fromXType: 動畫起始時 X 軸的位置 fromXValue: 0f toXType ：動畫結束時 X 軸的位置 toXValue:  0.5f fromYType: 動畫起始時 Y 軸的位置 fromYValue:0f toYType: 動畫結束時 Y 軸的位置 toYValue:   0.5f 注：若沒有指定 fromXType,toXType, fromYType,toYType 的時候，默認是以本身爲相對參照物 java 代碼以下：    AnimationSet animationSet =  new  AnimationSet( true ); TranslateAnimationtranslateAnimation =  new  TranslateAnimation( Animation. RELATIVE_TO_SELF ,0f,Animation. RELATIVE_TO_SELF , 0.5f, Animation. RELATIVE_TO_SELF , 0f, Animation. RELATIVE_TO_SELF , 1.0f);          translateAnimation.setDuration(1000);       animationSet.addAnimation(translateAnimation);           imageView .startAnimation(animationSet); RotateAnimation（旋轉效果）： RotateAnimationrotateAnimation= new RotateAnimation(fromDegrees, toDegrees, pivotXType, pivotXValue, pivotYType,pivotYValue); 參數介紹： fromDegrees ： 動畫起始時物件的角度 toDegrees ： 動畫結束時物件的角度，能夠大於 360 ，也能夠是負數 pivotXType：動畫相對於物件的x軸的開始位置 Animation.RELATIVE_TO_SELF相對於自身的座標 Animation. ABSOLUTE  絕對座標 Animation. RELATIVE_TO_PARENT相對於父控件身的座標 pivotXValue ：浮點數值  1f 最下面， 0f 最左邊 pivotYType：動畫相對於物件的Y軸的開始位置 pivotYValue ：浮點數值  1f 最下面， 0f 最左邊 注：當角度爲負數時，表示逆時針旋轉；當角度爲正數時，表示順時針旋轉！ java 代碼以下： AnimationSet animationSet =  new  AnimationSet( true );    RotateAnimationrotateAnimation =  new  RotateAnimation(0, 360,                 Animation. RELATIVE_TO_PARENT ,1f,                 Animation. RELATIVE_TO_PARENT ,0f);          rotateAnimation.setDuration(5000);          animationSet.addAnimation(rotateAnimation);           imageView .startAnimation(animationSet); ScaleAnimation（縮放效果）： ScaleAnimationscaleAnimation = new ScaleAnimation(fromX, toX, fromY, toY, pivotXType, pivotXValue, pivotYType,pivotYValue); 參數介紹： fromX ：動畫起始時 X 軸上的伸縮尺寸  1f toX ：動畫結束時 X 軸上的伸縮尺寸   0.1f fromY ：動畫起始時 Y 軸上的伸縮尺寸  1f toY ：動畫結束時 Y 軸上的伸縮尺寸 1f pivotXType ：動畫相對於物件的 X 軸的開始位置 pivotXValue ： pivotYType ：動畫相對於物件的 Y 軸的開始位置 pivotYValue 注： 0 表示收縮到沒有， 1 表示正常狀態！ java 代碼以下： AnimationSet animationSet =  new  AnimationSet( true ); ScaleAnimation scaleAnimation =   new  ScaleAnimation(1, 0.1f, 1, 0.1f, Animation. RELATIVE_TO_SELF,0.5f,Animation . RELATIVE_TO_SELF , 0.5f);          animationSet.addAnimation(scaleAnimation);          animationSet.setStartOffset(1000);          animationSet.setFillAfter( true );          animationSet.setFillBefore( false );          animationSet.setDuration(2000);           imageView .startAnimation(animationSet); 注：在 java 代碼中可使用多種動畫效果！ 代碼以下： //  聲明一個 AnimationSet 對象          AnimationSetanimationSet =  new AnimationSet( false );          AlphaAnimationalpha =  new AlphaAnimation(1.0f, 0.0f);          RotateAnimationrotate =  new RotateAnimation(0, 360,                 Animation. RELATIVE_TO_SELF ,0.5f,                 Animation. RELATIVE_TO_SELF ,0.5f);          animationSet.addAnimation(alpha);          animationSet.addAnimation(rotate);          animationSet.setDuration(2000);          animationSet.setStartOffset(500);           imageView .startAnimation(animationSet); (五)使用補間動畫的第二種方法步驟： 1 、在 res 文件夾下面新建一個名爲 anim 的文件夾； 2 、建立 xml 文件，並首先加入 set 標籤，該標籤以下： <? xml  version="1.0"encoding="utf-8"?> < set  xmlns:android="http://schemas.android.com/apk/res/android"     android:interpolator="@android :anim/accelerate_interpolator"> </ set > 3 、在該 (set 標籤 ) 標籤當中加入 rotate ， alpha ， scale 或者 translate 標籤； 4 、在代碼當中使用 AnimationUtils 當中裝載 xml 文件，並生產 Animation 對象； AlphaAnimation（淡入淡出效果）： alpha.xml ： <? xml  version="1.0"encoding="utf-8"?> < set  xmlns:android="http://schemas.android.com/apk/res/android"     android:interpolator="@android :anim/accelerate_interpolator">     < alpha         android:duration="500"         android:fromAlpha="1.0"         android:startOffset="500"         android:toAlpha="0.0" /> </ set > Java 代碼： // 使用 AnimationUtils 裝載動畫設置文件 Animation animation=AnimationUtils.loadAnimation( MainActivity. this , R.anim. alpha );          imageView .startAnimation(animation); TranslateAnimation（移動效果）： translate.xml <? xml  version="1.0"encoding="utf-8"?> < set  xmlns:android="http://schemas.android.com/apk/res/android"     android:interpolator="@android :anim/accelerate_interpolator">      < translate         android:fromXDelta="50%"         android:toXDelta="100%"         android:fromYDelta="0%"         android:toYDelta="100%"         android:duration="2000" /> </ set > Java 代碼： // 使用 AnimationUtils 裝載動畫設置文件 Animation animation=AnimationUtils.loadAnimation( MainActivity. this , R.anim. translate );          imageView .startAnimation(animation); RotateAnimation（旋轉效果）： rotate.xml: <? xml  version="1.0"encoding="utf-8"?> < set  xmlns:android="http://schemas.android.com/apk/res/android"     android:interpolator="@android :anim/accelerate_interpolator">      < rotate  android:fromDegrees="0"         android:toDegrees="360"         android:pivotX="50%"         android:pivotY="50%"         android:duration="5000" /> </ set > 注： android:pivotX 的值共有三中設置方法： android:pivotX="50" 這種方法使用絕對位置定位； android:pivotX="50%" 這種方法相對控件自己定位； android:pivotX="50%p" 這種方法相對控件的父控件定位； android:pivotY 的值同上！ Java 代碼： // 使用 AnimationUtils 裝載動畫設置文件 Animation animation=AnimationUtils.loadAnimation( MainActivity. this , R.anim. rotate );          imageView .startAnimation(animation); ScaleAnimation（縮放效果）： scale.xml: <? xml  version="1.0"encoding="utf-8"?> < set  xmlns:android="http://schemas.android.com/apk/res/android"     android:interpolator="@android :anim/accelerate_interpolator">      < scale  android:fromXScale="1.0"         android:toXScale="0.0"         android:fromYScale="1.0"         android:toYScale="0.0"         android:pivotX="50%"         android:pivotY="50%"         android:duration="2000" /> </ set > Java 代碼： // 使用 AnimationUtils 裝載動畫設置文件 Animation animation=AnimationUtils.loadAnimation( MainActivity. this , R.anim. sacle );          imageView .startAnimation(animation); 注：在 xml 文件中能夠同時設置多種動畫效果！ 代碼以下： <? xml  version="1.0"encoding="utf-8"?> < set  xmlns:android="http://schemas.android.com/apk/res/android"     android:interpolator="@android :anim/accelerate_interpolator"     android:shareInterpolator="true">         < alpha         android:fromAlpha="1.0"         android:toAlpha="0.0"         android:startOffset="500"         android:duration="2000" />      < rotate  android:fromDegrees="0"         android:toDegrees="360"         android:pivotX="50%"         android:pivotY="50%"         android:duration="2000" /> </ set > 2、逐幀動畫Frame-By-Frame Animations Frame動畫是經過對多張系列幀圖片的不停切換從而達到視覺上的動畫效果。 (一)Frame動畫的通用屬性(設置animationDrawable) 1 、 animationDrawable.start();   啓動動畫 2 、 animationDrawable.stop();   中止動畫 3 、 isRunning     當前動畫是否在運行 4 、 getNumberOfFrames   動畫中幀的數目 5 、 getDuration   指定索引在動畫中的毫秒數 6 、 addFrame   添加幀到動畫中 7 、 nextFrame   動畫下一幀 8 、 setOneShot   設置是否循環 2、逐幀動畫Frame-By-Frame Animations Frame動畫是經過對多張系列幀圖片的不停切換從而達到視覺上的動畫效果。 (一)Frame動畫的通用屬性(設置animationDrawable) 1 、 animationDrawable.start();   啓動動畫 2 、 animationDrawable.stop();   中止動畫 3 、 isRunning     當前動畫是否在運行 4 、 getNumberOfFrames   動畫中幀的數目 5 、 getDuration   指定索引在動畫中的毫秒數 6 、 addFrame   添加幀到動畫中 7 、 nextFrame   動畫下一幀 8 、 setOneShot   設置是否循環 (二)逐幀動畫的使用方法： 1 、在 res/drawable 文件夾下多放幾張圖片，並在其目錄下新建一個 anim_nv.xml 文件， 代碼以下： <? 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/nv1" android:duration="500" />      < item  android:drawable="@drawable/nv2" android:duration="500" />      < item  android:drawable="@drawable/nv3" android:duration="500" />      < item  android:drawable="@drawable/nv4" android:duration="500" /> </ animation-list > 其中： android:oneshot = "false"   該屬性設置圖片循環播放 android:duration = "500"    該屬性設置每幅圖片的顯示時間爲 500ms 2 、在 java 代碼中寫： imageView .setBackgroundResource(R.drawable. anim_nv ); // 建立 AnimationDrawable 對象 AnimationDrawable animationDrawable=(AnimationDrawable) imageView.getBackground();    animationDrawable.start(); LayoutAnimationController介紹 什麼是 LayoutAnimationController ？        1 、 LayoutAnimationController 用於爲一個 layout 裏面的控件，或者是一個 ViewGroup 裏面的控件設置動畫效果；        2 、每個控件都有相同的動畫效果；        3 、這些控件的動畫效果在不一樣的時間顯示出來；        4 、 LayoutAnimationController 能夠在 xml 文件當中設置，也能夠在代碼中進行設置； 1、在xml佈局當中使用LayoutAnimationController的步驟： 1 、在 res/anim 文件夾當中建立一個新文件，名爲 list_anim_layout.xml 代碼以下： <? xml  version="1.0"encoding="utf-8"?> < layoutAnimation  xmlns:android="http://schemas.android.com/apk/res/android"     android:animation="@anim/list_anim"     android:animationOrder="normal" android:delay= "2"  /> 其中： list_anim.xml 爲設置動畫的文件（如 alpha.xml ） android:animation = "@anim/list_anim"  在佈局文件當中爲 ListView 添加以下配置 android:animationOrder = "normal"   動畫執行順序   random 隨機、 normal 正常、 reverse 倒序 android:delay = "2"   兩個控件顯示間隔爲 0.5s 2 、在 main.xml 佈局文件當中爲 ListView 標籤添加以下配置： android:layoutAnimation = "@anim/list_anim_layout" 注：在 java 代碼中什麼也不須要寫！ 2、在java代碼當中使用LayoutAnimationController的步驟： 1 、建立一個 Animation 對象 能夠經過裝載xml文件，或者直接使用Animation的構造函數建立Animation對象 Animationanimation = (Animation)AnimationUtils.loadAnimation( MainActivity. this , R.anim. list_anim ); 2 、使用以下代碼建立 LayoutAnimationController 對象 LayoutAnimationController lac =  new LayoutAnimationController(animation); 3 、設置控件的屬性 // 圖片顯示的順序 //ORDER_NORMAL 表示順序播放， ORDER_RANDOM 隨機播放， ORDER_REVERSE 倒序播放 lac.setOrder(LayoutAnimationController. ORDER_NORMAL ); // 圖片顯示的間隔 lac.setDelay(0.5f); 4 、爲 ListView 設置 LayoutAnimationController 屬性 listView .setLayoutAnimation(lac); AnimationListener介紹： 什麼是 AnimationListener ？ 1 、 AnimationListener 是一個監聽器； 2 、該監聽器在動畫執行的各個階段會獲得通知，從而調用相應的方法； 3 、主要包含如下的三個方法： 一、onAnimationEnd(Animation animation) 動畫效果結束時調用 二、onAnimationRepeat(Animation animation) 動畫效果重複時調用 三、onAnimationStart(Animation animation) 動畫效果啓動時調用 操做步驟： 1 、爲佈局設置 id 2 、建立一個 ViewGroup 並初始化 ViewGroupviewGroup =(ViewGroup)findViewById(R.id. layoutId ); 3 、在刪除按鈕 removeButton 裏設置監聽 removeButton  = (Button)findViewById(R.id. removeButtonId ); removeButton .setOnClickListener( new  OnClickListener() {           @Override     public   void  onClick(View v) {              // 建立一個淡出效果的 Animation 對象 AlphaAnimation animation =  new AlphaAnimation(1.0f,0.0f);              // 爲 Animation 對象設置屬性             animation.setDuration(1000);             animation.setStartOffset(500);              // 爲 Animation 對象設置監聽器 animation.setAnimationListener( new  AnimationListener() {        @Override        public   void  onAnimationStart(Animationanimation) {                     //  TODO  Auto-generatedmethod stub                 }        @Override        public   void  onAnimationRepeat(Animationanimation) {                     //  TODO  Auto-generatedmethod stub                 }        @Override        public   void  onAnimationEnd(Animation animation){                     // 從 viewGroup 當中刪除掉 imageView 控件                     viewGroup .removeView( imageView );                 }             });              imageView .startAnimation(animation);          }       }); 4 、在添加按 addButton 鈕裏設置監聽 addButton = (Button)findViewById(R.id. addButtonId ); addButton .setOnClickListener( new  OnClickListener() {           @Override           public   void  onClick(View v) { // 建立了一個淡入效果的 Animation 對象 AlphaAnimation animation =  new  AlphaAnimation(0.0f,1.0f);             animation.setDuration(1000);             animation.setStartOffset(500); // 建立一個新的 ImageView ImageView imageViewAdd =  new  ImageView(MainActivity. this );       imageViewAdd.setImageResource(R.drawable. icon ); // 將新的 ImageView 添加到 viewGroup 當中 viewGroup .addView(imageViewAdd, new  LayoutParams(LayoutParams . FILL_PARENT , LayoutParams. WRAP_CONTENT ));              // 啓動動畫             imageViewAdd.startAnimation(animation);          }       }); 注： android 平臺不支持 Gif 動畫播放功能，須要使用 Easy Gif 等第三方工具將其切爲每幀一個圖片，而後再用 Frame 動畫的使用方法！