Property Animation 屬性動畫

? ? ? ?屬性動畫是一個強大的框架，它幾乎可以讓你的所有東西做動畫，你可以隨著時間的推移通過更改他們的屬性來定義動畫，無論它是否繪制在屏幕上，一個屬性動畫是在指定的時間內去改變屬性（一個對象的字段）。你指定想要完成動畫的對象的屬性去做動畫，比如你在屏幕上的位置，想讓它動多久，和動畫的屬性值。

屬性動畫允許你定義以下特征：

Duraiton 時間：指定的動畫發生的時間端，默認是300ms。

Time interpolation 插值器：指定屬性的值，該值是由當前動畫的時間計算而來的。

Repeat count and behavio 重復次數和行為：指定動畫重復次數和動畫反向播放。

Animator sets 動畫集：指定多個動畫同時播放或者按照一定的邏輯有序的播放。

Frame refresh delay 幀刷新延遲：指定動畫刷新的延遲時間。

How Property Animation Works 屬性動畫是如何工作的

? ? ? ?首先，讓我們看看如何在動畫作品用一個簡單的例子。圖1描繪了動畫與其x屬性，它表示在畫面上的水平位置的假想物體。動畫的持續時間被設定為40毫秒，并以行進的距離是40個像素。每隔10毫秒，這是默認的幀刷新速率，目的是通過10個像素沿水平方向移動。在40毫秒結束時，動畫停止，并且對象結束于水平位置40，這是與線性內插的動畫的例子，這意味著在一個恒定速度的物體運動。

還可以指定動畫具有非線性內插。圖2示出了加速時的動畫開始一個假想的對象，并減速在動畫結束。對象仍移動40個像素在40毫秒的，但非直線。在開始的時候，這個動畫加速到中間點，然后減速，從中間點，直到動畫結束。如圖2所示，行進的距離在開始和動畫的端小于在中間。

讓我們來詳細看一下屬性動畫系統的重要組成部分，如何將計算如上所示的那些動畫。圖3示出了主要的類與另一個是如何工作的。

原理一大堆：

ValueAnimator 對象跟蹤你的動畫時間，如動畫已經運行了多長時間，動畫正在運行時的當前屬性值。

ValueAnimator封裝了TimeInterpolator ，它定義動畫差值和一個TypeEvaluator，它定義了如何去計算這些動畫的屬性，

創建一個動畫，要給它一個起始值和終點值，運行期間的時間。啟用start()之后動畫就開始運行了，在整個動畫，所述ValueAnimator計算0和1之間的經過部分，基于該動畫的持續時間和還有多少時間結束。經過的分數表示的時間，該動畫已完成的百分比，0表示0％和1的含義為100％。例如，在圖1中，在t的經過分率=10毫秒將是0.25，因為總的持續時間為t= 40毫秒。

How Property Animation Differs from View Animation 屬性動畫與View動畫的區別

該視圖的動畫系統提供的能力，只有動畫視圖對象，所以如果你想制作動畫的非視圖對象，你必須實現自己的代碼來這樣做。該視圖的動畫系統也受限于一個事實，即它僅公開了一個查看對象的幾個方面進行動畫，如一個視圖的縮放和旋轉，但不是背景顏色，例如。

視圖動畫系統的另一個缺點是，它僅修改其視圖繪制，而不是實際的視圖本身。舉例來說，如果你的動畫一個按鈕在屏幕上移動，按鈕繪制正確的，但在這里你可以點擊按鈕的實際位置不會改變，所以你要實現你自己的邏輯來處理這個問題。

隨著物業動畫系統，這些約束完全刪除，并且可以設置動畫的任何對象（視圖和非視圖）的任何屬性和對象本身實際上被修改。屬性動畫系統也是它執行的動畫的方式更加健壯。在一個較高的水平，分配給動畫師要動畫的屬性，如顏色，位置或大小，可以定義動畫的方面，如插補和多個動畫同步。

API 概述：

你可以發現，大部分的屬性動畫系統API的android.animation。因為視圖動畫系統已經定義了android.view.animation許多插值，你可以使用這些插值物業動畫系統也是如此。

屬性動畫使用示例：

新建application，創建布局文件，創建類，下面給一個ImageView屬性動畫，之后的變化只貼出動畫方法。動畫是通過點擊ImageView自身觸發的。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:id="@+id/parent"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical" ><ImageViewandroid:id="@+id/image_view_01"android:layout_width="wrap_content"android:layout_height="wrap_content"android:background="@drawable/png_01" /></LinearLayout>java

