利用WPF MediaElement去播放视频或者音乐

本文主要是在学习MediaElement的过程中的心得，比如怎么为自定义控件增加绑定属性，怎么为绑定的MediaElement增加Event的响应，PathGeometry的使用， 利用StoryBoard对MediaElement移动进行控制。

在xml中添加Style

<Style x:Key="MediaStyle" TargetType="MediaElement">
<Setter Property="LoadedBehavior" Value="Manual"></Setter>
<EventSetter Event="MouseDown" Handler="ME_MouseDown"></EventSetter>
<EventSetter Event="MediaEnded" Handler="ME_MediaEnded"></EventSetter>
</Style>

添加播放器的移动路径以及相关的story

<PathGeometry x:Key="PG">
<PathFigure StartPoint="-100,0">
<LineSegment Point="50,0"></LineSegment>
<ArcSegment Point="50,100" RotationAngle="91" IsLargeArc="False" SweepDirection="Clockwise" Size="50,50"></ArcSegment>
<BezierSegment Point1="6,109" Point2="50,170" Point3="60,190"></BezierSegment>
</PathFigure>
</PathGeometry>

<Storyboard x:Key="KeySB" AutoReverse="True" RepeatBehavior="Forever">
<DoubleAnimationUsingPath Storyboard.TargetName="TT" Storyboard.TargetProperty="X" Source="X" PathGeometry="{StaticResource PG}" Duration="0:0:15"></DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Storyboard.TargetName="TT" Storyboard.TargetProperty="Y" Source="Y" PathGeometry="{StaticResource PG}" Duration="0:0:15"></DoubleAnimationUsingPath>
</Storyboard>

添加MediaElement 控件

<MediaElement Width="100" Height="100" x:Name="ME" Style="{StaticResource MediaStyle}" Margin="-106,0,302,189" RenderTransformOrigin="0.5,0.5" MouseEnter="img_MouseEnter" MouseLeave="img_MouseLeave" Volume="0">
<MediaElement.RenderTransform>
<TransformGroup>
<TranslateTransform x:Name="TT" />
</TransformGroup>
</MediaElement.RenderTransform>
</MediaElement>

添加Trigger

<EventTrigger RoutedEvent="MediaElement.MediaOpened" SourceName="ME">
<BeginStoryboard Storyboard="{StaticResource KeySB}"></BeginStoryboard>
</EventTrigger>

在.cs文件中添加如下代码

public partial class VideoPlayer : UserControl
{
public static DependencyProperty VideoSourceDP = DependencyProperty.Register("VideoSource", typeof(ObservableCollection<string>), typeof(VideoPlayer),
new PropertyMetadata(new ObservableCollection<string>(), new PropertyChangedCallback(VideoSourceChanged)));
public ObservableCollection<string> VideoSource
{
get { return GetValue(VideoSourceDP) as ObservableCollection<string>; }
set { SetValue(VideoSourceDP, value); }
}
public int BeginIndex { get; set; }
public VideoPlayer()
{
InitializeComponent();
}
#region virtul function
public virtual vo
9d74
id VideoSourceChanged(DependencyPropertyChangedEventArgs e)
{
var newSourceFile = e.NewValue as ObservableCollection<string>;
if (newSourceFile == null) return;

var old = e.OldValue as ObservableCollection<string>;
if(old != null)
old.CollectionChanged -= Items_CollectionChanged;
var newvalue = e.NewValue as ObservableCollection<string>;
if (newvalue != null)
newvalue.CollectionChanged += Items_CollectionChanged;
if (newSourceFile.Count == 0)
{
//ME.Stop();
//ME.Source = null;
}
else
{
if (BeginIndex >= newSourceFile.Count)
BeginIndex = 0;
ME.Source = new Uri(newSourceFile[BeginIndex]);
ME.Play();
}
}

void Items_CollectionChanged(object sender, NotifyCollectionChangedEventArgs e)
{
if (ME.Source == null)
{
if(VideoSource.Count > 0)
{
BeginIndex = 0;
ME.Source = new Uri(VideoSource[BeginIndex]);
ME.Play();
}
}
else
{
if(VideoSource.Count == 0)
{
ME.Stop();
ME.Source = null;
}
}
}
#endregion
#region static dependency property
public static void VideoSourceChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var obj = d as VideoPlayer;
if (obj == null) return;
obj.VideoSourceChanged(e);
}
#endregion
#region event
bool bPause = false;
private void ME_MouseDown(object sender, MouseButtonEventArgs e)
{
if(sender == ME)
{
if (!bPause)
ME.Pause();
else
ME.Play();
bPause = !bPause;
}
}
#endregion

private void ME_MediaEnded(object sender, RoutedEventArgs e)
{
if(sender == ME)
{
BeginIndex++;
if (BeginIndex >= VideoSource.Count)
BeginIndex = 0;
ME.Source = new Uri(VideoSource[BeginIndex]);
}
}
}