方法 : ストーリーボードを使用して MediaElement を制御する
この例では、Storyboard 内の MediaTimeline を使用して、MediaElement を制御する方法を示します。
使用例
Storyboard 内の MediaTimeline を使用して MediaElement のタイミングを制御する場合、その機能は、アニメーションなど他の Timeline オブジェクトの機能と同じです。 たとえば、MediaTimeline は、Timeline プロパティを BeginTime プロパティのように使用して、MediaElement を開始する (メディアの再生を開始する) 時刻を指定します。 また、Duration プロパティを使用して、MediaElement をアクティブにする時間 (メディアの再生時間) を指定します。 Storyboard で Timeline オブジェクトを使用する方法の詳細については、「ストーリーボードの概要」を参照してください。
この例では、MediaTimeline を使用して再生を制御する単純なメディア プレーヤーを作成する方法を示します。 このメディア プレーヤーには、再生、一時停止、再開、停止ボタンがあります。 また、進行状況バーとして機能する Slider コントロールもあります。
メディア プレーヤーのuser interface (UI) を作成する例を次に示します。
<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
x:Class="SDKSample.MediaTimelineExample" >
<StackPanel Background="Black">
<MediaElement Name="myMediaElement" MediaOpened="Element_MediaOpened"
Width="260" Height="150" Stretch="Fill" />
<!-- Button controls for play, pause, resume, and stop. -->
<StackPanel HorizontalAlignment="Center" Width="260" Orientation="Horizontal">
<Image Name="PlayButton" Source="images\UI_play.gif" Margin="30,10,10,10" />
<Image Name="PauseButton" Source="images\UI_pause.gif" Margin="10" />
<Image Name="ResumeButton" Source="images\UI_resume.gif" Margin="10" />
<Image Name="StopButton" Source="images\UI_stop.gif" Margin="10" />
</StackPanel>
<!-- Ths slider shows the progress of the media. -->
<Slider Name="timelineSlider" Margin="5" Width="250" HorizontalAlignment="Center"/>
<StackPanel.Triggers>
<EventTrigger RoutedEvent="Image.MouseDown" SourceName="PlayButton">
<EventTrigger.Actions>
<BeginStoryboard Name= "myBegin">
<Storyboard SlipBehavior="Slip">
<!-- The MediaTimeline controls the timing of the video and acts like other Timeline objects.
For example, although the video clip (numbers.wmv) lasts longer, playback ends after six
seconds because that is the duration of the MediaTimeline (Duration="0:0:6"). -->
<MediaTimeline Source="media\numbers.wmv" Storyboard.TargetName="myMediaElement"
BeginTime="0:0:0" Duration="0:0:6" CurrentTimeInvalidated="MediaTimeChanged" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
<!-- These triggers impliment the functionality of the Pause, Resume
and Stop buttons.-->
<EventTrigger RoutedEvent="Image.MouseDown" SourceName="PauseButton">
<EventTrigger.Actions>
<PauseStoryboard BeginStoryboardName="myBegin" />
</EventTrigger.Actions>
</EventTrigger>
<EventTrigger RoutedEvent="Image.MouseDown" SourceName="ResumeButton">
<EventTrigger.Actions>
<ResumeStoryboard BeginStoryboardName="myBegin" />
</EventTrigger.Actions>
</EventTrigger>
<EventTrigger RoutedEvent="Image.MouseDown" SourceName="StopButton">
<EventTrigger.Actions>
<StopStoryboard BeginStoryboardName="myBegin" />
</EventTrigger.Actions>
</EventTrigger>
</StackPanel.Triggers>
</StackPanel>
</Page>
進行状況バーの機能を作成する例を次に示します。
Imports System
Imports System.Windows
Imports System.Windows.Controls
Imports System.Windows.Media
Namespace SDKSample
Partial Class MediaTimelineExample
Inherits Page
' When the media opens, initialize the "Seek To" slider maximum value
' to the total number of miliseconds in the length of the media clip.
Private Sub Element_MediaOpened(ByVal sender As Object, ByVal e As RoutedEventArgs)
timelineSlider.Maximum = myMediaElement.NaturalDuration.TimeSpan.TotalMilliseconds
End Sub 'Element_MediaOpened
Private Sub MediaTimeChanged(ByVal sender As Object, ByVal e As EventArgs)
timelineSlider.Value = myMediaElement.Position.TotalMilliseconds
End Sub 'MediaTimeChanged
End Class 'MediaTimelineExample
End Namespace 'SDKSample
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
namespace SDKSample
{
public partial class MediaTimelineExample : Page
{
// When the media opens, initialize the "Seek To" slider maximum value
// to the total number of miliseconds in the length of the media clip.
private void Element_MediaOpened(object sender, EventArgs e)
{
timelineSlider.Maximum = myMediaElement.NaturalDuration.TimeSpan.TotalMilliseconds;
}
private void MediaTimeChanged(object sender, EventArgs e)
{
timelineSlider.Value = myMediaElement.Position.TotalMilliseconds;
}
}
}
参照
処理手順
方法 : MediaElement (再生、一時停止、停止、ボリューム、および速度) を制御する