Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> 關於Android編程 >> Android動畫使用總結

Android動畫使用總結

編輯:關於Android編程

本文介紹Android動畫的相關知識和使用方法:逐幀動畫和補間動畫。

一.逐幀(Frame)動畫

逐幀動畫逐幀動畫就是順序播放事先准備好的靜態圖像,利用人眼的”視覺暫留”的原理,給用戶選擇動畫的錯覺.

(一)逐幀動畫的使用步驟

1.設計xml文件,要放在在drawable文件夾內
2.創建AnimationDrawable對象
3.使用AnimationDrawable操作動畫的開始和暫停

比如:
//實例化控件對象
 TextView textView = (TextView) findViewById(R.id.main_text);
//獲取動畫對象才能對動畫進行操作
AnimationDrawable 
anim = (AnimationDrawable) textView.getBackground();
//開始動畫
anim.start();

(二)示例演示

1.anim_frame.xml文件的編寫



    
    
    
    
    
    

這裡每一圖片的動畫時間單位是毫秒,如果設置時間太長,會顯示幻燈片的效果,一般設置在100毫秒左右.

2.activity_main.xml文件編寫




    

    

這裡的動畫屬性資源要放在background裡面才能使用。

3.java代碼的編寫

public class MainActivity extends AppCompatActivity {
    //布局內的控件
    TextView textView;
    //控制幀動畫的對象
    AnimationDrawable anim;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_main);
        //實例化控件對象
         textView = (TextView) findViewById(R.id.main_text);
        //獲取動畫對象才能對動畫進行操作
        anim = (AnimationDrawable) textView.getBackground();
    }

    //開始動畫
    public void start(View v) {
        anim.start();
    }

    //停止動畫
    public void stop(View v) {
        anim.stop();
    }

}

這裡的動畫操作對象是通過getBackground獲取的,所以之前的動畫資源要放在background裡面。如果是ImageView的src放入動畫資源是無法取得動畫的對象的。

4.動畫效果

fra1

fra2
這是一個表情包效果的動畫,但是主要應用還是奔跑進行中的動畫使用。

二.補間(Tween)動畫

補時動畫就是通過對場景的對象不斷進行圖像變化來產生動畫效果,在實現補時動畫時,只要定義動畫開始和結束的”關鍵幀”其它過度幀由系統自動計算並補齊.android中提供了4種補間動畫效果:透明、旋轉、縮放、平移;

補間動畫也要設置xml資源文件,但是它的資源文件放在anim文件夾裡面,這個文件夾需要我們自己創建在res目錄下。

(一)透明度漸變動畫(AlphaAnimation)的資源文件設計


 
  

屬性說明
1. android:interpolator
用於控制動畫的變化速度,使用動畫效果可以勻速,加速,減速或拋物線速度等各種速度變化具體
見下表android:interpolotor屬性的常用屬性值
2. android:repeatMode
用於設置動畫的重復方式,可選擇為reverse(反向)或restart(重新開始)
3. android:repeatCount
用於設置動畫的重復次數,屬性可以是代表次數的數值,也可以是infinite(無限循環)
4. android:duration
用於指定donghua持續的時間,單位為毫秒
5. android:fromAlpha
用於指定動畫開始時的透明度,值為0.0代表完全透明 ,值為1.0代表完全不透明
6. android:toAlpha
用於指定動畫結束時的透明度,值為0.0代表完全透明,值為1.0代表完全不透明

7.android:interpolator屬性的常用屬性值
1) @android:anim/linear_interpolator 動畫一直在做勻速改變
2) @android:anim/accelerate_interpolator 動畫一在開始的地方變較慢,然後開始加

3) @android:anim/decelerate_interpolator 在動畫開始的地方改變速度較快,然後開
始減速
4)@android:anim/accelerate_decelerate_interpolator 動畫在開始和結束的地方
改變速度較慢,在中間的時候加速
5) @android:anim/cycle_interpolator 動畫循環播放特定的次數,變化速度按正弦
曲線改變
6)@android:anim/bounce_interpolator 動畫結束的地方采用彈球效果
7)@android:anim/anticipate_overshoot_interpolator 在動畫開始的地方先向後退一
小步,再開始動畫,到結束的地方再超出一小步,最後回到動畫結束的地方
8)@android:anim/overshoot_interpolator 動畫快速到達終點,並超出一小步最後回到動畫結束的地方
9)@android:anim/anticipate_interpolator 在動畫開始的地方先向後退一小步,再快速到達動畫結束的地方

