Silverlight プロジェクト内のメディアの再生を制御します。

メディア ファイル (オーディオまたはビデオ) を Microsoft Silverlight 1.0 プロジェクトに追加してアートボードに挿入すると、ファイルは MediaElement オブジェクトに追加され、自動再生が設定されます。この点は、ストーリーボードでタイムラインが作成される Windows Presentation Foundation プロジェクトにオーディオまたはビデオ ファイルを挿入する場合とは異なります。Microsoft Silverlight 1.0 プロジェクトでは、アニメーション ストーリーボードを制御する場合と同じ方法でビデオまたはオーディオ ファイルの再生を制御することはできません。

メモ :
Microsoft Expression Encoder 2 を使用すると、多数の Silverlight 1.0 テンプレートのいずれかを基にしてメディア プレーヤーを作成し、スキンとして保存できます。メディア プレーヤーには再生や一時停止などのコントロール ボタンが既に作成されています。Expression Encoder 2 に付属している Silverlight 1.0 テンプレートのコピーを変更したり、エンコードしたプロジェクトを Expression Blend 2 で開き、ビジュアルな要素および機能を追加したりできます。

Expression Blend 2 で Silverlight 1.0 プロジェクトのメディア ファイルの再生を制御するには、次の手順に従います。Silverlight 1.0 プロジェクトのメディアの制御については、Silverlight のクイック スタートについての Web サイト (英語の可能性あり) を参照してください。

Silverlight 1.0 プロジェクトでメディア ファイルの再生を制御するには

1. メディア ファイルをプロジェクトに追加します。追加方法は、「Silverlight 1.0 プロジェクトへのメディア ファイルの追加」の手順に従います。

2. メディア オブジェクトの名前を変更し、コードビハインド ファイルから参照するようにします。たとえば、[オブジェクトとタイムライン] でメディア オブジェクトを右クリックし、[名前変更] を選択して、「MyVideo」と入力します。

3. ユーザーがオブジェクトをクリックするとメディア ファイルが停止または開始するようなデザインにする場合は、それらのオブジェクトをアートボードに追加して、名前を変更します。たとえば、アートボードに楕円を追加して、名前を Pause に変更します。詳細については、「Silverlight プロジェクト内の XAML ドキュメントへの要素の追加」および「オブジェクト名の変更」を参照してください。

4. [プロジェクト] パネルの [ファイル] で、XAML ドキュメントのコードビハインド ファイルをダブルクリックします。たとえば、Page.xaml という名前の XAML ドキュメントを編集する場合、Page.xaml.js ファイルをダブルクリックします。コードビハインド ファイルが Expression Blend 2 の内部の JavaScript エディタで開きます。

5. 次のようなイベント ハンドラをフックするコード行の例がコードビハインド ファイルに既に存在します。

   rootElement.addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.handleMouseDown));
   

   このコード行の下に次の行を追加します。

   this.control.content.findName("Pause").addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.handleClickPause));
   

   このコードを追加すると、Pause という名前のオブジェクトがクリックされたときに、イベント ハンドラ メソッド handleClickPause が MouseLeftButtonDown イベントに反応します。

6. コードビハインド ファイルには、handleMouseDown という名前のサンプル イベント ハンドラ メソッドが既に存在します。handleLoad メソッドの最後の中かっこ (}) の後にはコンマがありますが、handleMouseDown メソッドの最後の中かっこの後にはコンマがありません。これは、handleMouseDown が宣言されている最後のメソッドであるためです。新しいメソッドを追加するときは、最後のメソッド以外の各メソッドの最後の中かっこの後に必ずコンマを追加してください。

7. 次のイベント ハンドラ メソッドを、できれば handleMouseDown イベントの前に追加します。

   handleClickPause: function(sender, eventArgs) 
   {
       sender.findName("MyVideo").pause();
   },
   

   このメソッドは、ユーザーが Pause オブジェクトの内部でマウスの左ボタンをクリックしたときに反応し、メディアの再生を一時停止します。

8. F5 キーを押して Silverlight 1.0 アプリケーションをテストします。Pause オブジェクトをクリックして、メディアの再生が一時停止するかどうかを確認します。オプションで、[再生] ボタンと [停止] ボタンによって以上の手順を繰り返すこともできます。

関連項目

概念

Silverlight 1.0 プロジェクトへのメディア ファイルの追加