« 地デジ。著作権保護の罠にハマる(1) | トップページ | WPS、それは無線LANルーターの設定 »

Silverlight5アプリケーションの作り方(1)

Visual Studio 2010 SP1で新規Silverlightアプリケーションを作成しようとすると、 Photo

Silverlight


「最新のSilverlightが必要です。」のようなメッセージが表示される。そのダイアログにあるリンクをクリックするとSilverlight_Developer.exeがダウンロードできるのだが、それをインストールしても、新しいSilverlightアプリケーションの作成ウィザードでSilverlight5が選択できない(リストに現れない)。

5

↓これをダウンロードしてインストールする必要があるぞ!

Microsoft® Silverlight® 5 Tools for Visual Studio® 2010 SP1

Silverlight5toolsforvs2010

インストール完了後、Visual Studioを起動してSilverlightアプリケーション作成の手順をもう一度やると、

5_2

↑やっと「Silverlight 5」が選択肢に出てきた。

★"WCF RIAサービス"が何なのかはまた今度。。。

Photo_2
さて、[新しいSilverlightアプリケーション]のウィザードが終わったら、こんな画面が出たぞ。

Photo_3
ツールボックスを表示させて

Gui
デザインの画面にドラッグ&ドロップするわけですな。
こうして真っ白なキャンバス(Grid)にお絵描きします。

Photo_4
Gridをクリックして、プロパティ一覧でBackgroundの▼ボタンをクリックすると、Gridの背景色を変えられるぞ。他にもいろいろなプロパティがある。
同様に、貼り付けたボタンなどのプロパティも変えられる。

こうやってマウス操作とプロパティの入力でいとも簡単にGUIのデザインができてしまうのがVisualStudioのいいところ。そうしてデザインしたGUIレイアウトの情報はどこに保存されるかというと、デザインペインの下に表示されているXAMLペインに表示されているこの情報、これです。今、配置したボタンやテキストボックスのレイアウト、Gridの背景色なんかが自動的にXAMLに反映されていますね。XAMLは初心者にとってはHTMLのように見えますが、同じようなものだと理解していいでしょう。XAMLを直接書いても、マウスでデザインした時と全く同じGUIができます。

さぁ、Gridに配置したボタンをダブルクリックします。
Onclick
予想通り、クリックイベントのハンドラコードが表示されました。
ここに

textBox1.Text = "Hello!";

と入力します。

[デバッグ開始]ボタン押しま~す。
Photo_5

ブラウザが起動して…
Photo_6
おおお!Silverlightアプリケーションが動きました!

<今日のまとめ>
Silverlight特有の話がまだこれから出てくるわけですが、
とりあえずアプリケーションの新規作成、GUIデザイン、コーディング、デバッグ実行の方法は、簡単だということがわかりました。普通のexe形式のアプリケーション(Windows Formsアプリケーション)やWebアプリケーションと、全く同じ方法ですね。GUIのデザイン画面の初期画面の見た目がちょっと違うぐらいで。

(2)へつづく。。

|

« 地デジ。著作権保護の罠にハマる(1) | トップページ | WPS、それは無線LANルーターの設定 »

Silverlight」カテゴリの記事

コメント

コメントを書く



(ウェブ上には掲載しません)




トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/543635/55352834

この記事へのトラックバック一覧です: Silverlight5アプリケーションの作り方(1):

« 地デジ。著作権保護の罠にハマる(1) | トップページ | WPS、それは無線LANルーターの設定 »