上面的很多屬性值對下面的動畫效果也是有效的。

(二)旋轉動畫(RotateAnimation)

旋轉動畫就是通過為動畫指定開始時的旋轉角度,結束時的旋轉角度,經及持續時間來創建動畫,在旋轉時還可以通過指定軸心點坐標來改為旋轉的中心
旋轉動畫的資源文件設計如下:



 

屬性說明
1. android:interpolotor 用於控制動畫的變化速度,使用動畫效果可以勻速,加速,減速或拋物線速度等各種速度變化具體
見表android:interpolator屬性的常用屬性值
2. android:fromDegrees 用於指定動畫開始時旋轉的角度
3. android:toDeggrees 用於指定動畫結束時旋轉的角度
4. android:pivotX 用於指定軸心點X軸坐標
5. android:pivotY 用於指定軸心點Y軸坐標
6. android:repeatMode 用於設置動畫的重復方式,可選擇為reverse(反向)或restart(重新開始)
7. android:repeatCount 用於設置動畫的重復次數,屬性可以是代表次數的數值,也可以是infinite(無限循環)
8. android:duration 用於指定動畫持續的時間,單位為毫秒

(三)縮放動畫(scaleAnimation)

縮放動畫就是通過為動畫指定開始時報縮放系數,結束時的縮放系數,以及持續時間來他建動畫,在縮放時還可以通過指定軸心點坐標來改變綻放的中心。
 
 
 

屬性說明
1. android:interpolotor 用於控制動畫的變化速度,使用動畫效果可以勻速,加速,減速或拋物線速度等各種速度變化具體見表android:interpolotor屬性的常用屬性值
2. android:fromXScale 用於指定動畫開始時水平方向上的縮放系數,值為1.0表示不變化
3. android:toXScale 用於指定動畫結束時水平方向上的縮放系數,值為1.0表示不變化
4. android:fromYScale 用於指定動畫開始時垂直方向上的縮放系數,值為2.0表示放大一倍
5. android:toYScale 用於指定動畫結束時垂直方向上的縮放系數,值為2.0表示放大一倍
6. android:pivotX 用於指定軸心點X軸坐標,50%表示自身的x軸中心點的,50%p表示父框體的x軸中心點
7. android:pivotY 用於指定軸心點Y軸坐標,50%表示自身的y軸中心點的,50%p表示父框體的y軸中心點
8. android:repeatMode 用於設置動畫的重復方式,可選擇為reverse(反向)或restart(重新開始)
9. android:repeatCount 用於設置動畫的重復次數,屬性可以是代表次數的數值,也可以是infinite(無限循環)
10. android:duration 用於指定動畫持續的時間,單位為毫秒

(四)平移動畫(TranslateAnimation)

平穩動畫就是通過為動畫指定開始時的位置,結束時的位置,經及持續時間來創建動畫



 
 

屬性說明
1. aandroid:fillAfter 用於指定動畫結束後是否保存最後的效果,true代表是,這個屬相一般要寫在根標簽裡面,寫在子標簽裡面是起不到作用的。
2. android:fromXDelta 用於指定動畫開始時水平方向上的起始位置,默認單位是像素,可以使用100%代表的是自身長度,100%p代表的是父框體的長度。下面的距離也可以這樣表示。
3. android:toXDelta 用於指定動畫結束時水平方向上的起始位置
4. android:fromYDelta 用於指定動畫開始時垂直方向上的起始位置
5. android:toYDelta 用於指定動畫結束時垂直方向上的起始位置
6. android:repeatMode 用於設置動畫的重復方式,可選擇為reverse(反向)或restart(重新開始)
7. android:repeatCount 用於設置動畫的重復次數,屬性可以是代表次數的數值,也可以是infinite(無限循環)
8. android:duration 用於指定動畫持續的時間,單位為毫秒

