Android-動畫的入門和實現(xiàn)

在我們Android開發(fā)中,經(jīng)常會使用到簡單或者動畫,這里就對Android開發(fā)中的動畫做了一下簡單的總結(jié)。

Android 動畫分類

總的來說,Android動畫可以分為兩類,最初的傳統(tǒng)動畫和Android3.0 之后出現(xiàn)的屬性動畫;

傳統(tǒng)動畫又包括幀動畫(Frame Animation)補間動畫(Tweened Animation)。

Paste_Image.png

一傳統(tǒng)動畫

1.幀動畫

幀動畫是最容易實現(xiàn)的一種動畫,這種動畫更多的依賴于完善的UI資源,他的原理就是將一張張單獨的圖片連貫的進行播放,

從而在視覺上產(chǎn)生一種動畫的效果;而我們要做的就是:使用代碼把一幅幅的圖片按順序顯示。

我們來寫上面逗比貓的動畫:

<?xml version="1.0"encoding="utf-8"?>

protectedvoidonCreate(@Nullable Bundle savedInstanceState){super.onCreate(savedInstanceState);? ? ? ? setContentView(R.layout.activity_frame_animation);? ? ? ? ImageView animationImg1 = (ImageView) findViewById(R.id.animation1);? ? ? ? animationImg1.setImageResource(R.drawable.frame_anim1);? ? ? ? AnimationDrawable animationDrawable1 = (AnimationDrawable) animationImg1.getDrawable();? ? ? ? animationDrawable1.start();? ? }

在有些代碼中,我們還會看到android:oneshot="false",這個oneshot 的含義就是動畫執(zhí)行一次(true)還是循環(huán)執(zhí)行多次。

上面其他幾個動畫實現(xiàn)方式都是一樣,無非就是圖片資源的差異。(其實我們小時看過的動畫片大部分就是這樣搞出來的)

2.補間動畫

