Android中的動畫

補(bǔ)間動畫

Android中的補(bǔ)間動畫即View動畫有四種，分別為AlphaAnimation透明漸變動畫、RotateAnimation旋轉(zhuǎn)動畫、ScaleAnimation縮放動畫、TranslateAnimation位移動畫。

使用View動畫可以在代碼中直接設(shè)置，也可以在xml中進(jìn)行設(shè)置。

設(shè)置View動畫

首先我們在布局中有一個ImageView圖像，然后設(shè)置4個Button，點擊的時候執(zhí)行相應(yīng)的動畫。

AlphaAnimation透明漸變動畫

在代碼中設(shè)置動畫，代碼如下：

    //1.0意味著著完全不透明 0.0意味著完全透明
    AlphaAnimation aa = new AlphaAnimation(1.0f, 0.0f);
    aa.setDuration(2000); //設(shè)置動畫執(zhí)行的時間
    aa.setRepeatCount(1); //設(shè)置重復(fù)的次數(shù)
    aa.setRepeatMode(Animation.REVERSE);//設(shè)置動畫執(zhí)行的模式
    //imageView開始執(zhí)行動畫 
    imageView.startAnimation(aa);

透明漸變動畫很簡單，只需要設(shè)置透明度就可以了。

RotateAnimation旋轉(zhuǎn)動畫

旋轉(zhuǎn)動畫有多個構(gòu)造方法，我們選取其中參數(shù)最多的構(gòu)造方法：

RotateAnimation(float fromDegrees, float toDegrees, int pivotXType, float pivotXValue,
        int pivotYType, float pivotYValue)

其中的各種參數(shù)的意義如下：

fromDegrees ： 從哪個角度開始旋轉(zhuǎn)，一般為0
toDegrees    ： 結(jié)束的時候角度為多少，如轉(zhuǎn)一圈則為360
pivotXType    ： 在X軸上動畫相對于誰旋轉(zhuǎn)，一般是相對于父控件Animation.RELATIVE_TO_PARENT，或者相對于自己旋轉(zhuǎn)Animation.RELATIVE_TO_SELF
pivotXValue    ： 在X軸上動畫旋轉(zhuǎn)的中心點
pivotYType    ： 在Y軸上動畫相對于誰旋轉(zhuǎn)，同pivotXType
pivotYValue    ： 在Y軸上動畫旋轉(zhuǎn)的中心點

示例：

    RotateAnimation rotate = new RotateAnimation(0, 360, // 從0度開始旋轉(zhuǎn)，到360度結(jié)束
            Animation.RELATIVE_TO_SELF, 0.5f,     // X軸指定相對于自己還是相對于父控件旋轉(zhuǎn)，0.5f則是以自己寬度的二分之一為旋轉(zhuǎn)點
            Animation.RELATIVE_TO_SELF, 0.5f);    // Y軸指定相對于自己還是相對于父控件旋轉(zhuǎn)，0.5f則是以自己高度的二分之一為旋轉(zhuǎn)點
    rotate.setDuration(2000);
    imageView.startAnimation(rotate);

上面的代碼執(zhí)行時，會發(fā)現(xiàn)動畫是以imageView的中心點旋轉(zhuǎn)360度回到原點結(jié)束的。

ScaleAnimation縮放動畫

縮放動畫同樣有多個參數(shù)的構(gòu)造方法，如下：

ScaleAnimation(float fromX, float toX, float fromY, float toY,
            int pivotXType, float pivotXValue, int pivotYType, float pivotYValue)

參數(shù)代表的意義：

fromX    ： 動畫的X軸從多大開始縮放，一般為1.0f，即動畫原本大小開始縮放
toX        ： 動畫在X軸方向上要縮放到多大，如果小于1.0f，則動畫在X軸上的距離會變小，大于1.0f會放大
fromY    ： 動畫的Y軸從多大開始縮放,其他同fromX
toY        ： 動畫在Y軸方向上要縮放到多大，其他同toX
pivotXType    ： X軸指定相對于自己還是相對于父控件縮放，一般是相對于父控件Animation.RELATIVE_TO_PARENT，或者相對于自己縮放Animation.RELATIVE_TO_SELF
pivotXValue    ： 指定X軸方向上哪個位置為中心縮放
pivotYType    ： Y軸同pivotXType
pivotYValue    ： Y軸同pivotXValue

下面的示例為相對于自己從中心點放大：

    ScaleAnimation scale = new ScaleAnimation(1.0f, 2.0f, 1.0f, 2.0f,     // 1.0f代表原本大小，2.0f代表放大一倍
            Animation.RELATIVE_TO_SELF, 0.5f, // X軸指定相對于自己還是相對于父控件放大，第二個則是以哪個位置為X軸的旋轉(zhuǎn)點，此處為中心點放大
            Animation.RELATIVE_TO_SELF, 0.5f);
    scale.setDuration(2000);
    imageView.startAnimation(scale);

TranslateAnimation位移動畫

TranslateAnimation位移動畫也有多個參數(shù)，但是大多數(shù)參數(shù)都與上面幾個動畫雷同

TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue,
            int fromYType, float fromYValue, int toYType, float toYValue)

參數(shù)意義：

fromXType    ：在X軸上動畫相對于誰移動，一般是相對于父控件Animation.RELATIVE_TO_PARENT，或者相對于自己移動Animation.RELATIVE_TO_SELF
fromXValue    ：在X軸上的起始時的移動距離，一般為0f，即原來位置
toXType        ：在結(jié)束時X軸相對于誰移動，同fromXType
toXValue    ：在結(jié)束時動畫X軸所處的距離，若相對于父控件移動，一般不超多1.0f，否則會移動到屏幕外面
fromYType    ：在Y軸上動畫相對于誰移動，一般是相對于父控件Animation.RELATIVE_TO_PARENT，或者相對于自己移動Animation.RELATIVE_TO_SELF
fromYValue    ：在Y軸上的起始時的移動距離，一般為0f，即原來位置
toYType        ：在結(jié)束時Y軸相對于誰移動，同fromXType
toYValue    ：在結(jié)束時動畫Y軸所處的距離，若相對于父控件移動，一般不超多1.0f，否則會移動到屏幕外面

下面是相對于父控件，往右下角45度移動的示例：

    TranslateAnimation trans = new TranslateAnimation(
            Animation.RELATIVE_TO_PARENT, 0f,    // 起始時X軸相對于父控件移動
            Animation.RELATIVE_TO_PARENT, 0.2f,     // 結(jié)束時X軸也相對于父控件移動
            Animation.RELATIVE_TO_PARENT, 0,    // 起始時Y軸相對于父控件移動
            Animation.RELATIVE_TO_PARENT, 0.2f);    // 結(jié)束時Y軸相對于父控件移動
    trans.setDuration(2000);
    imageView.startAnimation(trans);

在xml中設(shè)置View動畫

在xml中設(shè)置動畫也比較簡單。
首先在res資源目錄下新建一個anim目錄，然后創(chuàng)建一個xml文件，下面創(chuàng)建了一個TranslateAnimation位移動畫的xml文件，代碼如下：

    <?xml version="1.0" encoding="utf-8"?>
    <translate
        android:fromXDelta="0%p"    // 起始位置為原來的位置，后面帶P代表相對于父控件移動，即代碼布局中的Animation.RELATIVE_TO_PARENT
        android:toXDelta="0%p"
        android:fromYDelta="0%p"
        android:toYDelta="20%p"            
        android:fillAfter="true"
        android:duration="2000"
        xmlns:android="http://schemas.android.com/apk/res/android">
    
    </translate>

在xml中設(shè)置的參數(shù)基本與在代碼設(shè)置的參數(shù)無異，在設(shè)置好xml之后，就是調(diào)用這個動畫了，調(diào)用的方法如下：

    Animation translate = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.translate);
    //開始動畫
    iv.startAnimation(translate);

只需要使用AnimationUtils這個類加載R.anim.translate動畫，也就是剛才設(shè)置的xml文件的文件名

屬性動畫

上面的補(bǔ)間動畫有個確定，就是不會改變運行動畫的真實坐標(biāo)，如使用TranslateAnimation的時候，ImageView在動畫結(jié)束時停留在另一個位置，但是點擊這個位置確實沒有效果的，必須點擊開始時的位置才起效。

而屬性動畫則是能夠改變ImageView的真實坐標(biāo)。

屬性動畫是使用ObjectAnimator這個類實現(xiàn)的，而使用這一個類就能夠?qū)崿F(xiàn)補(bǔ)間動畫四個類的效果。

ObjectAnimator有個特點，就是我們無法使用new的方式創(chuàng)建出他的實例，而是使用ofFloat(Object target, String propertyName, float... values)這個靜態(tài)方法獲取的

ofFloat(Object target, String propertyName, float... values)
參數(shù)意義：
    target        ：要執(zhí)行動畫的對象
    propertyName：屬性的名字，即執(zhí)行動畫的對象要執(zhí)行哪種動畫（執(zhí)行動畫的對象的所擁有的方法）
    values        ：執(zhí)行動畫的參數(shù)，是可變參數(shù)，意思是能夠傳入多個值

屬性動畫使用的方法很簡單，代碼如下：

        //創(chuàng)建屬性動畫
    /**
     * target 執(zhí)行的目標(biāo)  
     * propertyName 屬性名字  The name of the property being animated.
     * float... values 可變參數(shù) 
     */
    ObjectAnimator oa = ObjectAnimator.ofFloat(imageView, "translationX", 10, 50,20,100);
    oa.setDuration(2000);
    oa.start(); //開始動畫

上面代碼執(zhí)行的時候?qū)mageView進(jìn)行在X軸上的位移，先移動到10，然后繼續(xù)向右移動到50，在向左移動到20，最后移動到100的位置。

實現(xiàn)縮放效果，下面代碼會將圖片縱向縮放，也就是圖片變扁了：

    ObjectAnimator oa = ObjectAnimator.ofFloat(imageView, "alpha", 0, 0.5f, 0, 1,0,1);
    oa.setDuration(2000);
    oa.start();

