當(dāng)前位置：首頁(yè) > 编程资源 > 编程问答 >内容正文

编程问答

Animation Property Animation 使用

發(fā)布時(shí)間：2024/7/23 编程问答 34 豆豆

生活随笔收集整理的這篇文章主要介紹了 Animation Property Animation 使用小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

本篇主要講Animation 和 Property Animation的使用，最后會(huì)講QQ管家桌面火箭作為例子：

在Android中開發(fā)動(dòng)效有兩套框架可以使用，分別為 Animation 和 Property Animation；

相對(duì)來(lái)說(shuō)，Animator比Animation要強(qiáng)大太多，兩者之間的主要區(qū)別在于：

區(qū)別一：需要的Anroid API level不一樣
Property Animation需要Android API level 11的支持,當(dāng)然可以使用nineoldandroids.jar進(jìn)行兼容，而View Animation則是最原始的版本。
區(qū)別二：適用范圍不一樣
Property Animation適用于所有的Object對(duì)象，而View Animation則只能應(yīng)用于View對(duì)象。
區(qū)別三，實(shí)際改變不一樣：
Animation：改變的是view的繪制位置，而非實(shí)際屬性；
Property Animation：改變的是view的實(shí)際屬性；
如：用兩套框架分別對(duì)一個(gè)button做位移動(dòng)畫，用animation處理之后的點(diǎn)擊響應(yīng)會(huì)在原處，而用Property Animation處理后的點(diǎn)擊響應(yīng)會(huì)在最終位置處；

一：Animation

總的來(lái)說(shuō)可以分為：Tween Animation（補(bǔ)間動(dòng)畫）和Frame Animation（幀動(dòng)畫）

幀動(dòng)畫（Frame Animation）：

幀動(dòng)畫其實(shí)就是按照一定的時(shí)間間隔進(jìn)行快速的圖片切換，達(dá)到視覺上的動(dòng)畫效果，這種動(dòng)畫相對(duì)來(lái)說(shuō)缺點(diǎn)較多，比如：

1.根據(jù)動(dòng)畫的復(fù)雜度需要切多張圖，這樣就不可避免的增大了包大小
2.由于是多張圖，運(yùn)行時(shí)需要加載到內(nèi)存，那么又會(huì)增大運(yùn)行時(shí)的內(nèi)存大小

所以如果在動(dòng)效上有別的方案選擇，個(gè)人不太建議使用幀動(dòng)畫的實(shí)現(xiàn)方式，當(dāng)然有時(shí)候不得不用，這時(shí)我們可以盡可能的在效果連貫的基礎(chǔ)上減少圖片張數(shù)；

幀動(dòng)畫的實(shí)現(xiàn)也相對(duì)簡(jiǎn)單，就舉一個(gè)例子，但是例子之中有幾條幀動(dòng)畫的使用規(guī)則，是我以前在使用的過程中遇到問題后總結(jié)出來(lái)的；
1.在drawable目錄下xml中定義如下文件，節(jié)點(diǎn)為animation-list，oneshot代表是否執(zhí)行一次，duration代表每張圖對(duì)應(yīng)展示時(shí)間：

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"android:oneshot="true"><item android:drawable="@drawable/rocket_thrust1" android:duration="200" /><item android:drawable="@drawable/rocket_thrust2" android:duration="200" /><item android:drawable="@drawable/rocket_thrust3" android:duration="200" /> </animation-list>

2.然后將該drawable設(shè)置給對(duì)應(yīng)的imageview

3.在activity中

animDrawable = (AnimationDrawable) imageView.getBackground();

4.在onWindowFocusChanged()中調(diào)用：
animDrawable.stop();
animDrawable.start();
如果不這么做，那么在性能比較差的機(jī)器上很可能就會(huì)出現(xiàn)沒有播放的情況，因?yàn)橹伙@示出了第一幀，問題在于動(dòng)畫沒有和view完成關(guān)聯(lián)，所以不要在onCreate中去調(diào)用啟動(dòng)，而需要在onWindowFocusChanged中進(jìn)行調(diào)用；

