連載
続・無償環境でSilverlight 2アプリを開発しよう!

第1回 動きのあるSilverlightアプリを作ろう

シグマコンサルティング 菅原 英治
2009/02/10
Page1 Page2 Page3 Page4

 皆さん、こんにちは。この連載では、「無償環境でSilverlight 2アプリを開発しよう!」と題し、無償の開発ツールであるVisual Web Developer 2008 Express Edition(以下、VWD 2008 )を利用した、Silverlight 2アプリケーション(以下、Silverlight 2アプリ)の開発方法をご紹介します。

 この連載は、以前公開した「Silverlight 2アプリを開発しよう!(前編後編)」の続編という位置付けです。従って、本稿の対象読者としては、「Silverlight 2アプリを開発しよう!」の特に後編の内容を理解し、またお使いのPCにVWD 2008の開発環境がインストールされている方という前提で解説します。

 連載の第1回目となる今回は、「動きのあるSilverlightアプリを作ろう」と題しました。このテーマの下、「ドラッグ&ドロップ」「アニメーション」「動画(Movie)」の3点をSilverlight 2アプリで扱う方法について、簡単なサンプル・コードを交えて解説します。

 今回ご紹介するような動きのあるアプリは、開発していても非常に楽しいものです。ぜひ皆さんも一緒にチャレンジしてみてください。開発言語は、Visual BasicとC#の両方を記載しています。

 それではさっそく始めましょう!

【コラム】オバマ大統領の就任式でSilverlightユーザーが一気に増えた!?

 去る2009年1月20日、オバマ大統領の就任式が行われました。この模様は、PIC(Presidential Inauguration Committee)の公式サイトにて、Silverlightによりストリーミング中継されました(詳しくは「Silverlightと2009年大統領就任式」を参照)。執筆時点で、マイクロソフトの公式な発表はまだありませんが、これによってSilverlightプラグインを導入するユーザーは、少なくとも米国では大幅に増えたのではないでしょうか。

 日本でも、話題性のあるイベント(例えば沢尻エリカさんの結婚式の様子など)をストリーミング中継することで、Silverlightユーザーを増やすことができるかもしれませんね。

ドラッグ&ドロップを実現しよう

 ここではまず、Silverlight 2アプリでのドラッグ&ドロップの実現方法について解説します。Silverlight 2アプリでは、イベント・ドリブン方式が採用されているため、ドラッグ&ドロップを簡単に実現できます。その実現方法は、特にWindowsアプリを開発した経験があれば、すぐに理解できます。

 一方、従来のASP.NETでのWebアプリでは、ドラッグ&ドロップを簡単には実現できません。これを実現したい場合、JavaScriptとダイナミックHTMLで作り込むなど、標準的ではない方法が必要となります。従って、今後リッチなユーザー・インターフェイス(以下UI)が求められるWebアプリを開発する場合には、Silverlight 2での開発を検討する価値は十分にあるでしょう。

 それでは、ある文字列をドラッグ&ドロップするサンプルを示し、その実装方法を解説します。

文字列をドラッグ&ドロップするサンプルを動かそう

 まずは、サンプルを実際に動かしてみましょう。下に表示されているのは、ドラッグ&ドロップを実装したサンプルのSilverlight 2アプリです(サンプルを動作させるためには、Silverlight 2プラグインのインストールが必要です)。

ドラッグ&ドロップを実装したSilverlight 2アプリ
実際に文字列「Hello」をドラッグしてみてほしい。

 サンプルには「Hello」という文字列が表示されています。この文字列は、次の図のように、マウスによるドラッグ&ドロップで位置を移動できます。ドラッグ中は文字列の色が半透明になります。

ドラッグ中の文字列
TextBlockコントロールの位置が移動し、また、ドラッグ中は半透明になる。

 上のサンプルで、うまくドラッグ&ドロップを試すことができたでしょうか。それでは、実際にこのサンプルを開発してみましょう。


 INDEX
  連載:続・無償環境でSilverlight 2アプリを開発しよう!
  第1回 動きのあるSilverlightアプリを作ろう
  1.文字列をドラッグ&ドロップするサンプルを動かそう
    2.ドラッグ&ドロップを開発しよう
    3.アニメーションを利用しよう
    4.動画を利用しよう

インデックス・ページヘ  「続・無償環境でSilverlight 2アプリを開発しよう!」


Insider.NET フォーラム 新着記事
  • 第2回 簡潔なコーディングのために (2017/7/26)
     ラムダ式で記述できるメンバの増加、throw式、out変数、タプルなど、C# 7には以前よりもコードを簡潔に記述できるような機能が導入されている
  • 第1回 Visual Studio Codeデバッグの基礎知識 (2017/7/21)
     Node.jsプログラムをデバッグしながら、Visual Studio Codeに統合されているデバッグ機能の基本の「キ」をマスターしよう
  • 第1回 明瞭なコーディングのために (2017/7/19)
     C# 7で追加された新機能の中から、「数値リテラル構文の改善」と「ローカル関数」を紹介する。これらは分かりやすいコードを記述するのに使える
  • Presentation Translator (2017/7/18)
     Presentation TranslatorはPowerPoint用のアドイン。プレゼンテーション時の字幕の付加や、多言語での質疑応答、スライドの翻訳を行える
@ITメールマガジン 新着情報やスタッフのコラムがメールで届きます(無料)
- PR -

注目のテーマ

業務アプリInsider 記事ランキング

本日 月間
ソリューションFLASH