mView.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View arg0) {animator09(arg0);}});反轉動畫：

private void animator01(View view) {ObjectAnimator.ofFloat(view, "rotationX", 0.0F, 360F).setDuration(500).start();}

縮小淡出動畫

private void animator02(final View view) {ObjectAnimator mAnimator = ObjectAnimator.ofFloat(view, "zhy", 1.0F, 0.0F).setDuration(500);mAnimator.start();mAnimator.addUpdateListener(new AnimatorUpdateListener() {@Overridepublic void onAnimationUpdate(ValueAnimator animation) {float cVal = (Float) animation.getAnimatedValue();view.setAlpha(cVal);view.setScaleX(cVal);view.setScaleY(cVal);}});}

放大縮小再放大動畫，放大同時變化透明度

// 復合動畫,放大，透明度變化@SuppressLint("NewApi")private void animator03(View view) {PropertyValuesHolder pX = PropertyValuesHolder.ofFloat("alpha", 1F, 0F, 1F);PropertyValuesHolder pY = PropertyValuesHolder.ofFloat("scaleX", 1F, 0F, 1F);PropertyValuesHolder pZ = PropertyValuesHolder.ofFloat("scaleY", 1F, 0F, 1F);ObjectAnimator.ofPropertyValuesHolder(view, pX, pY, pZ).setDuration(500).start();}

自由落體

// 自由落體@SuppressLint("NewApi")private void animator04(final View view) {ValueAnimator animator = ValueAnimator.ofFloat(0, 300);animator.setTarget(view);animator.setDuration(1000);animator.start();animator.addUpdateListener(new AnimatorUpdateListener() {@Overridepublic void onAnimationUpdate(ValueAnimator arg0) {// TODO Auto-generated method stubview.setTranslationY((Float) arg0.getAnimatedValue());}});}

拋物線

