Android動畫機制-傳統動畫

NanEaton 8年前發布 | 5K 次閱讀安卓開發 Android開發移動開發

Android動畫機制-傳統動畫

概述

Android動畫機制-傳統動畫是指在Android3.0之前存在的兩種動畫機制，一種是逐幀動畫，也就是號首先人工畫出來每一個時間點的視圖效果，然后一張圖片一張圖片的播放形成動畫效果；

另一種就是補間動畫，就是開發人員指定開始與結束的情況，然后系統自動生成中間的圖形，不斷播放，形成動畫效果。

逐幀動畫

要開發逐幀動畫首先要畫出每一個時間點的圖形效果，也就是每一個幀，而且Android自身的解耦機制推薦我們應該在res中的anim（所有動畫公共的文件夾）新建xml來設計動畫。但還是在Java中使用代碼也可以

簡單使用

和其他動畫不同的是，代表逐幀動畫的根節點animation-list應該放在drawable文件夾中（Eclipse可以放在anim文件夾中）

在drwable中新建zhu_zhen.xml：

<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/fat_po_f01" android:duration="60"/>
    <item android:drawable="@drawable/fat_po_f02" android:duration="60"/>
    <item android:drawable="@drawable/fat_po_f03" android:duration="60"/>
</animation-list>

在layout中使用，既然是在drawable文件夾中，那么在@引用的時候就應該使用drawable，這里是把動畫設置為ImageView的背景：

<ImageView
        android:id="@+id/iv"
        android:layout_width="100dp" android:layout_height="100dp"
        android:background="@drawable/zhu_zhen"
        android:scaleType="center"/>
<!--并且兩個按鈕分別控制開關-->
    <LinearLayout android:layout_width="match_parent" android:layout_height="40dp"
                  android:orientation="horizontal">
        <Button android:layout_width="0dp" android:layout_height="match_parent"
                android:layout_weight="1"
                android:onClick="start" android:text="start"/>
        <Button android:layout_width="0dp" android:layout_height="match_parent"
                android:layout_weight="1"
                android:onClick="stop" android:text="stop"/>
    </LinearLayout>

android動畫機制201611091025

在Activity中使用：

private AnimationDrawable mDrawable;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    init();
}

private void init() {
    ImageView imageView = (ImageView) findViewById(R.id.iv);
    //把Drawable強制轉換成AnimationDrawable
    mDrawable = (AnimationDrawable) imageView.getBackground();
}

public void start(View view) {
    mDrawable.start();
}

public void stop(View view) {
    mDrawable.stop();
}</code></pre> 

最后效果就是上面的阿寶如上面所示，注意AnimationDrawable也是Drawable的子類： 
   
  sp161109_095811 
  注意事項 
  是每一幀的圖片格式一定要是png而且不要直接改后綴名應該用另存為 
  加入每一幀是其他格式比如gif那么就會報錯：Cannot generate texture from bitmap，而且ImageView整個是黑色的，無法正常顯示。 
  補間動畫 
  有四種形式，分別是AlpahAnimation、ScaleAnimation、TranslateAnimation、RotateAnimation，分別代表透明度動畫、縮放動畫，位移動畫、旋轉動畫。注意這里每一個都是以Animation結尾。 
   
  sp161109_103711 
  四種常見的動畫都是繼承自Animation，還有一個是AnimationSet代表的是動畫集合，另外一個不常用。 
  在上面的逐幀動畫中也可以使用Java代碼控制（有點麻煩）但是在補間動畫中兩種方式都比較簡單。 
  四種動畫共有的屬性： 
   
   duration持續時間 
   fillAfter在動畫執行完是否保持最后一幀還是返回第一幀 
   
  AlphaAnimation 
  在xml中使用 
  對應xml的標簽是alpha 
  快速建立動畫的方法： 在AS中不要在anim總創建 ，意思就是說不要點擊anim文件夾右鍵，而是點擊res右鍵，這樣可以直接控制跟標簽，而且AS會自動把文件轉到相應的目錄： 
   
  sp161109_104522 
  透明度動畫的特有屬性：開始和結束的透明度 
  <alpha xmlns:android="http://schemas.android.com/apk/res/android"
       android:fromAlpha="1.0"
       android:toAlpha="0">