在極特殊的情況下如果還無(wú)法播放，則可以mHandler.postDelay 200 毫秒作為終極殺手锏，當(dāng)然只要按照我上面的步驟，應(yīng)該不會(huì)出現(xiàn)問題；
好了，幀動(dòng)畫最大的問題是按照上面的步驟開發(fā)，接下來(lái)看補(bǔ)間動(dòng)畫（Tween Animation）

補(bǔ)間動(dòng)畫（Tween Animation）：

Animation下有五個(gè)子類：AlphaAnimation(漸變),RotateAnimation(旋轉(zhuǎn)),ScaleAnimation(縮放),TranslateAnimation(位移)
在實(shí)現(xiàn)原理上除了AlphaAnimation是動(dòng)態(tài)的去改變view的alpha值，其他三個(gè)都是去改變里面的Matrix（矩陣，后面會(huì)專門講）；

在Animation框架里，主要的類主要有Animation和Transformation、Interpolator(插值器，后面也會(huì)專門講)
Transformation里面主要對(duì)alpha和matrix進(jìn)行了封裝，而改變view的透明度就是改變alpha，移動(dòng)、旋轉(zhuǎn)、縮放甚至錯(cuò)切則都是改變matrix
Animation里有一個(gè)重要的方法applyTransformation，實(shí)現(xiàn)自定義Animation也主要是實(shí)現(xiàn)這個(gè)方法：
以AlphaAnimation為例：

/*** Changes the alpha property of the supplied {@link Transformation}*/@Overrideprotected void applyTransformation(float interpolatedTime, Transformation t) {final float alpha = mFromAlpha;t.setAlpha(alpha + ((mToAlpha - alpha) * interpolatedTime));}

漸變動(dòng)畫只需要在里面根據(jù)當(dāng)前的interpolatedTime(已經(jīng)由插值器轉(zhuǎn)換后的值)動(dòng)態(tài)計(jì)算出對(duì)應(yīng)的alpha，重新設(shè)置到Transformation中即可；
Animation的使用也相對(duì)比較簡(jiǎn)單，可以通過xml配置，也可以通過代碼生成：

1.xml配置： <?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android"android:shareInterpolator="false" ><scale>android:duration="500"android:fillAfter="true"android:fillBefore="false"android:fromXScale="1"android:fromYScale="1"android:interpolator="@android:anim/accelerate_interpolator"android:pivotX="50%"android:pivotY="50%"android:repeatCount="infinite"android:repeatMode="restart"android:startOffset="100"android:toXScale="0"android:toYScale="0" /></scale><translate android:duration="550"android:fromYDelta="300"android:interpolator="@android:anim/accelerate_interpolator"android:toYDelta="0" /><alpha android:duration="550"android:fromAlpha="0"android:toAlpha="1" /></set>

當(dāng)要多個(gè)效果同時(shí)使用時(shí)，則如上使用set標(biāo)簽進(jìn)行組合，在代碼中使用如下：

Animation animation = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.app_clean_animation); view.startAnimation(animation); 2.純代碼生成：// false代表里面的子animation不共用一個(gè)插值器AnimationSet animationSet = new AnimationSet(false);// 從alpha 完全透明變?yōu)橥耆煌该?/span>AlphaAnimation alphaAnimation = new AlphaAnimation(0, 1);alphaAnimation.setDuration(500);alphaAnimation.setFillAfter(true);// 運(yùn)行完成后是否回到開始時(shí)的狀態(tài)alphaAnimation.setFillBefore(false);alphaAnimation.setInterpolator(new AccelerateInterpolator());// 重復(fù)的次數(shù)，infinite代表永久循環(huán)alphaAnimation.setRepeatCount(Animation.INFINITE);// 重復(fù)的模式， restart代表重新開始，reverse代表反轉(zhuǎn)alphaAnimation.setRepeatMode(Animation.RESTART);// 給動(dòng)畫設(shè)置對(duì)應(yīng)的監(jiān)聽，可以在動(dòng)畫開始、結(jié)束或重復(fù)執(zhí)行時(shí)做對(duì)應(yīng)操作alphaAnimation.setAnimationListener(new AnimationListener() {@Overridepublic void onAnimationStart(Animation animation) {//開始時(shí)候回調(diào)}@Overridepublic void onAnimationRepeat(Animation animation) {//重復(fù)執(zhí)行時(shí)回調(diào)}@Overridepublic void onAnimationEnd(Animation animation) {//一輪結(jié)束時(shí)回調(diào)}});RotateAnimation rotateAnimation = new RotateAnimation(0, 360);rotateAnimation.setDuration(500);animationSet.addAnimation(alphaAnimation);animationSet.addAnimation(rotateAnimation);view.startAnimation(animationSet);

