アニメーションでAndroidに独創的な画面エフェクトを：Androidで動く携帯Javaアプリ作成入門（21）（2/2 ページ）

» 2010年12月22日 00時00分 公開
[ 緒方聡，株式会社イーフロー]
前のページへ 1|2 　　　　　　

Activityにアニメーションを適用するための設定

　XMLリソースが用意できたところで、そのほかのXMLの設定を行いましょう。画面パーツと異なり、Activityには直接アニメーションを設定できないため、回りくどいですがスタイルやテーマを定義しなければなりません。

　また、設定は静的であるため、親画面がたくさんの子画面を持ち、子画面ごとにアニメーション効果を変えたい、ということは行えません。

スタイル定義XMLの作成

　まず、「res/values」にスタイル定義XMLを作成します。名前は何でも構わないのですが、「styles.xml」が慣習になっているので、ここでもその慣習に従います。

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <style name="Alpha.Effect"【1】
         parent="android:Animation.Activity"> 【2】
    <item name="android:activityOpenEnterAnimation"> 【3】
      @anim/alpha_open_enter</item> 【4】
    <item name="android:activityOpenExitAnimation"> 【3】
      @anim/alpha_open_exit</item> 【4】
    <item name="android:activityCloseEnterAnimation"> 【3】
      @anim/alpha_close_enter</item> 【4】
    <item name="android:activityCloseExitAnimation"> 【3】
      @anim/alpha_close_exit</item> 【4】
  </style>
</resources>
res/values/styles.xml

　【1】では、スタイル名を指定します。この名前は後で使用するので、分かりやすい名前を付けましょう。【2】では、親スタイルを指定します。Activityのアニメーションの場合、android:Animation.Activityを指定します。【3】では、「表1 アニメーション定義名と説明」で説明した定義名、【4】では、その定義に使用する先に用意したアニメーション定義XMLを指定します。

テーマ定義XMLの作成

　次に、テーマ定義XMLを「res/values」に作成します。この定義XMLも「themes.xml」という名称で作るのが慣習になっているので、そのようにします。

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <style name="AlphaEffect" 【1】
      parent="android:Theme"> 【2】
    <item name="android:windowAnimationStyle"> 【3】
      @style/Alpha.Effect</item> 【4】
  </style>
</resources>
res/values/themes.xml

　【1】でテーマ名を設定します。この名前も後で使用するので、分かりやすい名前を付けましょう。【2】で親スタイルを設定します。ここでは、android:Themeを指定します。【3】でアイテム名にandroid:windowAnimationStyleを指定し【4】でstyles.xmlで定義した名前を指定します。

AndroidManifest.xmlの設定

　ここまで準備ができたら、「AndroidManifest.xml」でActivityにテーマを設定します。

<activity android:name="AlphaAnimationExample"
  android:theme="@style/AlphaEffect" /> 【1】
<activity android:name="AlphaAnimationExample2"
  android:theme="@style/AlphaEffect" /> 【1】
AndroidManifest.xml（抜粋）

　【1】で「themes.xml」で定義したテーマを呼び出し元と呼び出し先のActivityに設定します。

Activity開閉時にアニメーション効果が働きましたか？

　ここまでうまく設定できていれば、設定したActivityが開くとき、閉じるときに、アニメーション効果が働きます。途中で1個所でも間違っていると、コンパイルはできてもアニメーション効果が働きません。その場合は、どこが間違っているか丁寧に見直してください。

ダイアログもアニメーションしてみよう

　ここまで、Activity同士の画面遷移を見てきましたが、ダイアログを開くとき、閉じるときにもアニメーションを設定できます。

アニメーションリソースXML

　アニメーションリソースXMLの作り方は同じです。スタイルは、親スタイルの指定、アイテム名が異なります。

名前 説明
android:windowEnterAnimation ダイアログが開くときのアニメーション
android:windowExitAnimation ダイアログが閉じるときのアニメーション
表2　ダイアログのアニメーション定義名と説明

スタイル定義XML

　スタイル定義の設定例は以下のとおりです。

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <style name="Dialog.Effect" 【1】
      parent="android:Animation.Dialog"> 【2】
    <item name="android:windowEnterAnimation"> 【3】
      @anim/translate_open_enter</item> 【4】
    <item name="android:windowExitAnimation"> 【3】
      @anim/translate_open_exit</item> 【4】
  </style>
</resources>
res/values/styles.xml

　【1】では、スタイル名を指定します。やはり後で使用するので、分かりやすい名前を付けましょう。【2】では、親スタイルを指定します。ダイアログの場合はandroid:Animation.Dialogです。【3】では、定義名を、【4】では、定義名に対応するアニメーションXMLを指定します。

　Activityの設定と異なるのは【2】【3】です。

テーマ定義XML

　themes.xmlは以下のようになります。

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <style name="DialogEffect" 【1】
      parent="android:style/Theme.Dialog"> 【2】
    <item name="android:windowAnimationStyle"> 【3】
      @style/Dialog.Effect</item> 【4】
  </style>
</resources>
res/values/themes.xml

　【1】でテーマ名を設定します。この名前は後でコーディング時に使用するので、やはり分かりやすい名前を付けましょう。【2】で親スタイルを設定します。ここでは「android:style/Theme.Dialog」を指定します。【3】でアイテム名に「android:windowAnimationStyle」を指定し【4】で「styles.xml」で定義した名前を指定します。

　Activityと異なるのは【2】だけですね。

ソースコード部分

　残るはダイアログ生成を行うソースコード部分です。

Dialog dialog = new Dialog(this, R.style.DialogEffect);
……【省略】……
dialog.show();
ソースコード（抜粋）

　ダイアログを生成する際の第2引数に、「themes.xml」で定義した名前を指定します。このようにすることで、このダイアログが開くときと閉じるときに、指定したアニメーション効果が得られます。

画面エフェクトを生かすための3カ条

　今回は画面遷移時の画面エフェクトとしてアニメーション効果を持たせる解説でした。

　冒頭にも書きましたが、ほかのアプリとの差別化のためにアニメーション効果を持たせるのは良い案ではありますが、「やり過ぎると浮いてしまう」ということも肝に銘じておいてください。

　筆者の考えでは、画面エフェクトは基本的に冗長なものですので、以下のような用途や工夫が必要だと思います。

  1. UI操作に合わせたアニメーション演出（指で左右にスライドすることで左右にアニメーションして画面遷移させるなど）
  2. 1枚目の画像を読み込む間、データベースを検索するわずかな待ち時間などを演出効果で和ませる
  3. 奇抜なものではなく、何度見ても飽きないアニメーション効果

「次回」へ


「Androidで動く携帯Javaアプリ作成入門」バックナンバー
前のページへ 1|2 　　　　　　

Copyright © ITmedia, Inc. All Rights Reserved.

スポンサーからのお知らせPR

注目のテーマ

Microsoft ＆ Windows最前線2025
AI for エンジニアリング
ローコード／ノーコード セントラル by ＠IT - ITエンジニアがビジネスの中心で活躍する組織へ
Cloud Native Central by ＠IT - スケーラブルな能力を組織に
システム開発ノウハウ 【発注ナビ】PR
あなたにおすすめの記事PR

@ITについて

RSSについて

アイティメディアIDについて

メールマガジン登録

＠ITのメールマガジンは、 もちろん、すべて無料です。ぜひメールマガジンをご購読ください。