ASP.NET AJAXの開発をさらにサポート「ASP.NET 3.5 SP1」

ASP.NET 3.5 Extensions + ASP.NET MVCフレームワーク（5）

メディアをホストするMediaPlayerコントロール

　Silverlightが.NET開発者以外から注目を集めているのはメディア配信の分野です。特にPlayReadyという新たなDRM（Digital Rights Management：デジタル著作権管理）は既存のFlashユーザーからも注目を集めています。Silverlightを利用する場合、本来は必要なXAMLやJavaScriptの知識がなくとも、プロパティ設定を行うだけでSilverlightを利用したメディアのホストが容易に行うことができるのがMediaPlayerコントロール最大のメリットです。

　ただし、JavaScriptを利用してプレーヤー操作時のイベントを操作できるのもMediaPlayerコントロールのメリットとも言えます。つまり、お手軽にメディアをホストできるが、同時にさまざまな設定も受け付けてくれるというのがMediaPlayerコントロールの魅力と言えます。

　実際にホストした画面はこちらになります（図10～12）。メディアをダブルクリックすることで最大化もできますが、これもMediaPlayerコントロール側で自動設定しているため、ユーザーが何か手を加える必要はありません。

図10 MediaPlayerコントロール動作画面

図11 最大化表示の画面

図12 チャプター表示画面

　MediaPlayerコントロールがサポートしているメディアファイルは次のとおりです。

• wmv
• wma
• nmp3

　詳細な情報はMSDNに記述されています。興味のある方は参照してください。

　続いて、MediaPlayerコントロールの内、多用するであろうプロパティを以下の表にまとめました。メディアファイルを扱うコントロールなので、必然的にそれに絡んだプロパティが多くなっています。

MediaPlayerコントロールのプロパティと概要

メンバ名	概要
AutoLoad	メディアファイルを自動的に読み込むかどうか取得/設定
AutoPlay	メディアファイルを開いたときに直ぐ再生するかどうか取得/設定
Chapters	メディアファイルのチャプタ一覧を取得。各チャプタはChaptersプロパティのコレクション内にMediaChapterオブジェクトとして、タイトル、開始時間、パスなどを設定
MaxFrameRate	1秒間の最大フレーム数を取得/設定
MediaDefinition	チャプタの位置、タイトル、サムネイルのパスなどのメディアソース関連のデータが格納されたXMLファイル（メディア定義ファイル）のパスを取得/設定
MediaSkinSource	MediaPlayerコントロールに使用されているスキンを定義する値を取得/設定
MediaSource	MediaPlayerのメディアファイルを取得/設定
Muted	既定でミュートにするかどうかを取得/設定
OnClientChapterSelected	チャプター選択時に呼び出されるJavaScriptの関数名を取得/設定
OnClientVolumeChanged	ボリューム変更時に呼び出されるJavaScriptの関数名を取得/設定
OnPluginLoaded	Silverlightが読み込まれている時に呼び出されるJavaScriptの関数名を取得/設定
PlaceholderSource	メディアファイル読み込み完了前に表示される.jpg、.jpeg、.pngなどの画像ファイルを取得/設定
SplashScreenSource	Silverlightコンテンツの読み込み中に表示されるスプラッシュスクリーンドキュメントのURLを取得/設定
Volume	ボリュームの初期値を0 ～ 1の範囲で取得/設定

　MediaPlayerコントロールはあくまで、メディアファイルをSilverlightとしてホストするコントロールです。つまり、Silverlight 2から利用可能なマネージコードで処理を記述するのではなく、JavaScriptファイルに処理を記述することになります。MediaPlayerコントロールには、JavaScriptファイル呼び出しのためのイベントハンドラが数多くあります。

　以下のサンプルでは、メディアファイルの設定と、各種メディアの取り扱いに関する設定のみを行っています。本稿のサンプルでは、メディアファイルはサイズの肥大化につながるので添付していません。サンプルを実行する際には自身で用意したうえで設定を行ってください。

<asp:ScriptManager ID="ScriptManager1" runat="server" >
    <Scripts>
        <asp:ScriptReference Path="~/Chapter.js"     />
    </Scripts>
</asp:ScriptManager>
<asp:MediaPlayer ID="MediaPlayer1" runat="server" Height="402px" Width="520px"
    PluginBackground="AntiqueWhite" OnClientChapterSelected="SelectedChapter"
    AutoLoad="true" AutoPlay="true"
    MediaSource="~/メディアファイル名">
    <Chapters>
        <asp:MediaChapter ThumbnailSource="~/チャプター画像" Position="8"     />
        <asp:MediaChapter ThumbnailSource="~/チャプター画像" Position="38"     />
        <asp:MediaChapter ThumbnailSource="~/チャプター画像" Position="98"     />
        <asp:MediaChapter ThumbnailSource="~/チャプター画像" Position="164"     />
    </Chapters>
</asp:MediaPlayer>

　プロパティ設定の部分なので、ご覧いただければ分かると思います。注目点はScriptManagerコントロールのScriptsコレクションにJavaScriptファイルの指定を行っている点です。OnClientChapterSelectedプロパティで設定されたSelectedChapter関数は、チャプター選択時にChapter.jsファイル内のSelectedChapter関数を呼び出して実行しています。

　肝心のSelectedChapter関数はアラートを呼び出しているだけです。

function SelectedChapter(sender, chapterEventArgs) {
    alert("選択したチャプターから再生を開始します。");
}

　以上の設定で、チャプターを選択した場合には、「選択したチャプターから再生を開始します。」というアラートが出た後、チャプター再生が行われるページの完成です。