お天気情報WebAPIを使ってGIF画像を表示する

今回は、Livedoorの提供している「お天気Webサービス」を使って、各地の天気予報を表示してみます。Livedoorの「お天気Webサービス」については下記のURLを参照してください。
→参照：お天気Webサービス（livedoor天気情報）

このWebサービスで返されるXMLデータのお天気画像には、GIFが使用されています。Windows PhoneではPNG、JPGの画像には対応していますが、GIFには対応していません。そこで、前回同様、ImageToolsというLibrayを使用してGIF画像を表示します。ImageToolsに関しては、「第3回 画像にFilterをかけてPicturesHUBに保存する」を参考にしてください。

まずは、このプログラムで実装する機能の動作を、下記に解説しておきます。このサンプルは、エミュレーターで動作しますが、実機（現時点ではauのIS12T）での動作確認を基本とします。

実機にプログラムをデプロイし、表示される「市」の入力欄に市を入力します。都道府県は入力しないでください。例えば、「愛媛県松山市」の場合は、単に「松山」とだけ入力します。「東京都」の場合は「東京」とだけ入力します。[実行]ボタンをタップすると、今日の天気の画像とテキストが表示されます。表示されている画像はGIF画像です。今日、明日、明後日の3日分の予報を見ることができます。[＞＞]で1日後の予報を見ていくことができます。[＜＜]で、前日の予報に戻ることができます。地域と日付も表示されます（図1）。

サンプル一式は、会員限定特典としてダウンロードできます。記事末尾をご確認ください。

実機（IS12T）で動かした動画はこちらです。

プロジェクトの作成

VS 2010のメニューから[ファイル(F)／新規作成(N)／プロジェクト(P)]と選択します。次に、「Windows Phone アプリケーション」を選択して、「名前(N)」に任意のプロジェクト名を指定します。ここでは「WP7_GifWeatherService」という名前を付けています。Windows Phoneのバージョンは7.1を選択します。

VS2010のメニューから[プロジェクト(P)／参照の追加(R)]と選択して、System.Xml.Linqを追加してください。また、ImageToolsを解凍したフォルダのbin\phoneフォルダ内にある、ImageTools.dll、ImageTools.IO.Gif.dllを追加しておいてください。これらのDLLはGIFを表示させるのに必要です。

MainPage.xamlの編集とコントロールの追加

x:NameがPageTitleというTextBlockのTextプロパティに「天気予報」と指定します。ツールボックスから、TextBlockコントロールを4個、TextBoxコントロールを1個、Buttonコントロールを3個、Imageコントロールを1個配置します（図2）。ImageコントロールのStretchプロパティにはUniformを指定します。

Stretch列挙体に付いては、下記のURLを参考にしてください。
→参照：Stretch 列挙体（msdn）

areaTextBlockのTextWrappingプロパティにはWrapを指定して文字の回り込みを可としておきます。また、最初の状態では、prevButtonとnextButtonのIsEnabledのチェックを外し、使用不可としておきます。お天気情報が表示された時点で、これらのボタンは使用可能になります。