</alpha> 
  在Activity中使用： 
  private void init() {
        mImageView = (ImageView) findViewById(R.id.iv);
        mAlphaAnimation = (AlphaAnimation) AnimationUtils.loadAnimation(MainActivity.this, R.anim.tween_alpha);
    }

    public void start(View view) {
        mAlphaAnimation.setDuration(3000);
        mAlphaAnimation.setFillAfter(true);
        mImageView.startAnimation(mAlphaAnimation);
    } 
  注意這里加載動畫使用的是AnimationUtils.loadAnimation 
   
  android動畫機制tweenalpah2016 
  用Java代碼實現 
  只要改寫一句話即可： 
  //        mAlphaAnimation = (AlphaAnimation) AnimationUtils.loadAnimation(MainActivity.this, R.anim.tween_alpha);
        mAlphaAnimation = new AlphaAnimation(1, 0); 
  兩個參數分別是開始和結束的透明度 
  ScaleAnimation 
  縮放動畫也是兩種實現方式一種是在xml，一個是在Java中，在xml對應的標簽是scale。 
  特有屬性： 
   
    fromYScale和toYScale（Y可以換成X）開始和結束的比例
  
    pivotX和pivotY縮放的中心點
  
   
  注意：一定要同時制定fromX和Y（兩組四個屬性）否則開始動畫就會立即消失 
  沒有指定縮放中心默認是以左上點作為中心 
  在xml中實現 
  <?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
       android:fromXScale="1.0" android:pivotX="50%"
       android:pivotY="50%" android:toXScale="0.2"
       android:fromYScale="1.0" android:toYScale="0.2">
</scale> 
  Activity中的實現代碼，基本沒有變化： 
  private void init() {
        mImageView = (ImageView) findViewById(R.id.iv);
        mScaleAnimation = (ScaleAnimation) AnimationUtils.loadAnimation(MainActivity.this, R.anim.tween_scale);
    }

    public void start(View view) {
        mScaleAnimation.setDuration(3000);
        mScaleAnimation.setFillAfter(true);
        mImageView.startAnimation(mScaleAnimation);
    } 
   
  android動畫機制tweenscaleh2016 
  使用Java實現 
  //      mScaleAnimation = (ScaleAnimation) AnimationUtils.loadAnimation(MainActivity.this, R.anim.tween_scale);
        mScaleAnimation = new ScaleAnimation(1, 0.2f, 1, 0.2f); 
  但是這里指定縮放中心困難，指定縮放比例簡單 
  TranslateAnimation 
  表示位置移動的動畫，特有屬性：fromXDelta（當然還有to，而且XY可以互換） 
  在xml中實現 
  <translate xmlns:android="http://schemas.android.com/apk/res/android" 
           android:fromXDelta="0" android:toXDelta="100">
</translate> 
  在Activity中引用，和上面的代碼基本一樣： 
  private void init() {
        mImageView = (ImageView) findViewById(R.id.iv);
        mTranslateAnimation = (TranslateAnimation) AnimationUtils.loadAnimation(MainActivity.this, R.anim.tween_translate);
    }

    public void start(View view) {
        mTranslateAnimation.setDuration(3000);
        mTranslateAnimation.setFillAfter(true);
        mImageView.startAnimation(mTranslateAnimation);
    } 
   
  android動畫機制tweentranslate2016 
  使用Java實現 
  依舊就是更改一句話，不過少創建一個文件： 
  //        mTranslateAnimation = (TranslateAnimation) AnimationUtils.loadAnimation(MainActivity.this, R.anim.tween_translate);
        mTranslateAnimation = new TranslateAnimation(0, 100, 0, 0); 
  效果和上面一樣 
  RotateAnimation 
  表示旋轉的動畫，特有屬性： 
   
   fromDegrees和toDegrees開始和結束的角度 
   pivotX和pivotY旋轉的中心點 
   
  在xml中實現 
  <?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
        android:fromDegrees="0"
        android:pivotX="50%" android:pivotY="50%" android:toDegrees="3600">
