アニメーションを使用すると、アプリ内で何が起こっているのかを、視覚的な手掛かりを通じてユーザーにわかりやすく伝えることができます。アニメーションは、新しいコンテンツがロードされたときや、新しいアクションが利用可能になったときなど、UI の状態が変化したときに特に役立ちます。また、アニメーションによって、アプリの外観を洗練させて、質の高いデザインを実現することができます。
Android には、必要なアニメーションのタイプに応じてさまざまなアニメーション API が用意されています。このドキュメントでは、UI にモーションを追加するさまざまな方法の概要について説明します。
アニメーションを使用すべきケースの詳細については、モーションに関するマテリアル デザイン ガイドをご覧ください。
ビットマップをアニメーション化する
図 1. アニメーション化したドローアブル。
アイコンやイラストなどのビットマップ グラフィックをアニメーション化する場合は、ドローアブル アニメーション API を使用します。通常、これらのアニメーションはドローアブル リソースを使用して静的に定義しますが、実行時のアニメーション動作を定義することもできます。
たとえば、2 つのアクションが関連していることをユーザーに伝えるには、再生ボタンをアニメーション化し、タップすると一時停止ボタンに変わります。
詳細については、ドローアブル グラフィックをアニメーションにするをご覧ください。
UI の表示とモーションをアニメーション化する
図 2. ダイアログの表示 / 非表示を切り替える際に軽くアニメーション化することで、UI 変更の不快感を抑えることができます。
レイアウト内のビューの表示や位置を変更する必要がある場合は、軽くアニメーション化することで、UI がどのように変化するのかをユーザーが把握しやすくなります。
現在のレイアウト内でビューの移動、表示、非表示を行うには、Android 3.0（API レベル 11）以降で利用可能な android.animation パッケージに含まれているプロパティ アニメーション システムを使用します。これらの API は、View オブジェクトのプロパティを一定期間更新し、プロパティの変更に応じてビューを継続的に再描画します。たとえば、位置プロパティを変更すると、ビューが画面上を移動します。アルファ プロパティを変更すると、ビューのフェードインやフェードアウトを実現できます。
このようなアニメーションを最も簡単に作成するには、レイアウトでアニメーションを有効にして、ビューの表示を変更したときにアニメーションが自動的に適用されるようにします。詳細については、レイアウトの更新を自動でアニメーションにするをご覧ください。
プロパティ アニメーション システムを使用してアニメーションを作成する方法については、プロパティ アニメーションの概要をご覧ください。一般的なアニメーションの作成方法については、以下のページもご覧ください。
物理学ベースのモーション
図 3. ObjectAnimator を使用して作成したアニメーション。
図 4. 物理学ベース API を使用して作成したアニメーション。
可能な限り、アニメーションには現実世界の物理学を適用して、自然に見えるようにすることをおすすめします。たとえば、ターゲットが変化しても勢いを維持し、変更中にスムーズに遷移する必要があります。
このような動作を実現するため、Android サポート ライブラリには、物理学の法則に基づいてアニメーションの表示を制御する物理学ベース アニメーション API が用意されています。
最も頻繁に利用される物理学ベース アニメーションとしては、次の 2 つがあります。
ObjectAnimator API を使用して作成したアニメーションなど、物理学に基づいていないアニメーションは、極めて静的であり、持続時間が固定されています。ターゲット値が変更された場合は、ターゲット値の変更時にアニメーションをキャンセルし、新しい開始値として新しい値でアニメーションを再構成し、新しいターゲット値を追加する必要があります。視覚的には、このプロセスにより、図 3 に示すように、アニメーションが突然停止し、その後につながりに欠けた動きが発生することになります。
DynamicAnimation など、物理学ベース アニメーション API を使用して作成したアニメーションは物理的な力に基づいて動きます。ターゲット値の変化は、力の変化になります。新しい力は既存の速度に適用され、新しいターゲットへの継続的な移行を実現します。このプロセスにより、図 4 に示すように、自然な動きのアニメーションになります。
レイアウトの変更をアニメーション化する
図 5. レイアウトの変更や新しいアクティビティの起動による詳細表示アニメーション
Android 4.4（API レベル 19）以降の場合、現在のアクティビティまたはフラグメント内でレイアウトを切り替える際に遷移フレームワークを使用することでアニメーションを作成できます。指定する必要があるのは、開始レイアウトと終了レイアウト、使用するアニメーションのタイプを指定することだけです。その後、システムが 2 つのレイアウト間のアニメーションを見つけて実行します。この機能を使用して、UI 全体を切り替えたり、一部のビューだけ移動や置換を行ったりすることができます。
たとえば、ユーザーがアイテムをタップして詳細情報を表示する場合、図 5 に示すような遷移を適用することで、レイアウトをアイテム詳細画面に置き換えることができます。
開始レイアウトと終了レイアウトはそれぞれ Scene に保存します。ただし、開始シーンは通常、現在のレイアウトから自動的に判断されます。Transition を作成して、使用するアニメーションのタイプを指定し、TransitionManager.go() を呼び出すと、レイアウトを切り替えるアニメーションが実行されます。
詳細については、遷移を使用してレイアウト変更をアニメーションにするをご覧ください。サンプルコードについては、BasicTransition をご覧ください。
アクティビティ間の切り替えをアニメーション化する
Android 5.0（API レベル 21）以降の場合、アクティビティ間を遷移するアニメーションを作成することもできます。これは、前のセクションで説明した同じ遷移フレームワークをベースとしていますが、個別のアクティビティ内のレイアウト間でアニメーションを作成できます。
新しいアクティビティを横からスライドインしたり、フェードインしたりするなどのシンプルなアニメーションを適用できるだけでなく、各アクティビティの共有ビュー間を遷移するアニメーションを作成することもできます。たとえば、ユーザーがアイテムをタップして詳細情報を表示する場合、図 5 に示すアニメーションのように、タップしたアイテムが画面いっぱいにシームレスに拡大するアニメーションによって、新しいアクティビティに遷移することができます。
通常どおり、startActivity() を呼び出しますが、ActivityOptions.makeSceneTransitionAnimation() で利用できるオプション バンドルを渡します。このオプション バンドルを使用して、アクティビティ間で共有するビューを指定することで、遷移フレームワークがアニメーション中にアクティビティを接続できるようになります。
その他のリソースについては、以下をご覧ください。