private void animator05(final View view) {ValueAnimator animator = ValueAnimator.ofFloat();animator.setDuration(3000);animator.setObjectValues(new PointF(0, 0));animator.setInterpolator(new LinearInterpolator());animator.setEvaluator(new TypeEvaluator<PointF>() {@Overridepublic PointF evaluate(float fraction, PointF startValue, PointF endValue) {// Log.i("ABC", fraction + "");PointF mPointF = new PointF();mPointF.x = 200 * fraction * 3;mPointF.y = 0.5f * 200 * fraction * 3 * fraction * 3;return mPointF;}});animator.start();animator.addUpdateListener(new AnimatorUpdateListener() {@Overridepublic void onAnimationUpdate(ValueAnimator arg0) {// TODO Auto-generated method stubPointF mPointF = (PointF) arg0.getAnimatedValue();view.setX(mPointF.x);view.setY(mPointF.y);}});animator.addListener(new AnimatorListener() {@Overridepublic void onAnimationStart(Animator arg0) {Log.i("ABC", "1");}@Overridepublic void onAnimationRepeat(Animator arg0) {Log.i("ABC", "2");}@Overridepublic void onAnimationEnd(Animator arg0) {Log.i("ABC", "3");}@Overridepublic void onAnimationCancel(Animator arg0) {Log.i("ABC", "4");}});animator.addListener(new AnimatorListenerAdapter() {@Overridepublic void onAnimationEnd(Animator animation) {// TODO Auto-generated method stubsuper.onAnimationEnd(animation);}});} private void animator06(View view) {ObjectAnimator mAniX = ObjectAnimator.ofFloat(view, "scaleX", 1.0F, 2.0F);ObjectAnimator mAniY = ObjectAnimator.ofFloat(view, "scaleY", 1.0F, 2.0F);AnimatorSet animSet = new AnimatorSet();animSet.setDuration(2000);animSet.setInterpolator(new LinearInterpolator());animSet.playTogether(mAniX, mAniY);animSet.start();}

多動畫同時進行

private void animator06(View view) {ObjectAnimator mAniX = ObjectAnimator.ofFloat(view, "scaleX", 1.0F, 2.0F);ObjectAnimator mAniY = ObjectAnimator.ofFloat(view, "scaleY", 1.0F, 2.0F);AnimatorSet animSet = new AnimatorSet();animSet.setDuration(2000);animSet.setInterpolator(new LinearInterpolator());animSet.playTogether(mAniX, mAniY);animSet.start();}

多動畫有序進行

private void animator07(View view) {float cx = view.getX();ObjectAnimator mAni1 = ObjectAnimator.ofFloat(view, "scaleX", 1.0F, 2.0F);ObjectAnimator mAni2 = ObjectAnimator.ofFloat(view, "scaleY", 1.0F, 2.0F);ObjectAnimator mAni3 = ObjectAnimator.ofFloat(view, "x", cx, 0f);ObjectAnimator mAni4 = ObjectAnimator.ofFloat(view, "y", cx);AnimatorSet set = new AnimatorSet();set.play(mAni1).with(mAni2);set.play(mAni2).with(mAni3);set.play(mAni4).after(mAni3);set.setDuration(1000).start();}效果同上。

xml定義屬性動畫

<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android" ><objectAnimatorandroid:duration="1000"android:propertyName="scaleX"android:valueFrom="1"android:valueTo="0.5" ></objectAnimator><objectAnimatorandroid:duration="1000"android:propertyName="scaleY"android:valueFrom="1"android:valueTo="0.5" ></objectAnimator></set>

private void animator08(View view) {Animator animator = AnimatorInflater.loadAnimator(this, R.animator.scalexy);view.setPivotX(0);view.setPivotY(0);view.invalidate();animator.setTarget(view);animator.start();}

View的animator屬性設置動畫

private void animator09(final View v) {v.animate().alpha(0).y(200).setDuration(500).withStartAction(new Runnable() {@Overridepublic void run() {// TODO Auto-generated method stub}}).withEndAction(new Runnable() {@Overridepublic void run() {// TODO Auto-generated method stubrunOnUiThread(new Runnable() {@SuppressLint("NewApi")public void run() {v.setY(0);v.setAlpha(1.0f);}});}}).start();}

LayoutTransition?

LayoutTransition 對ViewGroup中的View改變進行動畫顯示

LayoutTransition.APPEARING ? ? ? ? ? ? ? ? ? ? ?view出現時自身view的動畫。

LayoutTransition.CHANGE_APPEARING ? ? ?view出現自身view此之外其他兄弟view的動畫

LayoutTransition.DISAPPEARING ? ? ? ? ? ? ? ? view消失時本身view的動畫

LayoutTransition.CHANGE_DISAPPEARING view消失時除自身view以外的兄弟view的動畫

LayoutTransition.CHANGING ? ? ? ? ? ? ? ? ? ? ? 不知道是干嘛的，試了好多情況沒發現效果

java

public class MainActivity extends Activity {Button mAddBtn;ViewGroup group;//int btn = 0;GridLayout gridLayout = null;LayoutTransition mTransition;@TargetApi(Build.VERSION_CODES.ICE_CREAM_SANDWICH)protected void onCreate(Bundle savedInstanceState) {// TODO Auto-generated method stubsuper.onCreate(savedInstanceState);setContentView(R.layout.activity_main);group = (ViewGroup) findViewById(R.id.parent);mAddBtn = (Button) findViewById(R.id.add_btn);mAddBtn.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View arg0) {addBtn(arg0);}});gridLayout = new GridLayout(this);gridLayout.setColumnCount(5);group.addView(gridLayout);mTransition = new LayoutTransition();mTransition.setAnimator(LayoutTransition.APPEARING, mTransition.getAnimator(LayoutTransition.APPEARING));mTransition.setAnimator(LayoutTransition.CHANGE_APPEARING, mTransition.getAnimator(LayoutTransition.CHANGE_APPEARING));mTransition.setAnimator(LayoutTransition.DISAPPEARING, mTransition.getAnimator(LayoutTransition.DISAPPEARING));mTransition.setAnimator(LayoutTransition.CHANGE_DISAPPEARING,mTransition.getAnimator(LayoutTransition.CHANGE_DISAPPEARING));mTransition.setAnimator(LayoutTransition.CHANGING, mTransition.getAnimator(LayoutTransition.CHANGING));gridLayout.setLayoutTransition(mTransition);}@TargetApi(Build.VERSION_CODES.ICE_CREAM_SANDWICH)@SuppressLint("NewApi")private void addBtn(View view) {final Button button = new Button(this);button.setText((++btn) + "");gridLayout.addView(button, Math.min(1, gridLayout.getChildCount()));button.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View arg0) {// TODO Auto-generated method stubgridLayout.removeView(button);}});} }

轉載于:https://www.cnblogs.com/gmm283029/p/4498934.html

總結

以上是生活随笔為你收集整理的Property Animator 属性动画概述与示例的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。