連載一覧へ

.NETを知らない人でも分かるSilverlight入門（2）
SilverlightならWeb上で高精細な動画再生も簡単？

松原晋啓
2008/1/29

■ イベントハンドラの引数

　実際にイベントを使用する際は、先に紹介した<MediaElement>オブジェクトのサンプルのようにXAMLのタグオブジェクト上にイベントハンドラを定義し、（Silverlight 1.0では）JavaScript上にイベントハンドラの処理を記述することになります。

　イベントハンドラには、「引数」と呼ばれるパラメータが必ず定義されております。Silverlight 1.0において、一般的には表5のようなパラメータですが、キーボード入力イベントやマウス入力イベントは表6や表7のように複数の値を持つオブジェクトとなりますので、注意する必要があります。

表5　イベントハンドラ引数（キーボード入力、マウス入力以外）

引数 概要 sender イベントが発生したSilverlightオブジェクト。パラメータ値のToStringメソッドを使用したり、特定のオブジェクトのプロパティを確認することで、オブジェクトに関する情報を取り出せる eventArgs 特定のイベントのためのイベントデータの設定を特定。イベントデータはそれぞれのイベントの発生に関する情報を含む。OnErrorイベントはErrorEventArgsオブジェクトが格納され、MarkerReachedイベントはeventArgs.MarkerでイベントトリガのTimelineMarkerオブジェクトを得ることができるが、それ以外のイベントは常にnull

表6　キーボード入力のイベントハンドラ引数

引数 概要 sender イベントが発生したSilverlightオブジェクト keyEventArgs このパラメータには以下の値が含まれている keyEventArgs.Key：対象のキーを表すキーコードの整数値。この値はポータブルキーコードであり、OS特有ではない keyEventArgs.PlarformKeyCode：対象のキーを表すキーコードの整数値。この値は非ポータブルキーコードで、OS特有 keyEventArgs.Shift：Shiftキーが押されているかを判定するBoolean値 keyEventArgs.Ctrl：Ctrlキーが押されているかを判定するBoolean値

表7　マウス入力のイベントハンドラ引数

引数 概要 sender イベントが発生したSilverlightオブジェクト mouseEventArgs このパラメータには以下の値が含まれている mouseEventArgs.GetPosition(element).X：マウスのX座標位置 mouseEventArgs.GetPosition(element).Y：マウスのY座標位置 mouseEventArgs.Shift：Shiftキーが押されているかを判定するBoolean値 mouseEventArgs.Ctrl：Ctrlキーが押されているかを判定するBoolean値

エラーはどうやってハンドリングする？

　Silverlight 1.0のエラーハンドリングは、以下のように3つの方法があります。

1. OnErrorイベントハンドラの定義
2. JavaScriptのtry／catchブロックを使った同期エラーイベント
3. Silverlightの特有のイベントを使った非同期エラーイベント

　2つ目に関しては、JavaScript標準の機能ですので、ここでは割愛します。

　3つ目に関しては、ImageFailedイベントやMediaFailedイベントなどSilverlightの特有のイベントで定義されているエラーイベントにエラー処理を記述することを指します。このときのイベントの使用方法は通常のイベントと変わりありません。

　例えば、今回のアプリケーションにMediaFailedイベントを追加すると、以下のようになります。

Page.xamlの一部

<MediaElement x:Name="media" Width="640" Height="480"   Source="Silverlight.wmv" AutoPlay="false"   Volume="1" MediaFailed="MediaFailedHander"/>

Page.xaml.jsの一部

// メディア関連エラーハンドラ function MediaFailedHander(sender, eventArgs) {     // 表示するエラーメッセージ     var errorMsg = "\n Media Error Message \n" ;     // メディア情報の追加     errorMsg += "MediaElement Name: " + sender.Name + "\n";     errorMsg += "Media File Name: " + sender.Source + "\n";     // エラーメッセージの表示     alert(errorMsg); }

■ Silverlight 1.0はOnErrorイベントでエラー処理

　Silverlight 1.0では、特有のエラーイベントを処理したい場合でなければ、通常はOnErrorイベントを使用します。

　表5でも記載したとおり、OnErrorイベントのEventArgsパラメータには、ErrorEventArgsオブジェクトが格納されています。このErrorEventArgsオブジェクトには、ParserErrorEventArgsとRuntimeErrorEventArgsの2つのタイプがあり、それぞれで格納されているデータが異なります。それぞれのデータに関しては表8〜10にまとめました。

表8　ErrorEventArgsオブジェクトのプロパティ（onErrorイベントハンドラに共通するErrorEventArgsオブジェクトのプロパティ）

プロパティ 概要 errorMessage エラーイベントのメッセージ errorType エラーのタイプ。ErrorType列挙型の値として格納 errorCode エラーイベントのコード

表9　パーサーエラーを特定するParserErrorEventArgsオブジェクトのプロパティ

プロパティ 概要 charPosition エラーが発生した文字位置 lineNumber エラーが発生した行数 xamlFile エラーが発生したXAMLファイル xmlAttribute エラーが発生したXML属性 xmlElement エラーが発生したXML要素

