c# - 以 MVVM 模式控制 MediaElement 及其来源

我有包含视频剪辑和 MediaElement 列表的 DataGrid，它应该播放在该 DataGrid 中选择的剪辑。我设法通过这样做来实现这一目标:

MainWindow.xaml

<DataGrid x:Name="dataGrid_Video"
...
SelectedItem="{Binding fosaModel.SelectedVideo}"
                  SelectionUnit="FullRow"
                  SelectionMode="Single">
...
<MediaElement x:Name="PlayerWindow" Grid.Column="1" HorizontalAlignment="Left" Height="236" Grid.Row="1" VerticalAlignment="Top" Width="431" Margin="202,0,0,0" Source="{Binding fosaModel.SelectedVideo.fPath}"/>

但后来我无法控制播放。所以我搜索了一下，我找到了这个解决方案，并实现了播放按钮:

MainWindow.xaml

...
<ContentControl Content="{Binding Player}" Grid.Column="1" HorizontalAlignment="Left" Height="236" Grid.Row="1" VerticalAlignment="Top" Width="431" Margin="202,0,0,0"/>
...
<Button x:Name="playButton" Content="Odtwórz" Grid.Column="1" HorizontalAlignment="Left" Margin="202,273,0,0" Grid.Row="1" VerticalAlignment="Top" Width="75" IsDefault="True" Command="{Binding PlayVideoCommand}"/>
...

