上級Android - プロパティアニメーションの詳細解説(1)_html/css_WEB-ITnose

はじめに

前回の記事「Android 入門 - トゥイーン アニメーションとフレーム アニメーション アプリケーションの概要」では、トゥイーン アニメーション、フレーム アニメーション、およびいくつかの関連アプリケーションについてまとめています。基本的には、簡単なスケーリング、回転、透明度の変更、および移動のアニメーション効果を習得できます。 , ただし、ビュー切り替えアニメーション、レイアウト切り替えアニメーション、3D 回転アニメーションなど、より複雑なアニメーション効果を実現する必要がある場合、ビュー アニメーションではこれらを実行できません。このとき、プロパティ アニメーションが登場しました。この記事では、プロパティ アニメーションに関する知識を中心にまとめます。

1. プロパティ アニメーションの概要

プロパティ アニメーション、私が Android 1.5 に初めて触れたとき、そのようなアニメーション システムは存在せず、Android 3.0 まで導入されませんでした (3.0 より前のシステムでは、プロパティ アニメーションは NineOldAndroids を通じて使用できます)プロジェクト） 。公式ドキュメントでは次のように紹介されています: プロパティ アニメーション システムは、ほぼすべてのオブジェクトをアニメーション化できる強力なフレームワークで、オブジェクトが画面に描画されているかどうかに関係なく、時間の経過とともにオブジェクトのプロパティを変更するアニメーションを定義できます。

指定された時間の長さの値で変化するのは、オブジェクト (フィールド内のオブジェクト) の実際のプロパティ値です 。つまり、プロパティアニメーションはです。アニメーション実行クラス(Animatorシステム)は、アニメーション操作オブジェクトのプロパティ、期間、開始および終了プロパティ値、時間差などを設定し、システムは設定に従ってパラメータを設定します。 . オブジェクトのプロパティを動的に変更するアニメーション効果。 。 2. プロパティアニメーションのアニメーション処理 次に、公式ドキュメントから例を引用します（追伸：Googleの公式ドキュメントは非常にわかりやすく説明されており、最高の学習教科書と言えます。もちろん、あなたは辛抱強く待つ必要があります）英語を読んでください）。 最初の例は、持続時間が 40 ミリ秒で均一に変化するアニメーションで、フレームが 10 ミリ秒ごとに更新されます (目的は水平方向に 10 ピクセル移動することです)。x がこの実際の属性とみなされることに注意してください。オブジェクト、この x もアニメーションの進行に応じて変化し続けます。

2 つ目は、非線形変化アニメーションです (
属性値を変更する、つまり、異なる補間を設定することで
、下の図では、移動速度が最初は徐々に増加し、その後徐々に減少します)、こちらも 40ms で時間が 40 ピクセル移動し、アニメーションの進行に合わせて x 属性が常に変化します。
1. 属性アニメーション リスナー

属性アニメーションの基本クラス

Animator

は、2 つの内部リスニング インターフェイスをカプセル化します:

Animator.AnimatorListener『onAnimationCancel(Animator アニメーション)、onAnimationEnd(Animator アニメーション)、onAnimationRepeat(Animator アニメーション)、』 、onAnimationStart(アニメーター アニメーション)』と Animator.AnimatorPauseListener
『onAnimationPause(アニメーター アニメーション)、onAnimationResume(アニメーター アニメーション)』。
Animator listen関連メソッドの使い方説明

void addListener(Animator.AnimatorListener listenr)void addPauseListener(Animator.AnimatorPauseListener リスナー)void removeAllListeners()void removeListener (Animator.AnimatorListener リスナー)void removePauseListener(Animator.AnimatorPauseListener リスナー)

リスナーの追加(開始、繰り返し、終了などアニメーションの存続期間中)

一時停止中に聞く

すべてのリスナーをキャンセル

リスニングを指定しない

一時停止指定を解除

3. プロパティ アニメーション

の計算原理 まず、公式のプロパティ アニメーション
のいくつかの重要なコンポーネント間の関係図を見てみましょう。たとえば、図 2 では、使用される
TimeInterpolator は AccelerateDecelerateInterpolator であり、 TypeEvaluator は IntEvaluator、ValueAnimator は、最初の 2 つをカプセル化する属性アニメーションのコア クラスです。

コンポーネント関数の説明アニメーション時間、開始および終了属性値、対応する時間属性値の計算方法など、プロパティアニメーションアニメーションのすべてのコア機能が含まれています。 定義 アニメーション補間の方法 開始値と終了値、およびTimeIniterpolatorで計算された値に基づいて属性値を計算するインターフェース。 ValueAnimatorからのhheritsであり、アニメーション実行クラスでもあります。アニメーションクラスでもあります。等 ユーザーが属性アニメーションをロードするための XML ファイル

