利用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 void 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]);
            }
        }
     }






發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章