Android Animation Tutorial and Examples.
一般的に、アニメーションとは、画像やオブジェクトが操作されて動く画像として表示される動的媒体のことです。
それはWikipediaが信じられる場合です。一方、ウェブペディアでは、「アニメーションとは、一連の絵やフレームを表示することによって作られる、動きのシミュレーションである」と定義しています。
Science World British Columbia](https://www.scienceworld.ca/blog/what-is-animation)によると、アニメーションとは、絵を動かす技術ではなく、動きを描く技術なのだそうです。
Androidには、様々なViewオブジェクトをアニメーション化するためのAPIが豊富に用意されています。そのため、ユーザーのアクションに応じてユーザーインターフェースが変化する際には、レイアウトの遷移をアニメーション化するように努めなければなりません。アニメーションが重要なのは、ユーザーのアクションに対するフィードバックが得られるからです。これにより、ユーザーがUIに集中できるようになります。
2つのビュー階層間の変化を簡単にアニメーション化するには、Android Transitions Frameworkを使用します。このフレームワークは、実行時にビューのアニメーションを行います。このフレームワークは、ビューのプロパティ値を時間の経過とともに変化させることでアニメーションを行います。一般的な効果のためのアニメーションが組み込まれています。さらに、このフレームワークを使って、カスタムアニメーションやトランジションライフサイクルコールバックを作成することもできます。
アニメーションで視覚的な合図を出すことができます。これにより、アプリで何が起こっているのかをユーザーに知らせることができます。特に、新しいコンテンツが読み込まれたり、新しいアクションが利用できるようになったりして、ユーザーインターフェースの状態が変化したときに有効です。
Androidには、さまざまなアニメーションAPIが用意されています。
(a). ビットマップアニメーション
Androidは、描画可能なアニメーションAPIを提供しています。これらのAPIは、ほとんどの場合、描画可能なリソースを用いて静的に定義されます。しかし、実行時に定義することもできます。これらのアニメーションAPIは、ビットマップをアニメーションさせることができます。
詳しくはこちらをご覧ください。
(b). UIの可視性とモーション・アニメーション
多くの場合、レイアウト内のビューの可視性や位置を操作する必要があります。そのような場合、UIがどのように変化しているかをユーザーが理解できるように、微妙なアニメーションを含める必要があります。
例えば、以下のようなことができます。
1.移動
2.表示する。
そのためには、android.animationパッケージで提供されているプロパティアニメーションシステムを使うことができます。このパッケージは Android 3.0 (API level 11) 以降で利用可能です。
これらのAPIは、Viewオブジェクトのプロパティを一定期間に渡って更新することで動作します。したがって、プロパティが変更されると、ビューは継続的に再描画されます。
詳しいドキュメントはこちらをご覧ください。
(c). 物理ベースの動き
実世界の物理学を応用したアニメーションを作成することができます。これにより、自然なアニメーションを実現できます。例えば、ターゲットが変化しても勢いがあり、変化してもスムーズに移行することができます。
Androidサポートライブラリは、このようなアニメーションを作るためのAPIを提供しています。これらのAPIは、実際に物理法則を適用して、アニメーションの発生を制御します。
(d). レイアウトアニメーション
Transition Frameworkでは、フラグメントの現在のアクティビティ内でレイアウトを交換する際にアニメーションを作成することができます。ただし、これはAndroid 4.4(API Level 19)以上でのみ適用可能です。
これを行うには、開始と終了のレイアウトと、使用したいアニメーションのタイプを指定します。すると、システムが2つのレイアウト間のアニメーションを考え、実行します。これを使って、UI全体を入れ替えたり、一部のビューだけを移動/入れ替えたりすることができます。
(e). アクティビティのアニメーション
アクティビティの間を遷移するアニメーションを作成することもできます。これは、Android 5.0 (API level 21)以上にのみ適用されます。これも、上述のレイアウト変更をアニメーション化するのと同じ遷移フレームワークに基づいています。しかし、ここでは、別のアクティビティのレイアウト間でアニメーションを作成することができます。
新しいアクティビティを横からスライドさせたり、フェードインさせたりするような単純なアニメーションを適用することができます。また、各アクティビティで共有されているビューの間を遷移するアニメーションを作成することもできます。
startActivity()を呼び出しますが、ActivityOptions.makeSceneTransitionAnimation()で提供されるオプションのバンドルを渡します。このオプションの束には、どのビューをアクティビティ間で共有するかが含まれており、アニメーション中にトランジションフレームワークがそれらを接続できるようになっています。
ObjectAnimator
Android ObjectAnimator Tutorial and Examples.
ObjectAnimatorは、対象となるオブジェクトにプロパティを設定できるクラスです。このクラスは、android.animation.ValueAnimatorから派生しています。
この ValueAnimator は、アニメーションの値を計算してターゲットオブジェクトに設定するアニメーションを実行するための、シンプルなタイミングエンジンを提供する役割を担っています。
ObjectAnimator`のコンストラクタでは，アニメーションさせる必要のあるターゲットオブジェクトを渡します．また、アニメーションさせるプロパティの名前も渡します。
ObjectAnimator APIの定義
ObjectAnimator は ValueAnimator クラスから派生したものである。どちらも android.animation パッケージに含まれています。
public final class ObjectAnimator
extends ValueAnimatorこれがその継承先です。
java.lang.Object
↳ android.animation.Animator
↳ android.animation.ValueAnimator
↳ android.animation.ObjectAnimatorアニメーションの設定
アニメーションの設定は、コードと静的なxmlリソースの両方で行うことができます。ここでは、xmlを使って設定する例を紹介します。
<objectAnimator
android_duration="1000"
android_valueTo="200"
android_valueType="floatType"
android_propertyName="y"
android_repeatCount="1"
android_repeatMode="reverse"/>コードでの設定方法については、以下の例に進んでください。
ObjectAnimatorの簡単な例
1. ObjectAnimatorによるビューのフェードイン、フェードアウトの方法
今回の目的は、フェードインとフェードアウトを行うメソッドを作ることです。
まず、AnimationListenerというインターフェイスを作ってみましょう。
public interface AnimationListener {
/**
* We need to make our View visible
* before fade in animation starts
*/
interface OnAnimationStartListener{
void onAnimationStart();
}
/**
* We need to make View invisible
* after fade out animation ends.
*/
interface OnAnimationEndListener{
void onAnimationEnd();
}
}これは2つのメソッドのシグネチャを持つインターフェイスであることがわかります。これは、onAnimationStart()とonAnimationEnd()という2つのメソッドを持つインターフェイスです。
そして、ビューをフェードインさせるメソッドがこちら。
/**
* View will appear on screen with
* fade in animation. Notifies onAnimationStartListener
* when fade in animation is about to start.
*
* @param view
* @param duration
* @param onAnimationStartListener
*/
public static void animateFadeIn(View view, long duration, final AnimationListener.OnAnimationStartListener onAnimationStartListener) {
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(view, "alpha", 0f, 1f);
objectAnimator.setDuration(duration);
objectAnimator.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {
if (onAnimationStartListener != null)
onAnimationStartListener.onAnimationStart();
}
@Override
public void onAnimationEnd(Animator animation) {
}
@Override
public void onAnimationCancel(Animator animation) {
}
@Override
public void onAnimationRepeat(Animator animation) {
}
});
objectAnimator.start();
}静的なofFloat()メソッドを呼び出してObjectAnimatorを初期化しました。
そして、パラメータとしてメソッドから受け取った長さである継続時間を設定します。durationの設定には、setDuration()メソッドを使用しました。
ここでは、カスタムの AnimationListener.onAnimationStart() メソッドを android.animation.Animator クラスの onAnimationStart() メソッドの中で呼び出しています。
では、フェードアウトはどうでしょうか？
ここでは、ObjectAnimatorクラスを使います。違いは、今回はカスタムのAnimationListenerインターフェイスからonAnimationEnd()を呼び出し、android.animationパッケージのAnimator.OnAnimationEnd()`の中で実行していることです。
/**
* View will disappear from screen with
* fade out animation. Notifies onAnimationEndListener
* when fade out animation is ended.
*
* @param view
* @param duration
* @param onAnimationEndListener
*/
public static void animateFadeOut(View view, long duration, final AnimationListener.OnAnimationEndListener onAnimationEndListener) {
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(view, "alpha", 1, 0);
objectAnimator.setDuration(duration);
objectAnimator.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {
}
@Override
public void onAnimationEnd(Animator animation) {
if (onAnimationEndListener != null)
onAnimationEndListener.onAnimationEnd();
}
@Override
public void onAnimationCancel(Animator animation) {
}
@Override
public void onAnimationRepeat(Animator animation) {
}
});
objectAnimator.start();
}