好了，animation就講到這里，上面的注釋應(yīng)該比較詳盡了，主要是弄清楚其使用方式和使用場(chǎng)景！

二：Property Animation（屬性動(dòng)畫）

屬性動(dòng)畫，它更改的是對(duì)象的實(shí)際屬性，在View Animation（Tween Animation）中，其改變的是View的繪制效果，真正的View的屬性保持不變，比如無(wú)論你在對(duì)話中如何縮放Button的大小，Button的有效點(diǎn)擊區(qū)域還是沒有應(yīng)用動(dòng)畫時(shí)的區(qū)域，其位置與大小都不變。而在Property Animation中，改變的是對(duì)象的實(shí)際屬性，如Button的縮放，Button的位置與大小屬性值都改變了。而且Property Animation不止可以應(yīng)用于View，還可以應(yīng)用于任何對(duì)象。Property Animation只是表示一個(gè)值在一段時(shí)間內(nèi)的改變，當(dāng)值改變時(shí)要做什么事情完全是你自己決定的。
在Property Animation中，可以對(duì)動(dòng)畫應(yīng)用以下屬性：

1.TimeInterpolator(插值器，和低版本的Interpolator一樣)：屬性值的計(jì)算方式，如先快后慢

2.TypeEvaluator：根據(jù)屬性的開始、結(jié)束值與TimeInterpolator計(jì)算出的因子計(jì)算出當(dāng)前時(shí)間的屬性值

3.Repeat Count and behavoir：重復(fù)次數(shù)與方式，如播放3次、5次、無(wú)限循環(huán)，可以此動(dòng)畫一直重復(fù)，或播放完時(shí)再反向播放

4.Animation sets：動(dòng)畫集合，即可以同時(shí)對(duì)一個(gè)對(duì)象應(yīng)用幾個(gè)動(dòng)畫，這些動(dòng)畫可以同時(shí)播放也可以對(duì)不同動(dòng)畫設(shè)置不同開始偏移

5.Frame refreash delay：多少時(shí)間刷新一次，即每隔多少時(shí)間計(jì)算一次屬性值，默認(rèn)為10ms，最終刷新時(shí)間還受系統(tǒng)進(jìn)程調(diào)度與硬件的影響

上面都是些概念，但這些東西不必刻意去記，或去理解插值器這樣的比較生澀的概念，我們只需要使用他最實(shí)用的部分，并熟悉動(dòng)畫的實(shí)現(xiàn)套路；
所以對(duì)于屬性動(dòng)畫主要帶大家熟悉兩個(gè)類，ValueAnimator和ObjectAnimator,通過這兩個(gè)類我們平常遇到的動(dòng)效大部分都能夠加以解決；
1.ValueAnimator：
ValueAnimator包含了 Property Animation 動(dòng)畫的所有核心功能，如動(dòng)畫時(shí)間，開始、結(jié)束屬性值，相應(yīng)時(shí)間屬性值計(jì)算方法等。

在我看來(lái)，使用 ValueAnimator 只是為我們創(chuàng)建了一個(gè)過程，我們可以用ValueAnimator.ofXXX()進(jìn)行創(chuàng)建，然后通過各種setXXX()給其設(shè)定過程的時(shí)間，速率變化效果等，然后通過addUpdateListener()中去拿這個(gè)過程中回調(diào)回來(lái)的中間值，然后使用這些中間值改變view的屬性形成動(dòng)態(tài)效果；

上面這句話通過代碼表現(xiàn)如下：

比如我們使用 ValueAnimator 在2S內(nèi)將view橫向拉長(zhǎng)為2倍，縱向壓縮為0：

