1. 程式人生 > >剖析Android動畫(圖片閃爍、左右搖擺、上下晃動等效果)

剖析Android動畫(圖片閃爍、左右搖擺、上下晃動等效果)

圖片閃爍,類似這樣。
17065414.gif

左右搖擺:
2011-11-22-16-11-09.gif
一、續播  (不知道取什麼名字好,就是先播放動畫A, 接著播放動畫B)
        有兩種方式。
        第一種,分別動畫兩個動畫,A和B, 然後先播放動畫A,設定A 的 AnimationListener。當onAnimationEnd觸發(即A播放完畢)時,開始播放B。
  1.      animation1.setAnimationListener(new Animation.AnimationListener() {  
  2. @Override  
  3. public void onAnimationStart(Animation animation) {  
  4. }  
  5. @Override  
  6. public void onAnimationRepeat(Animation animation) {  
  7. }  
  8. @Override  
  9. public void onAnimationEnd(Animation animation) {  
  10.     animation2.start();  
  11. }  
  12. );  
複製程式碼 第二種,寫一個動畫集AnimationSet,在其中定義動畫A和B,為動畫B設定startOffset, 其值就是前一個動畫播放的所需的時間。

        這邊舉一個例子,動畫A是 透明度從 0.1 到 1.0 , 動畫B是透明度從1.0到0.1,  使用下面這個動畫集你就可以看到整個變化過程。
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <set xmlns:android="http://schemas.android.com/apk/res/android">  
  3.     <alpha  
  4.         android:fromAlpha="0.2"  
  5.         android:toAlpha="1.0"  
  6.         android:duration="3000"  
  7.         />  
  8.     <alpha  
  9.         android:startOffset="3000"  
  10.         android:fromAlpha="1.0"  
  11.         android:toAlpha="0.2"  
  12.         android:duration="3000"  
  13.         />  
  14. </set>  
複製程式碼 其中android:startOffset="3000"  表示延遲3秒後再執行。 如果去掉其中的 android:startOffset="3000" , 你就什麼效果也看不到了。 因為兩個動畫會同時播放。

二、迴圈
        有時候,我們可能需要實現一個圖片不停閃爍的功能(比如天氣預報中的緊急警報功能),  或者有的時候我們需要實現圖片左右晃動,都需要迴圈動畫來實現。
        同樣,也有兩種辦法。
第一種,設定兩個動畫A 和 B, 動畫A 是透明度 0 -1, 動畫B是1 - 0, 然後對這兩個動畫都進行監聽, A 結束執行B, B結束執行A.. 無限迴圈...
第二種,利用Animation的setRepeatCount、setRepeatMode來實現動畫迴圈。

比如閃爍(透明度亮 -> 暗, 暗->亮,如此迴圈)
  1. //閃爍  
  2. AlphaAnimation alphaAnimation1 = new AlphaAnimation(0.1f, 1.0f);  
  3. alphaAnimation1.setDuration(3000);  
  4. alphaAnimation1.setRepeatCount(Animation.INFINITE);  
  5. alphaAnimation1.setRepeatMode(Animation.REVERSE);  
  6. iv.setAnimation(alphaAnimation1);  
  7. alphaAnimation1.start();  
複製程式碼 alphaAnimation1.setRepeatCount(Animation.INFINITE); 表示重複多次。 也可以設定具體重複的次數,比如alphaAnimation1.setRepeatCount(5);
alphaAnimation1.setRepeatMode(Animation.REVERSE);表示動畫結束後,反過來再執行。 該方法有兩種值, RESTART 和 REVERSE。 RESTART表示從頭開始,REVERSE表示從末尾倒播。

懶得螢幕錄影了,類似下面的效果:


再比如左右搖擺
  1. //搖擺  
  2. TranslateAnimation alphaAnimation2 = new TranslateAnimation(150f, 350f, 50, 50);  
  3. alphaAnimation2.setDuration(1000);  
  4. alphaAnimation2.setRepeatCount(Animation.INFINITE);  
  5. alphaAnimation2.setRepeatMode(Animation.REVERSE);  
  6. iv.setAnimation(alphaAnimation2);  
  7. alphaAnimation2.start();  
複製程式碼

其中 iv 是一個ImageView。

效果例子問題總結:

實驗:拖動一個view使之移動,鬆開後view會移動到固定的位置

結果:每當view回到指定位置的動畫結束後,view都會回到起始位置,於是我設定了AnimationListener,在onAnimationEnd裡調整了view的位置,但是在動畫結束的一瞬間view還是會閃動一下。
關於setFillAfter設為true的方法我也嘗試過。不會閃動,但是下一次拖拽會出現問題。

總結:

1、在onAnimationEnd里加view.clearAnimation();

2、view.clearAnimation(); 雖然不會出現閃動現象,但是如果view裡面有listView,拖動list到邊緣出現黃色高光(2.3版)會異常,黃光出現過渡不自然,就像由32位顏色變到了24位,估計是由於動畫被強制清除的原因。
解決辦法是不用view.clearAnimation(),
在onAnimationEnd里加
TranslateAnimation anim = new TranslateAnimation(0,0,0,0);
view.setAnimation(anim);
既不閃動,也不會出現list拖動黃光異常現象。
清楚動畫,然後再移動位置,這樣就不會閃爍了