上面就是四種補間動畫的資源文件的屬性介紹,其中有很多屬性的值是相同的,有些也是有區別的,有些值是必須要設置的,比如:動畫時間,相關動畫效果的起始值和結束值。
注意:持續時間是一次動畫的時間,如果設置的動畫的次數是2,那麼動畫結束時花的時間是3倍的動畫持續時間。
還有就是,一個set標簽裡面可以放多個動畫效果的標簽,比如一個在移動的圖片可以讓它同時改變透明的,也可以讓它同時旋轉等等。

(五)補間動畫程序示例

1.透明效果動畫資源文件alpha.xml的代碼


這裡的透明效果是從開始顯示到最後完全消失,執行六次,總共花費時間24秒。最後完全消失!

2.旋轉效果動畫資源文件rotate.xml的代碼


這裡的旋轉效果是圖片從正常狀態開始順時針旋轉三圈,然後反向旋轉三圈,順時針旋轉三圈,然後反向旋轉三圈,旋轉四圈後停止。而且這裡的旋轉都是以自身的中心點開始旋轉的。

3.縮放效果動畫資源文件scale.xml的代碼


這裡的縮放效果沒有指定重復的次數,照片以自己圖片為中心放大1.5倍後,最後顯示的是1.5倍圖片大小的效果。

4.平移效果動畫資源文件translate.xml的代碼


這裡的平移效果比較簡單只是從原來的位置往下平移500像素的距離,最後停留在那裡。

5.各個效果動畫資源文件anim_all的代碼



    

    

    
    

這裡只是把上面幾個動畫效果拼接起來,作為一個動畫效果,可以看到,這個動畫效果,有透明的效果,有旋轉的效果,有縮放的效果,有平移的效果。

6.布局文件activity_main.xml的代碼




    

這裡設置幾個按鈕來選擇動畫效果的顯示,還有一個TextView來顯示動畫的效果,這裡的顯示效果控件可以是各種控件,可以是圖片ImageView也可以是其他的。

7.java代碼文件設計

package com.lwz.tweenanimation;

import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.TextView;

public class MainActivity extends Activity {
    //定義布局內的控件
    TextView textView;
    int index = 0;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //實例化布局的內的控件
        textView = (TextView) findViewById(R.id.main_text);
        //定義操作補間動畫的對象
        Animation anima = AnimationUtils.loadAnimation(this, R.anim.anim_all);
        textView.setAnimation(anima);


        //給補間動畫設置監聽事件
        anima.setAnimationListener(new Animation.AnimationListener() {
            //動畫開始的時候回調
            @Override
            public void onAnimationStart(Animation animation) {
                Log.e("TAG", "start:" + index++);
            }

            //動畫結束的時候回調
            @Override
            public void onAnimationEnd(Animation animation) {
                Log.e("TAG", "end:" + index++);              
            }

            //動畫重復運行的時候回調
            @Override
            public void onAnimationRepeat(Animation animation) {
                Log.e("TAG", "repeat:" + index++);
            }
        });

    }

    public void alpha(View view) {
        Animation anima = AnimationUtils.loadAnimation(this, R.anim.alpha);
        textView.setAnimation(anima);
    }

    public void rotate(View view) {
        Animation anima = AnimationUtils.loadAnimation(this, R.anim.rotate);
        textView.setAnimation(anima);
    }

    public void scale(View view) {
        Animation anima = AnimationUtils.loadAnimation(this, R.anim.scale);
        textView.setAnimation(anima);
    }

    public void translate(View view) {
        Animation anima = AnimationUtils.loadAnimation(this, R.anim.translate);
        textView.setAnimation(anima);
    }

}

上面的代碼可以顯示各種動畫的效果,其中這裡也測試了一下動畫的監聽事件,可以在監聽事件裡面做其他事情,比如在一個動畫結束時,馬上執行另一個動畫。

