このページの本文へ

クラウドに興味ありな開発者なら、3ステップで楽々Azureに移行 第3回

Windows AzureとSilverlight 4でアプリケーション開発に挑戦

2010年12月21日 16時00分更新

文● 飯島進仁/ふむふむソフト

  • この記事をはてなブックマークに追加
  • 本文印刷

いざ、Silverlightをコーディング
――といっても操作は簡単そのもの!

 さて、SilverlightのコードからWCFサービスにアクセスする準備が整ったので、今度はSilverlightから実際にこのメソッドにアクセスするコードを追加する。

 まず、SilverlightApplication1内の「MainPage.xaml」を開き、画面にボタンを追加する。画面左の「ツールボックス」を開き、「コモンSilverlight コントロール」から「Button」を選んでから、MainPage.xamlの画面上で範囲選択の要領でドラッグし、ボタンを配置する。

ツールボックスからボタンを追加したところ

ツールボックスからボタンを選択し、追加したところ。XAMLの知識があれば、テキストエディタで直接編集してもいい

 ボタンが配置されたら、今度はそのボタンをダブルクリックしよう。すると「MainPage.xaml.cs」という画面に切り替わり、「button1_Click」というメソッドが追加、表示される。

 このメソッドが、このボタンがクリックされた際に呼び出されるメソッド(イベントハンドラ)である。

 では、「このボタンを押されたら、Service1のメソッドを呼び出す」という処理を追加してみよう。

 MainPage.xaml.csを以下のように変更する。赤い部分が追加・編集した部分だ。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace SilverlightApplication1
{
    public partial class MainPage : UserControl
    {
        //WCFサービス用カスタムクラスのメンバ変数の宣言
        ServiceReference1.Service1Client svc;

        public MainPage()
        {
            InitializeComponent();

            //カスタムクラスの初期化
            svc = new ServiceReference1.Service1Client();
            //DoWork呼び出し完了時のイベントハンドラを指定
            svc.DoWorkCompleted += new EventHandler<ServiceReference1.DoWorkCompletedEventArgs>(svc_DoWorkCompleted);
        }

        /// <summary>
        /// DoWork()呼び出し完了時のイベントハンドラ
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        void svc_DoWorkCompleted(object sender, ServiceReference1.DoWorkCompletedEventArgs e)
        {
            MessageBox.Show(e.Result);
        }


        private void button1_Click(object sender, RoutedEventArgs e)
        {
            //Service1内のDoWorkを非同期に呼び出し
            svc.DoWorkAsync("実験用の文字列です");
        }
    }
}

 各処理についてはそれぞれのコメント行を参照していただきたいが、何よりも最初に理解してほしいのは、「サービス参照の追加」という作業によって、今回利用した「ServiceReference1.Service1Client」というカスタムクラスが自動的に定義され、以降は容易にWCFサービスを呼び出すことが可能になっている、ということだ。

 あの手順を踏むことにより、本来Web上に公開された別プログラムであるWCFサービスを、あたかもSilverlightのプログラムの一部のように取り扱えるわけである。

 では早速、デバッグしてみよう。デバッグ方法は簡単でF5キーを押すか、あるいはメニューの[デバッグ]から[開始]を選ぶだけだ。

 しばらく作業が行なわれた後で、おもむろにWebブラウザーが立ち上がり、「http://127.0.0.1:81」というURLのページが開き、(本記事ではまったく触れていないため)初めて見る画面が表示されるはずである()。

 これはWebロール作成時にVisual Web Developerが自動的に作るDefault.aspxの表示画面だ。今回の記事では関係のないページなので無視して、

http://127.0.0.1:81/SilverlightApplication1TestPage.aspx
(拡張子は「.html」でもいい)

と入力すれば、先ほどの「ボタンだけのSilverlight」が表示される。ここでボタンを押して、「実験用の文字列です (今日の日付)」というダイアログが表示されれば、実験は成功である。

 これでSilverlightとWCFサービスの通信が確立できた、というわけだ。

SilverlightとWCFサービスの通信が成功したところ

SilverlightとWCFサービスの通信が成功したところ

 少し難しい部分もあるが、今回のWCFサービスがまったく他のサーバーに存在していても同様のアプローチで実装可能だ。そう考えれば、WCFという技術が「サーバーとの通信」という手続きをうまくカプセル化できていることが理解できるだろう。

 Windows Azure Toolsをインストールして、Windows Azureアプリケーションのエミュレーターを使ったデバッグ方法もある。詳細はこちらのMSDN Blogs記事などを参照されたい。

便利なVisual Studioコードスニペット機能

 本サンプルコードのDoWorkCompletedのイベントハンドラを追加する操作を試していてお気づきになった方も多いと思うが、Visual Studioには自動で入力候補を表示する「インテリセンス(コード補完機能)」に加え、繰り返し使うような定型文のコードを自動的に挿入してくれる「コードスニペット」という機能がある。

 具体的には「+=」を入力した時点で、以下の画面のような表示が出るので、後はTabキーを連打するだけで必要最低限のコードは挿入できる、という仕組みだ。

イベントハンドラの追加時の動き

イベントハンドラの追加時の動き。Tabキーをするだけで、宣言部分からイベントハンドラ本体の追加まで自動で行ってくれる

 入力の手間はもちろん、「あれ? どういう綴りで書くんだっけ?」という時にもありがたいお助け機能だ。

 もちろん、イベントハンドラだけでなくさまざまな状況に対応しているので、ぜひ活用しよう!


 (次ページ、「Web上に公開されているサンプルコードを利用しよう!」に続く)

カテゴリートップへ

この連載の記事
  • 角川アスキー総合研究所
  • アスキーカード