// 在2S內(nèi)將view橫向拉長(zhǎng)為2倍，縱向壓縮為0// 創(chuàng)建0－1的一個(gè)過程,任何復(fù)雜的過程都可以采用歸一化，然后在addUpdateListener回調(diào)里去做自己想要的變化ValueAnimator valueAnimator = ValueAnimator.ofFloat(0, 1);// 設(shè)置過程的時(shí)間為2SvalueAnimator.setDuration(SCALE_ANIM_TIME);// 設(shè)置這個(gè)過程是速度不斷變快的valueAnimator.setInterpolator(new AccelerateInterpolator());// 這個(gè)過程中不斷執(zhí)行的回調(diào)valueAnimator.addUpdateListener(new AnimatorUpdateListener() {@Overridepublic void onAnimationUpdate(ValueAnimator animation) {// 不斷回調(diào)的在0-1這個(gè)范圍內(nèi)，經(jīng)過插值器插值之后的返回值float value = (Float) animation.getAnimatedValue();// ViewHelper可直接用于修改view屬性// 將寬在2S內(nèi)放大一倍ViewHelper.setScaleX(mTestImage, 1 + value);// 將高在2S內(nèi)壓縮為0ViewHelper.setScaleY(mTestImage, 1 - value);}});// AnimatorListenerAdapter是AnimatorListener的空實(shí)現(xiàn)，根據(jù)需要覆蓋的方法自行選擇valueAnimator.addListener(new AnimatorListenerAdapter() {@Overridepublic void onAnimationStart(Animator animation) {super.onAnimationStart(animation);Toast.makeText(getApplicationContext(), "onAnimationStart", Toast.LENGTH_SHORT).show();}@Overridepublic void onAnimationEnd(Animator animation) {super.onAnimationEnd(animation);Toast.makeText(getApplicationContext(), "onAnimationEnd", Toast.LENGTH_SHORT).show();}@Overridepublic void onAnimationCancel(Animator animation) {super.onAnimationCancel(animation);}@Overridepublic void onAnimationRepeat(Animator animation) {super.onAnimationRepeat(animation);}});valueAnimator.start();

動(dòng)畫其實(shí)就是在一個(gè)時(shí)間段內(nèi)不斷去改變view的一些屬性值，這些屬性值動(dòng)態(tài)變化，不斷重繪的過程，也就形成了我們所看到的動(dòng)效；

那么基于此，我們可以知道這個(gè)過程都是通過時(shí)間來(lái)控制的，時(shí)間走過的比例肯定在 0-1 之間，如果我們直接用這個(gè)走過的時(shí)間比例去算當(dāng)前屬性值，那么整個(gè)過程則是勻速（線性）的；

那么在這個(gè)基礎(chǔ)上，我們想我們的過程是非線性的，我們?cè)撛趺崔k呢，那么只需要對(duì)這個(gè)時(shí)間比例加以加工，具體請(qǐng)看下圖：

橫軸就是經(jīng)過的時(shí)間比例，肯定是勻速的從0-1，縱軸則是時(shí)間比例經(jīng)過加工后的插值，這個(gè)對(duì)應(yīng)過程則是Interpolator（插值器）對(duì)應(yīng)的過程；

減速線則對(duì)應(yīng)DecelerateInterpolater,因?yàn)樗男甭试絹?lái)越平，所以瞬時(shí)速度越來(lái)越小，則形成了減速效果；

其他的效果類似，目前android里提供的插值器有如下一些：

AccelerateInterpolator　　　　　加速，開始時(shí)慢中間加速
DecelerateInterpolator　　　　　減速，開始時(shí)快然后減速
AccelerateDecelerateInterolator　先加速后減速，開始結(jié)束時(shí)慢，中間加速
AnticipateInterpolator　　　　　　反向，先向相反方向改變一段再加速播放
AnticipateOvershootInterpolator　反向加回彈，先向相反方向改變，再加速播放，會(huì)超出目的值然后緩慢移動(dòng)至目的值
BounceInterpolator　　　　　　　跳躍，快到目的值時(shí)值會(huì)跳躍，如目的值100，后面的值可能依次為85，77，70，80，90，100
CycleIinterpolator　　　　　　　　循環(huán)，動(dòng)畫循環(huán)一定次數(shù)，值的改變?yōu)橐徽液瘮?shù)：Math.sin(2 * mCycles * Math.PI * input)
LinearInterpolator　　　　　　　　線性，線性均勻改變
OvershottInterpolator　　　　　　回彈，最后超出目的值然后緩慢改變到目的值
TimeInterpolator　　　　　　　　一個(gè)接口，允許你自定義interpolator，以上幾個(gè)都是實(shí)現(xiàn)了這個(gè)接口