属性アニメーションを開始する場合、システムはまず ValueAnimator を作成し、属性の開始値と終了値を指定してから、start() を呼び出してアニメーションを実行します。アニメーションの実行期間中、ValueAnimator は次のようになります。アニメーション全体の実行時間と継続時間に基づいて、時間比率によって 時間係数 が計算されます (範囲は 0 ～ 1、0 は 0% を表し、1 は 100% 完了を表します)。その後、TimeInterpolator によって 補間が計算されます。係数 (分数)、そして最後に TypeAnimator は開始時間、終了時間、および補間係数を渡し、その時点での属性値を計算するために使用されます。
例:
上の例では、t=10ms の場合、ValueAnimator はアニメーション全体の継続時間に対する実行時間の比率に基づいて時間係数を 0.25 (10/40) と計算します。次に、TimeInterpolator は補間係数を計算します。約 0.15 になります。

//上例使用的是AccelerateDecelerateInterpolator，其中input为时间系数public float getInterpolation(float input) {    return (float)(Math.cos((input + 1) * Math.PI) / 2.0f) + 0.5f;}

最後に TypeAnimator この係数を使用すると、10ms での属性値は 6pix と計算されます。

//插值系数fraction，开始值startValue，结束值endValuepublic Float evaluate(float fraction, Number startValue, Number endValue) {    float startFloat = startValue.floatValue();    return startFloat + fraction * (endValue.floatValue() - startFloat);}

4. アニメーション システムによってサポートされるアニメーションに対して定義された属性

Duration: アニメーションの長さ、デフォルトは 300ms です

TimeInterpolation: AccelerateDecelerateInterpolator などの補間の計算方法

TypeEvaluator: による属性の先頭まで、TimeInterpolation で計算された終了値と係数を使用して、時間に対応する属性値を計算します

Repeat Count and Behavior: 3 回、5 回再生などの繰り返し回数と方法、無限ループでは、アニメーションを常に繰り返すことも、最後まで再生してから逆再生することもできます

アニメーション セット: アニメーション セット、つまり、複数のアニメーションを 1 つのオブジェクトに同時に適用できます。これらのアニメーションは同時に再生することも、異なるアニメーションに対して異なる開始オフセットを設定することもできます

フレーム更新遅延: 更新する頻度、つまり属性値が計算される頻度 (デフォルトは 10 ミリ秒)。リフレッシュ時間は、システム プロセスのスケジューリングとハードウェアにも影響されます

5. 属性アニメーションの適用

1. ObjectAnimator を使用して属性アニメーションを実行します

ObjectAnimator で属性アニメーションを実行するには、アニメーションが動作するオブジェクトが get および set を提供する必要があります対応する属性のメソッド。属性アニメーションは、渡した属性の初期値と最終値に基づいて set メソッドを複数回呼び出すため、正確には、set メソッドに渡される値は毎回異なります。 , 時間が経つにつれて、渡された値は最終値にどんどん近づいていきます。つまり、オブジェクトの属性 xxx をアニメーション化する場合、アニメーションを有効にするには、2 つの条件を同時に満たす必要があります。

ofInt、ofFloat、ofObject: ofXxx メソッドは、アニメーションのオブジェクト、オブジェクトの実際のプロパティ、アニメーションの開始と終了、およびその間のプロパティ値を設定するために使用されます。 属性値の値を渡す場合、デフォルトでは現在のオブジェクトの属性の値が開始され (getPropName リフレクションによって取得されるため、2 番目のパラメーターである属性フィールドは実際に存在する必要があります)、次に設定値が続きます。私は送る。 2 つ渡された場合、1 つは開始で、もう 1 つは終了です。これらの ofXxx システムはすべて ObjectAnimator を返します

static ObjectAnimator   ofFloat(Object target, String propertyName, float... values)//其他重载形式省

アニメーションの更新プロセス中、要素のプロパティを更新するために setPropName が継続的に呼び出されるため、ObjectAnimator を使用して更新する場合は、アニメーション中に初期値が渡されない場合、システムは xxx 属性の初期値を取得する必要があるため、オブジェクトは setXxx メソッドを提供する必要があります (そうでない場合)。満足すると、プログラムは直接クラッシュします)

ValueAnimator
TimeInterpolator
TypeEvaluator、
AnimatorInflater

サポートされている属性の使用法scaleXscaleY: yViewの最終的な座標は、Viewの左と上の位置にtranslationX、translationYを加えたものになります

object的setXxx对属性xxx所做的改变必须能够通过某种方法反映出来，比如会带来ui的改变啥的（如果这条不满足，动画无效果但不会Crash）

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">    <ImageView android:id="@+id/id_ball" android:layout_width="400dp" android:layout_height="400dp" android:layout_centerInParent="true" android:src="@mipmap/bcg" android:scaleType="centerCrop" android:onClick="runPropertyAnim" /></RelativeLayout>