程序運行效果:
tween1
<喎?/kf/ware/vc/" target="_blank" class="keylink">vcD4NCjxwPjxjb2RlPjxjb2RlPravu63V/dTavfjQ0MqxteO798bky/u1xLavu63Qp7n7tcSwtMWlo6y74c2j1rnUrcC0tcS2r7ut0Ke5+6Osz9TKvtDCteO797XEtq+7rdCnufuhozxiciAvPg0KtavKx9XiuPazzNDy09DSu7j2ZGVidWe+zcrHo6y2r7utveHK+Lrz1Nm147v3xuTL+7XEtq+7rdCnufvKx8O709C3tNOmtcShozwvY29kZT48L2NvZGU+PC9wPg0KPGgyIGlkPQ=="六總結一下補間動畫的使用步驟">(六)總結一下補間動畫的使用步驟

1.設計xml文件,要放在在anim文件夾內

2.創建Animation對象

3.在某個控件對象中放入Animation對象就可以顯示動畫了。

比如:
TextView textView = (TextView) findViewById(R.id.main_text);
//定義操作補間動畫的對象
Animation anima = AnimationUtils.loadAnimation(this, R.anim.anim_all);
textView.setAnimation(anima);
這裡的R.anim.anim_all是資源文件

三.程序示例使用逐幀動畫和補間動畫

程序效果:小豬在頁面上來回跑,並且腳是前後擺動的;
這個程序需要五張圖片資源,一個大的背景圖片,兩張往前走的小豬的姿勢圖片,兩張往回走的小豬的姿勢圖片。

這個程序可以使用很多方法來實現。
1.可以是圖片的隱藏和顯示的方法實現
小豬跑到最左邊後隱藏,顯示右邊的小豬,一直重復上面的操作。
2.資源替換的方法
小豬跑到最左邊後把動畫效果和圖片資源換成右邊的小豬,一直重復上面的操作。
3.動畫的時間監聽來完成
小豬跑到最左邊後把另一個動畫效果切換,一直重復上面的操作。

但是無論任何都要使用到的是:
幀動畫:使小豬的腿一直再跑的狀態
補間動畫:使小豬平移

(一)程序思路

這裡使用的是兩個小豬在一直跑的狀態的方法:
第一個小豬從屏幕起點向右跑,一直跑到屏幕兩倍的距離,一直重復這個動畫;
第二個小豬在屏幕兩倍距離多一點的位置開始跑,跑過屏幕左邊為止為止。一直重復這個動畫。
當第一個小豬跑過屏幕右邊時,第二個小豬剛好從屏幕的右邊界出現,看起來是同一個小豬在屏幕上來回跑。

(二)逐幀動畫設計

1.第一個小豬的pig1_2.xml文件



    
    

2.第二個小豬的pig3_4.xml文件



    
    

(三)補間動畫設計

1.第一個小豬的run.xml文件



    

2.第二個小豬的run2.xml文件



    

第二個小豬的控件初始的位置是在屏幕的右邊,所以再往右一個屏幕多一點,就是兩個屏幕的距離。

(四)布局文件的設計




    

    

這裡大背景在整個布局中,兩個TextView來顯示兩個小豬。

(五)java代碼設計

package com.lwz.animation;

import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

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

        //第一只小豬
        TextView tv = (TextView) findViewById(R.id.main_iv);
        //幀動畫的設置
        AnimationDrawable animationDrawable = (AnimationDrawable) tv.getBackground();
        animationDrawable.start();
        //補間動畫的設置
        Animation animation = AnimationUtils.loadAnimation(this, R.anim.run);
        tv.setAnimation(animation);


        //對第二個小豬圖片
        TextView tv2 = (TextView) findViewById(R.id.main_iv2);
        //幀動畫的設置
        AnimationDrawable animationDrawable2 = (AnimationDrawable) tv2.getBackground();
        animationDrawable2.start();
        //補間動畫的設置
        Animation animation2 = AnimationUtils.loadAnimation(MainActivity.this, R.anim.run2);
        tv2.setAnimation(animation2);


    }


}

這裡的java代碼都是比較簡單的。

(六)運行效果

往前跑時:

p1

p2
往回跑時:
p3

p4

這裡就基本實現小豬來回跑的效果了,這裡的第二個小豬要往右邊的距離長一點是因為這裡的小豬沒有設置平移的速度,它在中間會加速前進,這裡也可以設置兩個小豬勻速前進。

  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved