PR

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

2012年1月27日(金)
PROJECT KySS

今回は、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)。

図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)

図2:各コントロールを配置した(クリックで拡大)

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

Think IT会員限定特典
  • 「お天気情報WebAPIを使ってGIF画像を表示する」のサンプルプログラム

四国のSOHO。薬師寺国安(VBプログラマ)と、薬師寺聖(デザイナ、エンジニア)によるコラボレーション・ユニット。1997年6月、Dynamic HTMLとDirectAnimationの普及を目的として結成。共同開発やユニット名義での執筆活動を行う。XMLおよび.NETに関する著書や連載多数。最新刊は「Silverlight実践プログラミング」両名とも、Microsoft MVP for Development Platforms - Client App Dev (Oct 2003-Sep 2012)。http://www.PROJECTKySS.NET/

連載バックナンバー

Think IT会員サービス無料登録受付中

Think ITでは、より付加価値の高いコンテンツを会員サービスとして提供しています。会員登録を済ませてThink ITのWebサイトにログインすることでさまざまな限定特典を入手できるようになります。

Think IT会員サービスの概要とメリットをチェック

他にもこの記事が読まれています