表10　ランタイムエラーを特定するRuntimeErrorEventArgsオブジェクトのプロパティ

プロパティ 概要 charPosition エラーが発生した文字位置 lineNumber エラーが発生した行数 methodName エラーと関係するメソッド

　OnErrorイベントでこれらすべてのエラー情報をポップアップメッセージとして表示する場合は、以下のようなロジックになります。

Default_html.jsの一部

onError: function(sender, args) {     // 表示するエラーメッセージ     var errorMsg = "Silverlight Error: \n\n";     // すべてのエラーの共通情報     errorMsg += "Error Type: " + errorArgs.errorType + "\n";     errorMsg += "Error Message: " + errorArgs.errorMessage + "\n";     errorMsg += "Error Code: " + errorArgs.errorCode + "\n";     // 特定のエラー情報の追加     switch(errorArgs.errorType)     {     case "RuntimeError":         // RuntimeErrorEventArgsのプロパティを表示         if (errorArgs.lineNumber != 0)         {             errorMsg += "Line: " + errorArgs.lineNumber + "\n";             errorMsg += "Position: " + errorArgs.charPosition                 + "\n";         }         errorMsg += "MethodName: " + errorArgs.methodName + "\n";         break;     case "ParserError":         // ParserErrorEventArgsのプロパティを表示         errorMsg += "Xaml File: " + errorArgs.xamlFile + "\n";         errorMsg += "Xml Element: " + errorArgs.xmlElement + "\n";         errorMsg += "Xml Attribute: " + errorArgs.xmlAttribute             + "\n";         errorMsg += "Line: " + errorArgs.lineNumber + "\n";         errorMsg += "Position: " + errorArgs.charPosition + "\n";         break;     default:         break;     }     // エラーメッセージの表示     alert(errorMsg); }

　なお、このエラーハンドリング処理は特定のエラーハンドリングが必要なければ、このままで再利用できます。

次回からはグラフィックス描画に関する機能

　今回のグローアップ・アプリケーションは、まだ2D／3Dグラフィックスやアニメーション、ブラシなどの解説を行っておりませんので、メディアの再生・一時停止・停止とフルスクリーン表示が行えるだけで、後はエラーハンドリングを行うだけの簡単なアプリケーションとなりました。

　このグローアップ・アプリケーションは、毎回サンプルコードも提供していますので、「こちら」よりダウンロードして試してみてください。なお、サンプルコードに動画は含まれていませんので、別途ご用意してお試しください。このアプリケーションは最初にも説明したとおり、各回の解説した内容を追加していき、最終的に1つのアプリケーションを作成します。

■ Silverlightらしいユーザーエクスペリエンス／メディアエクスペリエンス

　今回はSilverlightでよく使われるメディアとイベントに関して解説しました。次回からは描画に関する機能の解説をしていきますので、グローアップ・アプリケーションも徐々にSilverlightらしいユーザーエクスペリエンス／メディアエクスペリエンスを持ったRIAになっていきます。次回以降もぜひご期待ください。

■ ＠IT関連記事

Silverlightは次世代のJavaScriptフレームワーク？ ついに正式リリース！ いまこそ知りたい!!　どの環境でも動くマイクロソフトのRIA技術Silverlightについて、実際に動く2つのサンプルを見ながら、その特徴と技術を解説 「リッチクライアント ＆ 帳票」フ ォーラム 2007/9/7

Silverlightと株価ビジュアライゼーション 連載：Flash観測所（2）　マイクロソフト発の新動画再生技術のSilverlightと、複雑な株価データを効果的に見せるFlashアプリサービスを紹介する 「リッチクライアント ＆ 帳票」フ ォーラム 2007/5/9

北米で話題のFlash動画アプリケーションサービス 連載：Flash観測所（1）　北米で話題のFlashによる動画サイト。UGC的ビデオ共有サイトの動画に付加価値を加えたり、ユーザーが編集できる話題のサービスを紹介する 「リッチクライアント ＆ 帳票」フ ォーラム 2007/4/5

プロフィール

松原 晋啓（まつばら のぶあき） SE、コンサルタント、エバンジェリストを経て、現在はソリューションスペシャリストとして活動。その傍ら、イベントや記事寄稿を通じてマイクロソフトのテクノロジーや製品の普及に努めている。 趣味は小学校から続けているバスケットボールで、4年前にチームを作り、現在もリーダーとして活動を行っている

1-2-3

INDEX
.NETを知らない人でも分かるSilverlight入門（2） SilverlightならWeb上で高精細な動画再生も簡単？
	Page1 GyaOも採用、高精細動画の再生機能を体験せよ 手軽に動画配信？−MediaElementオブジェクト
	Page2 サポートするフォーマット、サポートしないフォーマット Silverlight 1.0のイベント処理はどうなっているのか？
	Page3 エラーはどうやってハンドリングする？ 次回からはグラフィックス描画に関する機能

リッチクライアント＆帳票 全記事一覧へ

＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）