</rotate> 
   
  android動畫機制tweenrotate 
  在Avtivity中引用： 
  private void init() {
        mImageView = (ImageView) findViewById(R.id.iv);
        mRotateAnimation = (RotateAnimation) AnimationUtils.loadAnimation(MainActivity.this,R.anim.tween_roate);
    }

    public void start(View view) {
        mRotateAnimation.setDuration(3000);
        mRotateAnimation.setFillAfter(true);
        mImageView.startAnimation(mRotateAnimation);
    } 
  使用Java實現 
  老規矩，只因為在人群改寫一句代碼，從此忘不了你的容顏啊！！！ 
  //        mRotateAnimation = (RotateAnimation) AnimationUtils.loadAnimation(MainActivity.this,R.anim.tween_roate);
    mRotateAnimation = new RotateAnimation(0,3600); 
  這里還是中心點不好指定，默認是以左上角位旋轉中心 
  AnimationSet 
  最后一個，寫完去吃飯 
   
  img 
  代表動畫集合的類，就可可以同時播放幾個效果，在xml對應的標簽是set，注意的子標簽（scale，translate，rotate，alpha）有duration和fillAfter屬性，他們單獨使用沒有這個屬性。 
  而且還可以指定差速器（下一節細說） 
  在xml中實現 
  <set xmlns:android="http://schemas.android.com/apk/res/android"
     android:duration="3000"
     android:fillAfter="true">
    <alpha
        android:fromAlpha="1.0"
        android:toAlpha="0">
    </alpha>
    <rotate
        android:fromDegrees="0"
        android:pivotX="50%" android:pivotY="50%" android:toDegrees="3600">
    </rotate>

    <scale
        android:fromXScale="1.0" android:fromYScale="1.0"
        android:pivotX="50%" android:pivotY="50%"
        android:toXScale="0.2" android:toYScale="0.2">
    </scale>

    <translate
        android:fromXDelta="0" android:toXDelta="100">
    </translate>
</set> 
  就是把剛才的四個動畫復制一下，不過這里在跟標簽中指定了時間和fillAfter屬性 
   
  android動畫機制tweenset1141 
  在Activity中引用，效果還有一點炫： 
  private void init() {
        mImageView = (ImageView) findViewById(R.id.iv);
        mAnimationSet = (AnimationSet) AnimationUtils.loadAnimation(MainActivity.this, R.anim.tween_set);
    }

    public void start(View view) {
        mImageView.startAnimation(mAnimationSet);
    } 
  在java代碼實現 
  private void init() {
        mImageView = (ImageView) findViewById(R.id.iv);
//      構造參數是否分享差速器
        mAnimationSet = new AnimationSet(true);

        mRotateAnimation = (RotateAnimation) AnimationUtils.loadAnimation(MainActivity.this,R.anim.tween_roate);
        mRotateAnimation.setDuration(3000);
        mRotateAnimation.setFillAfter(true);

        mScaleAnimation = (ScaleAnimation) AnimationUtils.loadAnimation(MainActivity.this,R.anim.tween_scale);
        mScaleAnimation.setDuration(3000);
        mScaleAnimation.setFillAfter(true);

        mTranslateAnimation = new TranslateAnimation(0, 100, 0, 0);

        mAlphaAnimation = new AlphaAnimation(1, 0);
        mAlphaAnimation.setDuration(3000);
        mAlphaAnimation.setFillAfter(true);

        mAnimationSet.addAnimation(mRotateAnimation);
        mAnimationSet.addAnimation(mTranslateAnimation);
        mAnimationSet.addAnimation(mScaleAnimation);
        mAnimationSet.addAnimation(mAlphaAnimation);
    }

    public void start(View view) {
        mImageView.startAnimation(mAnimationSet);
    } 
  比較麻煩 
  Animation好玩的屬性 
   
   setRepeatCount和setRepeatMode設置重復次數和模式 
   setStartOffset設置開始延遲 
   
    
    
  來自：http://www.jianshu.com/p/b2c69b03c003


                    
                         本文由用戶 NanEaton 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
                         轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
                         本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！
                         本文地址：http://www.baiduhome.net/lib/view/open1478677201408.html
                         安卓開發 Android開發 移動開發

Android動畫機制-傳統動畫

Android動畫機制-傳統動畫

概述

逐幀動畫

簡單使用

注意事項

補間動畫

AlphaAnimation

ScaleAnimation

TranslateAnimation

RotateAnimation

AnimationSet

Animation好玩的屬性

相關經驗

相關資訊

相關文檔

目錄