其實(shí)想實(shí)現(xiàn)對(duì)應(yīng)的效果，其實(shí)是找一條曲線對(duì)對(duì)應(yīng)條件進(jìn)行模擬，然后根據(jù)曲線函數(shù)，和X值，得出每個(gè)時(shí)間點(diǎn)上對(duì)應(yīng)的Y值（插值），這也就是插值器原理；

2.ObjectAnimator

我們同樣還是實(shí)現(xiàn)在2S內(nèi)將view橫向拉長(zhǎng)為2倍，縱向壓縮為0：

AnimatorSet animatorSet = new AnimatorSet();// 將view在x方向上從原大小放大2倍ObjectAnimator scaleXAnimator = ObjectAnimator.ofFloat(mTestImage, "scaleX", 1, 2);scaleXAnimator.setDuration(SCALE_ANIM_TIME);// 將view在y方向上從原大小壓縮為0ObjectAnimator scaleYAnimator = ObjectAnimator.ofFloat(mTestImage, "scaleY", 1, 0);scaleYAnimator.setDuration(SCALE_ANIM_TIME);// 設(shè)置加速模式animatorSet.setInterpolator(new AccelerateInterpolator());// 設(shè)置回調(diào)，當(dāng)然也可以設(shè)置在單獨(dú)的animator上，eg：scaleXAnimatoranimatorSet.addListener(new AnimatorListenerAdapter() {@Overridepublic void onAnimationStart(Animator animation) {super.onAnimationStart(animation);Toast.makeText(getApplicationContext(), "onAnimationStart", Toast.LENGTH_SHORT).show();}@Overridepublic void onAnimationEnd(Animator animation) {super.onAnimationEnd(animation);Toast.makeText(getApplicationContext(), "onAnimationEnd", Toast.LENGTH_SHORT).show();}@Overridepublic void onAnimationCancel(Animator animation) {super.onAnimationCancel(animation);}@Overridepublic void onAnimationRepeat(Animator animation) {super.onAnimationRepeat(animation);}});animatorSet.playTogether(scaleXAnimator, scaleYAnimator);animatorSet.start();

ObjectAnimator 是ValueAnimator 的子類，可以直接改變Object的屬性，目前可供改變的屬性主要有：

translationX,translationY View相對(duì)于原始位置的偏移量
rotation,rotationX,rotationY 旋轉(zhuǎn)，rotation用于2D旋轉(zhuǎn)角度，3D中用到后兩個(gè)
scaleX,scaleY 縮放比
x,y View的最終坐標(biāo)，是View的left，top位置加上translationX，translationY
alpha 透明度

關(guān)于Animator主要分享這兩個(gè)類，其他的比如 PropertyValuesHolder 大家可以自己去看；

QQ管家桌面懸浮窗動(dòng)畫

分析：
1.浮在桌面上的小圓泡可以蓋在所有應(yīng)用之上，并且可以獨(dú)立操作，不影響其他操作，需要使用WindowManager.addView ；
2.拖動(dòng)的時(shí)候變成小火箭，需要手勢(shì)處理 onTouch；
3.拖動(dòng)到底部區(qū)域的時(shí)候震動(dòng)，需要對(duì)拖動(dòng)到的位置做時(shí)候判斷；
4.放手時(shí)位置如果在底座區(qū)，則發(fā)射火箭，否則變成小圓回到邊界；
5.火箭噴火效果，可以通過兩張圖幀動(dòng)畫實(shí)現(xiàn)，也可以采用屬性動(dòng)畫實(shí)現(xiàn)（通過看QQ管家的圖，應(yīng)該是采用的幀動(dòng)畫方式）；
6.底部的底座閃動(dòng)效果也是三張圖的幀動(dòng)畫；