package com.crazymo.anim;import android.animation.ObjectAnimator;import android.app.Activity;import android.os.Bundle;import android.view.View;public class MainActivity extends Activity {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);    }    public void runPropertyAnim(View v){        ObjectAnimator                .ofFloat(v, "rotationY", 0.0F, -360.0F)//rotationY为v的实际属性字段，如果任意传递字段值程序有可能无效果甚至crash，本例中是ImageView的实际属性                .setDuration(5000)                .start();             }}

2、使用ValueAnimator运行属性动画

ValueAnimator本身不作用于任何对象，即直接使用它没有任何动画效果。它可以对一个属性值做动画，然后通过可以监听其动画过程，在动画过程中修改我们的对象的属性值，这样也就相当于我们的对象做了动画，当然，也不要求操作的对象的属性一定要有getter和setter方法，你可以自己根据当前动画的计算值，来操作任何属性。

package com.crazymo.anim;import android.animation.ObjectAnimator;import android.animation.ValueAnimator;import android.app.Activity;import android.content.Context;import android.content.Intent;import android.os.Bundle;import android.view.View;import android.view.WindowManager;import android.view.animation.AccelerateInterpolator;import android.widget.ImageView;public class MainActivity extends Activity {    private float mScreenHeight;    private ImageView mImage;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main2);        mImage= (ImageView) findViewById(R.id.img_ball);        WindowManager wm = (WindowManager)getApplicationContext()                .getSystemService(Context.WINDOW_SERVICE);        //int width = wm.getDefaultDisplay().getWidth();        mScreenHeight = wm.getDefaultDisplay().getHeight();    }    /** * @param view 作用的目标对象 */    public void verticalRun( View view)    {        ValueAnimator animator = ValueAnimator.ofFloat(0, mScreenHeight                - mImage.getHeight());        animator.setTarget(mImage);//设置应用到的目标对象        animator.setInterpolator(new AccelerateInterpolator());//设置加速器        animator.setDuration(2000).start();        animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {            @Override            public void onAnimationUpdate(ValueAnimator animation) {                mImage.setTranslationY((Float) animation.getAnimatedValue());            }        });    }}

3、AnimatorSet的应用

変換 D で使用されます 最後の 2 つ	,
Scale rate x、
alpha	transparency

方法 参数及用法

AnimatorSet()	构造方法
void cancel()	取消动画集
AnimatorSet.Builder play(Animator anim)	产生Builder对象，用于设置播放动画的规则（约束）
void playSequentially(Animator… items)及重载形式	依次执行动画效果
void playTogether(Animator… items)及重载形式	同时执行动画
void setTarget(Object target)	设置应用的目标对象
void start()	启动动画集

public void runAnimSets(View view) {        ObjectAnimator animScaleX = ObjectAnimator.ofFloat(mImage, "scaleX",                2.0f, 0.5f);        ObjectAnimator animScaleY = ObjectAnimator.ofFloat(mImage, "scaleY",                2.0f, 0.5f);        ObjectAnimator animAlpha=ObjectAnimator.ofFloat(mImage,"alpha",1.0f,0.0f);        AnimatorSet animSet = new AnimatorSet();        animSet.setDuration(4000);        animSet.setInterpolator(new LinearInterpolator());        //三个动画同时执行        animSet.playTogether(animScaleX, animScaleY,animAlpha);        animSet.start();    }

动画开始时先扩大两倍然后再缩小同时透明度减小为0

六、xml文件创建属性动画

1、首先在res下建立animator文件夹，然后建立对应的xml文件，根节点为set嵌套objectAnimator（其中orderring属性值：同时执行together,依次执行sequentially）或者直接为objectAnimator。

<?xml version="1.0" encoding="utf-8"?><objectAnimator xmlns:android="http://schemas.android.com/apk/res/android" android:duration="2000" android:propertyName="scaleX" android:valueFrom="1.0" android:valueTo="0.5" android:valueType="floatType" ></objectAnimator>

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

2、然后使用AnimatorInflater加载动画的资源文件

// 加载动画  Animator anim = AnimatorInflater.loadAnimator(this, R.animator.animator_scalealpha);

3、给目标View设置旋转、缩放、反转等的中心点或者轴，（默认中心缩放，和中间对称线为反转线），然后手动触发View重绘

mImage.setPivotX(0);mImage.setPivotY(0);//触发重绘mImage.invalidate();//mImage.postInvalidate();

4、给Animator设置target并start动画，Over。

anim.setTarget(mImage);anim.start();

完整的方法

public void runXmlAnimSet(View v){       Animator anim = AnimatorInflater.loadAnimator(this, R.animator.animator_scalealpha);       mImage.setPivotX(0);       mImage.setPivotY(0);       //显示的调用invalidate       mImage.invalidate();       mImage.postInvalidate();       anim.setTarget(mImage);       anim.start();   }

七、Property Animation与View Animation的区别

Property Animation它更改的是对象的实际属性，本质就是系统根据特定的算法不断地动态改变对象的实际属性从而形成一种动画效果，而在View Animation（Tween Animation）中，其改变的是View的绘制效果，真正的View的属性保持不变，比如说无论你在对话中如何缩放Button的大小，Button的有效点击区域还是没有应用动画时的区域，其位置与大小都不变。而在Property Animation中，改变的是对象的实际属性，如Button的缩放，Button的位置与大小属性值都改变了。而且Property Animation不止可以应用于View，还可以应用于任何对象。