最新の記事アプリケーションアクティビティ、インテント、サービスについてデバイスAndroidでのデバイス制御について。地磁気センサ、加速度センサなどマルチメディアグラフィックス、音楽や動画再生などマルチメディア処理についてユーザインターフェースAndroidのユーザインターフェイスについて、またユーザインターフェイスを提供するコンポーネントの話題について。リソースAndroidでのアイコン、画像、文字列、ローカライゼーションなどHacksマッシュアップ開発環境Androidの開発環境など。コメントはまだありませんアプリケーションのUIにアニメーションを追加すると、UIにリッチさやわかりやすさを与えることができます。本エントリから複数回にわたって、WindowsPhone7においてアニメーションを利用する方法を紹介していきます。今回は第一回ということで、アニメーションを利用する基本について紹介していきます。以下は今回紹介する内容のサンプルスクリーンショットの画像です。今回作成するサンプルは、ボタン押下を機に色と数値を変更するアニメーションを取り扱っています。下記画像の通り、青色部分が徐々に緑色に、画像サイズが徐々に細長くなっていきます。それではつづきをどうぞアニメーションの基本XAMLでアニメーションを指定する場合には、以下の3つの要素を作成する必要があります。・Storyboard・Animation・アニメーションするオブジェクトStoryboardアニメーションはStoryboardを使用し管理します。一まとめに管理することができます。StoryboardはResourcesタグの内部に書く必要があります。Animationアニメーションの詳細を作成する部分です。WP7には3つのAnimation用クラスが用意されています。描画位置を移動させるなどのアニメーションを行うことができます。Animationタグの中で、アニメーションを行うオブジェクトとプロパティを指定します。アニメーションするオブジェクトアニメーションを指定するオブジェクトを従来どおりに作成します。3つの構成要素をまとめると、以下のようなサンプルコードになります。&lt;/StackPanel&gt;ColorAnimationを作成するそれでは、実際にアニメーションを作成していきます。上記で紹介した、3つのアニメーション用クラスには、Storyboard.TargetName、Storyboard.TargetProperty、Durationを指定する必要があります。その他、From/By/Toといった主要プロパティがあります。プロパティの詳細は以下の表を参考にしてください。/]以下に紹介するサンプルは、StackPanelの背景を赤から緑にアニメーションするサンプルです。&lt;/StackPanel&gt;2行目の通りに、StoryboardはResource要素の中に書き込む必要があります。4,5,6行目でColorAnimationを作成しています。11行目のSolidColorBrushオブジェクトをアニメーションのターゲットとする為に、ColorAnimationのStoryboard.TargetNameプロパティにはSolidColorBrushのNameプロパティのstackpanel_backcolorを、ColorAnimationのStoryboard.TargetPropertyにはSolidColorBrushのColorプロパティを指定しています。Animationを実行するAnimationはXAMLに記述するのみでは動作しません。作成したStoryboardに対してStoryboardクラスのBeginメソッドを呼び出す必要があります。Beginメソッド以外にもStoryboardで作成したアニメーションをコントロールする為のメソッドが用意されています。/]以下のサンプルコードは、Button押下時にアニメーションを開始するソースコードです。}1行目のメソッドはStartボタンをタッチしたときに呼び出されるコールバックメソッドです。3行目でアニメーションを開始するメソッドBeginを呼び出しています。myAnimationBardは上部で紹介している、ColorAnimationを設定したStoryboardのNameプロパティ要素です。サンプル紹介サンプルアプリでは、ColorAnimationのほかにDoubleAnimationを利用して、Image画像を縮めるアニメーションを作成しています。DoubleAnimationもColorAnimationと同様に使用することができます。以下に使用例として、サンプルアプリ全体のXAMLコードを引用します。&lt;/Grid&gt;23行目~27行目にて、DoubleAnimationを使用しています。サンプルでは、TargetPropertyにHeight(高さ)を指定することで、どんどん小さくなっていくアニメーションを実現しています。一次関数としての直線的な変化しかもたせることができませんでした。次回は、より複雑なアニメーションの利用方法を紹介したいと思います。2.0(β)に対応した解説書です。TechBooster.TechBoosterについて。