MainViewModel.cs

    public class MainViewModel : ViewModelBase
    {
        public MainViewModel()
        {
          ...
            Player = new MediaElement()
            {
                LoadedBehavior = MediaState.Manual,
            };
            PlayVideoCommand = new RelayCommand(() => { _playVideoCommand(); });
    ...
        public MediaElement Player{ get; set; }
        private void _playVideoCommand()
        {
            Player.Source = new System.Uri(fosaModel.SelectedVideo.fPath);
            Player.Play();
        }

fosaModel.cs

public class fosaModel : INotifyPropertyChanged

{
    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }

    public ObservableCollection<fosaVideo> ListOfVideos { get; set; } = new ObservableCollection<fosaVideo>();
    public ObservableCollection<fosaAudio> ListOfAudios { get; set; } = new ObservableCollection<fosaAudio>();
    public fosaVideo SelectedVideo { get; set; }
}

所以现在当我按下播放按钮时会播放选定的视频。更改选择不会像之前那样更改 MediaElement 的来源。我想要的是控制视频的播放，而且还要在 DataGrid 中选择其他视频来更改 MediaElement 的源。有没有办法在不破坏 MVVM 模式的情况下这样做？
我是 WPF 的新手，我觉得我缺少一些基本的东西。我使用 MVVM Light 和 Fody.PropertyChanged。

编辑:

我采用了彼得摩尔的回答，播放/停止功能就像一个魅力。但现在我想控制视频播放的位置。我制作了另一个附加属性:

public class MediaElementAttached : DependencyObject
{
   ...
   #region VideoProgress Property

    public static DependencyProperty VideoProgressProperty =
        DependencyProperty.RegisterAttached(
            "VideoProgress", typeof(TimeSpan), typeof(MediaElementAttached),
            new PropertyMetadata(new TimeSpan(0,0,0), OnVideoProgressChanged));
    public static TimeSpan GetVideoProgress(DependencyObject d)
    {
        return (TimeSpan)d.GetValue(VideoProgressProperty);
    }
    public static void SetVideoProgress(DependencyObject d, TimeSpan value)
    {
        d.SetValue(VideoProgressProperty, value);
    }
    private static void OnVideoProgressChanged(
        DependencyObject obj,
        DependencyPropertyChangedEventArgs args)
    {
        MediaElement me = obj as MediaElement;
        me.LoadedBehavior = MediaState.Manual;
        if (me == null)
            return;
        TimeSpan videoProgress = (TimeSpan)args.NewValue;
        me.Position = videoProgress;
    }

    #endregion
}

MainWindow.xaml

<MediaElement
    ...
    local:MediaElementAttached.VideoProgress="{Binding fosaModel.videoProgress, Mode=TwoWay}" x:Name="playerWindow" Grid.Column="1" HorizontalAlignment="Left" Height="236" Grid.Row="1" VerticalAlignment="Top" Width="431" Margin="202,0,0,0" Source="{Binding fosaModel.SelectedVideo.fPath}" LoadedBehavior="Manual" />

我可以设置它的值，当我更改 videoProgress 属性时，但我无法获取视频播放的位置，即 videoProgress 没有随着视频播放而更新。我应该怎么办？

最佳答案

简短的回答是，无论如何您都必须使用 hack，因为 MediaElement 默认情况下不是 MVVM 友好的。

但是，附加属性在这种情况下非常有用，您可以在不真正破坏模式的情况下做您想做的事情(或者至少不会以一种会让任何人感到不安的方式)。您可以为 DependencyProperty 创建一个附加的 MediaElement ，称为 IsPlaying 。在属性更改处理程序中，您可以根据属性的新值播放或停止 MediaElement。像这样的事情可能会奏效:

    public class MediaElementAttached : DependencyObject
    {
        #region IsPlaying Property

        public static DependencyProperty IsPlayingProperty =
            DependencyProperty.RegisterAttached(
                "IsPlaying", typeof(bool), typeof(MediaElementAttached ),
                new PropertyMetadata(false, OnIsPlayingChanged));
        public static bool GetIsPlaying(DependencyObject d)
        {
            return (bool)d.GetValue(IsPlayingProperty);
        }
        public static void SetIsPlaying(DependencyObject d, bool value)
        {
            d.SetValue(IsPlayingProperty, value);
        }
        private static void OnIsPlayingChanged(
            DependencyObject obj,
            DependencyPropertyChangedEventArgs args)
        {
            MediaElement me = obj as MediaElement;
            if (me == null)
                return;
            bool isPlaying = (bool)args.NewValue;
            if (isPlaying)
                me.Play();
            else
                me.Stop();
        }

        #endregion
    }

然后在您的 View 模型中创建一个 IsPlaying 属性，并将其绑定(bind)到 MediaElementAttached.IsPlaying 上的附加属性 MediaElement 。

请记住，绑定(bind)只是一种方式:您将能够控制 MediaElement，但如果用户更改播放状态，您将无法使用您的 View 模型来了解 IsPlaying 的值运输控制。但是无论如何你都不能真正用 MediaElement 做到这一点，所以你没有放弃任何东西。

与大多数事情一样，有多种方法可以给这只猫剥皮，但这是我个人的喜好，让你最接近我认为的模式。通过这种方式，您至少可以从 View 模型代码中获得对 MediaElement 的丑陋引用。

此外，就视频不随选择而变化而言，就您现在拥有的方式而言， MediaElement 的 Source 属性没有绑定(bind)到任何内容，因为您是在代码中创建的，因此它不会仅仅因为 SelectedVideo 更改而改变.我会回到你以前的方式，并尝试我的附加属性解决方案。

编辑 -
就 Position 问题而言，它与我在 IsPlaying 中提到的相同，即您只能将这些附加属性用作单向 setter ；您不能使用它们来获取 MediaElement 上任何内容的值。但是当涉及到 Position 时，您也有另一个问题，即它不是 DependencyProperty ，因此无法获得有关它何时实际更改的通知，因此无法使用新值更新您的附加属性(可能因为更新如此之快和频繁，它们会使系统陷入相当多的困境)。我能想到的唯一解决方案是以某个时间间隔轮询 MediaElement(100 毫秒之类的应该不会太糟糕)，然后在每次轮询时设置您的附加属性。我会在您的 View 的代码隐藏中做到这一点。确保使用线程锁和某种“暂停更新”标志，以便您可以确保 MediaElement 的 Position 在轮询事件期间不会更新。希望这可以帮助。

关于c# - 以 MVVM 模式控制 MediaElement 及其来源，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41468631/