VS 2008でSilverlight アプリケーションを新規作成

Diggアプリケーションは、まず、Visual Studio 2008のメニューで、ファイル->新規プロジェクトを選択して、新規プロジェクトダイアログを使用して"Silverlightアプリケーション"を作成します。（注：ベータ1が出荷されてサポートされるようになった時にSilverlight Tools for VS 2008リリースをダウンロードしてインストールする必要があります。） :

プロジェクトの名前を"DiggSample"にします。”OK” ボタンをクリックするとVisual Studioはさらにダイアログを出すので、単なるSilverlightアプリケーションプロジェクトを作成するのか、そのSilverlightアプリケーションをホストするサーバ側のASP.NET Webプロジェクトを追加するのかを選択することができます。 :

今回のサンプルでは、ASP.NET Webアプリケーションプロジェクトをソリューションに追加することにし、"DiggSample_WebServer"と名前をつけます。"OK"をクリックすると、Visual Studioは、SilverlightのクライアントアプリケーションとASP.NET Webサーバアプリケーションの両方が含まれたソリューションを作成します。 :

"ビルド"を行った時、Visual Studioは自動的にコンパイルされたSilverlightアプリケーションをWebサーバプロジェクトにコピーします（手動による手順および構成は必要ありません。）。VSが作成したデフォルトのWebサーバプロジェクトにはASP.NETページと静的なHTMLページが両方含まれており、Silverlightアプリケーションをそこで起動・テストするのに使用することができます。

注：SilverlightアプリケーションはどんなWebサーバ（Linux上のApacheなど）とでもご利用頂け、静的なHTMLファイルやその他のサーバ側で生成されたページ（PHP、Java、Python、Rubyなど）でホストすることができます。このDiggサンプルではサーバ側のコードは書きません。その代り、Silverlightのクロスドメインネットワーク機能を使用してDiggサービスAPIに直接アクセスします。ASP.NETのWebサーバプロジェクトの作成を選択した理由は、主にテスト用として、自動でデプロイメントを行って、ビルドインのWebサーバを使用するためです。

Silverlight アプリケーション内部の理解

デフォルトで、新規作成されたSilverlightアプリケーションプロジェクトにはPage.xamlおよびApp.xaml、そしてそれらに関連したコードビハインドクラス（VB、C#、Ruby、Pythonなどで書くことが可能です。）ファイルがあります。:

XAMLファイルはXMLのテキストファイルで、宣言的にSilverlightおよびWPFアプリケーションのUIを特定するのに使用することができます。XAMLはまたより広義に.NETオブジェクトを宣言的に表現するために使用することもできます。

App.xamlファイルは、通常アプリケーションで共有するブラシやスタイルオブジェクトなどのリソースを宣言するために使用されます。そのアプリケーションコードビハインドクラスは、Application_Startup、Application_Exit、Application_UnhandledExceptionなどのアプリケーションレベルのイベントを処理するために使用されます。

Page.xamlファイルは、デフォルトでは、アプリケーションがアクティブになった時にロードされる初回のUIコントロールです。その中で、ユーザインターフェイスを定義するためのUIコントロールを使用し、その後コードビハインドクラス内でそれらのイベントを処理します。（詳細は後ほど）

DiggSampleプロジェクトをビルドした時、Visual Studioはデフォルトでコードと.XAMLタグを標準の.NETアセンブリファイル内にコンパイルし、その後それと静的なリソース（画像や入れておきたい静的ファイルなど）をディスク上の"DiggSample.xap"ファイルにパッケージ化します。 :

".xap" ファイル（ザップと発音します。）はクライアントのダウンロードサイズを最小化するために標準の.zipの圧縮アルゴリズムを使用しています。"Hello World" .NET Silverlight アプリケーション（VB、C#を使用してビルド）は約４KBです。

注：もし使用しているものをアプリケーションの.xapファイル（4kbのベースサイズからアプリケーションのサイズを増加させます。）で再配布された場合、ベータ1のいくつかのコントロールはアセンブリに実装されます。Diggアプリケーションで使用される全てのコントロールはベータ2および最終版でコアSilverlightダウンロードのパッケージに含まれます。つまり、完成版のアプリケーションの合計ダウンロードサイズはおそらく6-8kbくらいにしかならないと思います。（なので、非常に小さくて早いです。）

Silverlight 2 アプリケーションをホストして起動させるには、.xapファイルを指定した<object>タグを通常のHTMLページ（JavaScriptは必要ありません。）に追加します。そうすると、Silverlightは自動的に.xapファイルをダウンロードし、インスタンス化し、ブラウザのHTMLページ内でホストします。これは、クロスブラウザ（Safari, FireFox, IE, など）およびクロスプラットフォーム（Windows, Mac, Linux）で動作します。

（Silverlightアプリケーションを指定した<object>タグ参照が含まれた）テストHTMLやASP.NETページはプロジェクトが作成された時に自動的に追加されます。つまり、F5を押してビルドすれば起動・テストすることができます。

コントロールの追加とイベントの処理の習得

現在Diggアプリケーションは何も行いませんので、起動すると空ページを表示します。

Page.xamlをプロジェクトで開いて、そこへいくつかのコンテンツを追加すれば変更することができます。 :

まずグリッドの背景を変更し、そこでボタンコントロールを宣言します。ボタンの "x:Name"属性に"MyButton"という値を設定します。そうすると、コードビハインドクラスでそれをプログラムで参照することができます。次に、Content、Width、Heightのプロパティを設定します。 :

アプリケーションを起動すると、以下のように、ボタンはページの中央に"Push Me"というテキストがついて表示されます。 :

ボタンに動作を追加するには、そこへ"Click"イベントハンドラを追加します。これはソースビューでイベント名を入力すればできます。 :

そうすると、コードビハインドクラスで使用するイベントハンドラに対してポップアップされます。 :

そこで使用する新しいイベントハンドラメソッド名を入力、もしくはデフォルトの名前つけを使用したイベントハンドラメソッド名に対してEnterキーをただ押下します。 :

VSはその後自動的にコードビハインドクラスでスタブイベントハンドラを作成します。このイベントハンドラを使用してボタンがクリックされた時にボタンのコンテンツが新しいメッセージで更新されるようにします。 :

上記の変更を行ったら、アプリケーションを再起動して、再度ボタンを押下すると、今度は"Pushed!"というメッセージに更新されています。 :

次の ステップ

アプリケーションが完成するまでにはまだやることが残っています。... :-)

次のステップはアプリケーションの全体のUIレイアウト構造を設定し、さらにコントロールを追加します。これは次のチュートリアルで行いましょう。 : レイアウト管理の使用