MainActivity

package com.itheima.rocket;import java.nio.channels.AlreadyConnectedException;import android.os.Bundle; import android.os.Handler; import android.os.Message; import android.app.Activity; import android.graphics.drawable.AnimationDrawable; import android.view.Menu; import android.view.MotionEvent; import android.view.View; import android.view.View.OnTouchListener; import android.view.animation.AlphaAnimation; import android.view.animation.Animation; import android.widget.ImageView; import android.widget.Toast;public class MainActivity extends Activity {private ImageView iv;private ImageView iv_bottom; private ImageView iv_top;private AnimationDrawable rocketAnimation;private Handler handler = new Handler(){public void handleMessage(android.os.Message msg) {int position = (Integer) msg.obj ;iv.layout(iv.getLeft(), position, iv.getRight(), position+iv.getHeight());if(position<320){iv_top.setVisibility(View.VISIBLE);AlphaAnimation aa = new AlphaAnimation(0.6f, 1.0f);aa.setDuration(300);iv_top.startAnimation(aa);}if(position<20){AlphaAnimation aa = new AlphaAnimation(1.0f, 0.0f);aa.setDuration(300);aa.setFillAfter(true);iv_top.startAnimation(aa);}};};@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);iv = (ImageView) findViewById(R.id.iv);iv.setBackgroundResource(R.drawable.rocket);iv_top = (ImageView) findViewById(R.id.iv_top);iv_bottom = (ImageView) findViewById(R.id.iv_bottom);rocketAnimation = (AnimationDrawable) iv.getBackground();rocketAnimation.start();iv.setOnTouchListener(new OnTouchListener() {int startX;int startY;@Overridepublic boolean onTouch(View v, MotionEvent event) {switch (event.getAction()) {case MotionEvent.ACTION_DOWN:startX =(int) event.getRawX();startY =(int) event.getRawY();break;case MotionEvent.ACTION_MOVE:int newX =(int) event.getRawX();int newY =(int) event.getRawY();int dx = newX - startX;int dy = newY - startY;//wm.updateViewLayout();iv.layout(iv.getLeft()+dx, iv.getTop()+dy, iv.getRight()+dx, iv.getBottom()+dy);startX =(int) event.getRawX();startY =(int) event.getRawY();break;case MotionEvent.ACTION_UP:int top = iv.getTop();int left = iv.getLeft();int right = iv.getRight();if(top>300&&left>100&&right<220){Toast.makeText(getApplicationContext(), "發(fā)射火箭", 0).show();iv_bottom.setVisibility(View.VISIBLE);AlphaAnimation aa = new AlphaAnimation(0.0f, 1.0f);aa.setDuration(500);aa.setRepeatCount(1);aa.setRepeatMode(Animation.REVERSE);aa.setFillAfter(true);iv_bottom.startAnimation(aa);sendRocket();}break;}return true;}});}protected void sendRocket() {new Thread(){public void run() {int start = 380;for(int i = 0 ;i<=11;i++){try {Thread.sleep(50);} catch (InterruptedException e) {e.printStackTrace();}//更新一下uiMessage msg = Message.obtain();msg.obj = 380 - i*38;//計(jì)算出火箭的高度handler.sendMessage(msg);}};}.start();} }

rocket.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/desktop_rocket_launch_1" android:duration="200" /><item android:drawable="@drawable/desktop_rocket_launch_2" android:duration="200" /> </animation-list>

布局文件

源代碼下載

源代碼

參考鏈接

Animation & Property Animation 使用 - Ajian_studio - 博客頻道 - CSDN.NET

【TweenedAnimation】四種動(dòng)畫效果參數(shù)詳解(自測(cè)所得) - 邪天殤 - 博客園

完成

總結(jié)

以上是生活随笔為你收集整理的Animation Property Animation 使用的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。

上一篇： MySQL流浪记（七）—— MySQL删
下一篇：简单的线性回归实现模型的存储和读取