補間動畫又可以分為四種形式,分別是** alpha(淡入淡出),translate(位移)scale(縮放大?。?b>,rotate(旋轉(zhuǎn))**。

補間動畫的實現(xiàn),一般會采用xml 文件的形式;代碼會更容易書寫和閱讀,同時也更容易復(fù)用。

XML 實現(xiàn)

首先,在res/anim/文件夾下定義如下的動畫實現(xiàn)方式

alpha_anim.xml 動畫實現(xiàn)

<?xml version="1.0"encoding="utf-8"?>

scale.xml 動畫實現(xiàn)

<?xml version="1.0"encoding="utf-8"?>

然后,在Activity中

Animation animation = AnimationUtils.loadAnimation(mContext, R.anim.alpha_anim);

img = (ImageView) findViewById(R.id.img);

img.startAnimation(animation);

這樣就可以實現(xiàn)ImageView alpha透明變化的動畫效果。

也可以使用set 標(biāo)簽將多個動畫組合(代碼源自Android SDK API)

<?xml version="1.0"encoding="utf-8"?>...

可以看到組合動畫是可以嵌套使用的。

各個動畫屬性的含義結(jié)合動畫自身的特點應(yīng)該很好理解,就不一一闡述了;這里主要說一下interpolatorpivot。

Interpolator 主要作用是可以控制動畫的變化速率 ,就是動畫進行的快慢節(jié)奏。

Android 系統(tǒng)已經(jīng)為我們提供了一些Interpolator ,比如 accelerate_decelerate_interpolator,accelerate_interpolator等。更多的interpolator 及其含義可以在Android SDK 中查看。同時這個Interpolator也是可以自定義的,這個后面還會提到。

pivot 決定了當(dāng)前動畫執(zhí)行的參考位置

pivot 這個屬性主要是在translate 和 scale 動畫中,這兩種動畫都牽扯到view 的“物理位置“發(fā)生變化,所以需要一個參考點。而pivotX和pivotY就共同決定了這個點;它的值可以是float或者是百分比數(shù)值。

我們以pivotX為例,

pivotX取值含義

10距離動畫所在view自身左邊緣10像素

10%距離動畫所在view自身左邊緣 的距離是整個view寬度的10%

10%p距離動畫所在view父控件左邊緣的距離是整個view寬度的10%

pivotY 也是相同的原理,只不過變成的縱向的位置。如果還是不明白可以參考源碼,在Tweened Animation中結(jié)合seekbar的滑動觀察rotate的變化理解。

使用代碼實現(xiàn)

有時候,動畫的屬性值可能需要動態(tài)的調(diào)整,這個時候使用xml 就不合適了,需要使用代碼實現(xiàn)

privatevoidRotateAnimation(){? ? ? ? animation =newRotateAnimation(-deValue, deValue, Animation.RELATIVE_TO_SELF,? ? ? ? ? ? ? ? pxValue, Animation.RELATIVE_TO_SELF, pyValue);? ? ? ? animation.setDuration(timeValue);if(keep.isChecked()) {? ? ? ? ? ? animation.setFillAfter(true);? ? ? ? }else{? ? ? ? ? ? animation.setFillAfter(false);? ? ? ? }if(loop.isChecked()) {? ? ? ? ? ? animation.setRepeatCount(-1);? ? ? ? }else{? ? ? ? ? ? animation.setRepeatCount(0);? ? ? ? }if(reverse.isChecked()) {? ? ? ? ? ? animation.setRepeatMode(Animation.REVERSE);? ? ? ? }else{? ? ? ? ? ? animation.setRepeatMode(Animation.RESTART);? ? ? ? }? ? ? ? img.startAnimation(animation);? ? }

這里animation.setFillAfter決定了動畫在播放結(jié)束時是否保持最終的狀態(tài);animation.setRepeatCount和animation.setRepeatMode 決定了動畫的重復(fù)次數(shù)及重復(fù)方式,具體細節(jié)可查看源碼理解。

好了,傳統(tǒng)動畫的內(nèi)容就說到這里了,個人覺得傳統(tǒng)動畫真的是被時代的潮流推得很靠后了。

二.屬性動畫

屬性動畫是現(xiàn)在使用的最多的一種動畫,顧名思義它是對于對象屬性的動畫。它比補間動畫更加強大,所有補間動畫的內(nèi)容,都可以通過屬性動畫實現(xiàn)。

屬性動畫大致分為兩種類型ViewPropertyAnimatorObjectAnimator。

ViewPropertyAnimator:適合一些通用的動畫,比如旋轉(zhuǎn)、位移、縮放和透明,使用方式也很簡單通過View.animate()即可得到ViewPropertyAnimator,之后進行相應(yīng)的動畫操作即可。

ObjectAnimator:適合用于為我們的自定義控件添加動畫,當(dāng)然首先我們應(yīng)該在自定義View中添加相應(yīng)的getXXX()和setXXX()相應(yīng)屬性的getter和setter方法,這里需要注意的是在setter方法內(nèi)改變了自定義View中的屬性后要調(diào)用invalidate()來刷新View的繪制。之后調(diào)用ObjectAnimator.of屬性類型()返回一個ObjectAnimator,調(diào)用start()方法啟動動畫即可。

屬性動畫入門

首先我們來看看如何用屬性動畫實現(xiàn)上面補間動畫的效果

privatevoidRotateAnimation(){? ? ObjectAnimator anim = ObjectAnimator.ofFloat(myView,"rotation",0f,360f);? ? anim.setDuration(1000);? ? anim.start();}privatevoidAlpahAnimation(){? ? ObjectAnimator anim = ObjectAnimator.ofFloat(myView,"alpha",1.0f,0.8f,0.6f,0.4f,0.2f,0.0f);? ? anim.setRepeatCount(-1);? ? anim.setRepeatMode(ObjectAnimator.REVERSE);? ? anim.setDuration(2000);? ? anim.start();}

這兩個方法用屬性動畫的方式分別實現(xiàn)了旋轉(zhuǎn)動畫和淡入淡出動畫,其中setDuration、setRepeatMode及setRepeatCount和補間動畫中的概念是一樣的。

可以看到,屬性動畫貌似強大了許多,實現(xiàn)很方便,同時動畫可變化的值也有了更多的選擇,動畫所能呈現(xiàn)的細節(jié)也更多。

當(dāng)然一樣牛逼的是屬性動畫也是可以組合實現(xiàn)

ObjectAnimator alphaAnim = ObjectAnimator.ofFloat(myView,"alpha",1.0f,0.5f,0.8f,1.0f);? ? ? ? ? ? ? ? ObjectAnimator scaleXAnim = ObjectAnimator.ofFloat(myView,"scaleX",0.0f,1.0f);? ? ? ? ? ? ? ? ObjectAnimator scaleYAnim = ObjectAnimator.ofFloat(myView,"scaleY",0.0f,2.0f);? ? ? ? ? ? ? ? ObjectAnimator rotateAnim = ObjectAnimator.ofFloat(myView,"rotation",0,360);? ? ? ? ? ? ? ? ObjectAnimator transXAnim = ObjectAnimator.ofFloat(myView,"translationX",100,400);? ? ? ? ? ? ? ? ObjectAnimator transYAnim = ObjectAnimator.ofFloat(myView,"tranlsationY",100,750);? ? ? ? ? ? ? ? AnimatorSetset=newAnimatorSet();set.playTogether(alphaAnim, scaleXAnim, scaleYAnim, rotateAnim, transXAnim, transYAnim);//? ? ? ? ? ? ? ? set.playSequentially(alphaAnim, scaleXAnim, scaleYAnim, rotateAnim, transXAnim, transYAnim);set.setDuration(3000);set.start();

可以看到這些動畫可以同時播放,或者是按序播放。

動畫監(jiān)聽器

您可以在動畫持續(xù)時間期間使用下面描述的偵聽器偵聽重要事件。

Animator.AnimatorListener

onAnimationStart() - 動畫啟動時調(diào)用。

onAnimationEnd() - 當(dāng)動畫結(jié)束時調(diào)用。

onAnimationRepeat() - 當(dāng)動畫重演調(diào)用。

onAnimationCancel()-當(dāng)動畫被取消調(diào)用。取消的動畫還呼吁onAnimationEnd(),無論他們是如何結(jié)束。

ValueAnimator.AnimatorUpdateListener

onAnimationUpdate()-稱為動畫的每一幀上。 聽此事件使用所產(chǎn)生的計算值ValueAnimator動畫中。 要使用該值,查詢ValueAnimator傳遞到事件來獲取與當(dāng)前動畫值對象getAnimatedValue()方法。 實現(xiàn)這個監(jiān)聽器。

根據(jù)什么屬性或?qū)ο蟮膭赢嫞憧赡苄枰{(diào)用invalidate()上查看迫使屏幕的該區(qū)域的新的動畫值重繪自身。 例如,對Drawable對象的顏色屬性進行動畫處理只會在該對象重繪本身時更新屏幕。 所有在查看屬性制定者,如setAlpha()和setTranslationX()正確無效視圖,所以你不需要調(diào)用這些方法與新的值時無效視圖。

在XML聲明動畫

屬性動畫系統(tǒng)允許您使用XML聲明屬性動畫,而不是以編程方式。 通過在XML中定義動畫,您可以輕松地在多個活動中重復(fù)使用動畫,并更輕松地編輯動畫序列。

為了區(qū)分使用與那些使用舊的新的屬性動畫的API動畫文件觀看動畫框架,開始與Android 3.1,你應(yīng)該保存XML文件在屬性動畫res/animator/目錄下。

以下屬性動畫類通過以下XML標(biāo)記支持XML聲明:

ValueAnimator -

ObjectAnimator -

AnimatorSet -

下面的示例播放兩套對象的動畫順序,第一組嵌套組一起編寫兩個對象的動畫:

為了運行這個動畫,必須在代碼中的充氣XML資源AnimatorSet對象,然后開始動畫集之前為所有動畫的目標(biāo)對象。呼叫setTarget()設(shè)置的所有兒童的單一目標(biāo)對象AnimatorSet的方便。下面的代碼演示如何做到這一點:

AnimatorSetset= (AnimatorSet) AnimatorInflater.loadAnimator(myContext,? R.anim.property_animator);set.setTarget(myObject);set.start();

當(dāng)然了,關(guān)于動畫已經(jīng)有好多NB的開源動畫庫了例如Lottie動畫庫,Facebook-Rebound 彈性動畫庫

最后編輯于
?著作權(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)容

  • 1 背景 不能只分析源碼呀,分析的同時也要整理歸納基礎(chǔ)知識,剛好有人微博私信讓全面說說Android的動畫,所以今...
    未聞椛洺閱讀 2,850評論 0 10
  • 在我們Android開發(fā)中,經(jīng)常會使用到簡單或者動畫,這里就對Android開發(fā)中的動畫做了一下簡單的總結(jié)。 An...
    夏尼采閱讀 416評論 0 11
  • 【Android 動畫】 動畫分類補間動畫(Tween動畫)幀動畫(Frame 動畫)屬性動畫(Property ...
    Rtia閱讀 6,386評論 1 38
  • 一: 傳統(tǒng) View 動畫(Tween/Frame) 1.1 Tween 動畫 主要有 4 中:縮放、平移、漸變、...
    dfg_fly閱讀 851評論 1 2
  • Animation Animation類是所有動畫(scale、alpha、translate、rotate)的基...
    四月一號閱讀 2,030評論 0 10

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