實現(xiàn)旋轉(zhuǎn)效果：

    // 按照中心點旋轉(zhuǎn)
    // ObjectAnimator oa = ObjectAnimator.ofFloat(imageView, "rotation", 0, 180, 90, 360);
    // 按照X軸旋轉(zhuǎn)
    ObjectAnimator oa = ObjectAnimator.ofFloat(imageView, "rotationX", 0, 180, 90, 360);
    oa.setDuration(2000);
    oa.start();

實現(xiàn)透明效果：

    ObjectAnimator oa = ObjectAnimator.ofFloat(imageView, "alpha", 0, 0.5f, 0, 1,0,1);
    oa.setDuration(2000);
    oa.start();

實現(xiàn)動畫一起執(zhí)行的效果

    AnimatorSet as = new AnimatorSet();
    ObjectAnimator oa = ObjectAnimator.ofFloat(imageView, "translationX", 10, 50, 20, 100);
    ObjectAnimator oa2 = ObjectAnimator.ofFloat(imageView, "scaleY", 0.1f, 2, 1, 2);
    ObjectAnimator oa3 = ObjectAnimator.ofFloat(imageView, "alpha", 0, 0.5f, 0, 1);
    ObjectAnimator oa4 = ObjectAnimator.ofFloat(imageView, "rotationY", 0, 180, 90, 360);
    as.setDuration(2000);//執(zhí)行動畫時長
    as.setTarget(iv);//iv執(zhí)行動畫
    //往集合中添加動畫
    //動畫逐個執(zhí)行
    as.playSequentially(oa, oa2, oa3, oa4);
    //動畫全部一起執(zhí)行
    //as.playTogether(oa, oa2, oa3, oa4);
    as.start();

在XML中設(shè)置屬性動畫

在xml中使用屬性動畫要在res文件夾下新建一個animator文件夾，然后穿件一個xml文件，這里命名為oanimator.xml，代碼如下：

    <?xml version="1.0" encoding="utf-8"?>
    <animator xmlns:android="http://schemas.android.com/apk/res/android" >
        <objectAnimator 
            android:propertyName="translationX"
            android:duration="2000"
            android:valueFrom="10"
            android:valueTo="100"
            ></objectAnimator>
    
    </animator>

在代碼中調(diào)用這個它：

    ObjectAnimator oa = (ObjectAnimator) AnimatorInflater.loadAnimator(this, R.animator.oanimator);
    //設(shè)置執(zhí)行目標(biāo)
    oa.setTarget(iv);
    oa.start();//開始執(zhí)行

如此就能使用設(shè)置的這個動畫了。

幀動畫

動畫中還有一個幀動畫，幀動畫是使用一系列的圖片資源實現(xiàn)的。

實現(xiàn)幀動畫非常簡單，首先我們設(shè)置一個ImageView顯示幀動畫，然后在Activity綁定它。

然后放一系列的圖片資源在drawable文件夾中，在創(chuàng)建一個xml文件，這里命名為my_anim.xml（可隨意命名）。
然后在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/girl_1" android:duration="200" />
        <item android:drawable="@drawable/girl_2" android:duration="200" />
        <item android:drawable="@drawable/girl_3" android:duration="200" />
        <item android:drawable="@drawable/girl_4" android:duration="200" />
        <item android:drawable="@drawable/girl_5" android:duration="200" />
        <item android:drawable="@drawable/girl_5" android:duration="200" />
        <item android:drawable="@drawable/girl_5" android:duration="200" />
        <item android:drawable="@drawable/girl_5" android:duration="200" />
        <item android:drawable="@drawable/girl_6" android:duration="200" />
        <item android:drawable="@drawable/girl_7" android:duration="200" />
        <item android:drawable="@drawable/girl_8" android:duration="200" />
        <item android:drawable="@drawable/girl_9" android:duration="200" />
        <item android:drawable="@drawable/girl_10" android:duration="200" />
        <item android:drawable="@drawable/girl_11" android:duration="200" />
    </animation-list>

其中g(shù)irl_1、girl_2···就是我們要加載的圖片資源。

設(shè)置完之后就能在代碼中直接調(diào)用：

    // [1]找到iv控件 用來顯示動畫效果
    ImageView rocketImage = (ImageView) findViewById(R.id.iv);
    // [2]設(shè)置背景資源
    rocketImage.setBackgroundResource(R.drawable.my_anim);
    // [3]獲取AnimationDrawable 類型
    AnimationDrawable ad = (AnimationDrawable) rocketImage.getBackground();
    // [4]開始執(zhí)行動畫
    ad.start();

如此一來就能后執(zhí)行幀動畫了。

Android動畫學(xué)習(xí)相關(guān)資源：
Android屬性動畫完全解析(上)，初識屬性動畫的基本用法
Android屬性動畫完全解析(中)，ValueAnimator和ObjectAnimator的高級用法
Android屬性動畫完全解析(下)，Interpolator和ViewPropertyAnimator的用法

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容