連載
» 2010年12月22日 00時00分 公開

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

[ 緒方聡,株式会社イーフロー]
前のページへ 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.

RSSについて

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

メールマガジン登録

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