連載

2010年12月22日

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

[ 緒方聡，株式会社イーフロー] PC用表示関連情報

LINE

Hatena

前のページへ | 　　　　　　

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カ条

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

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

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

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

「次回」へ

「Androidで動く携帯Javaアプリ作成入門」バックナンバー