Lier MediaElement à la position d'un curseur dans WPF

Question

J'ai essayé de lier la valeur maximale du curseur à la durée de l'élément média et de lier la valeur actuelle du curseur à la position de l'élément média, mais pour certaines raisons, cela ne fonctionne pas.

Je veux que le curseur se déplace pendant la lecture de la vidéo.

<Slider x:Name="videoSlider" Value="{Binding ElementName=mp3MediaElement, Path=Position}" 
ValueChanged="videoSlider_ValueChanged" IsMoveToPointEnabled="True" 
Maximum="{Binding ElementName=mp3MediaElement, Path=NaturalDuration}" 
AllowDrop="True" DataContext="{Binding ElementName=mp3MediaElement}" />

Answer 1

Je n'ai pas utilisé de liant.. J'ai eu un problème similaire et j'ai utilisé un timer pour cela (mon code est en Silverlight mais il est supposé être le même en WPF) :

Première direction (le film met à jour le curseur)

private TimeSpan TotalTime;

private void MyMediaElement_MediaOpened(object sender, RoutedEventArgs e)
        {
            TotalTime = MyMediaElement.NaturalDuration.TimeSpan;

            // Create a timer that will update the counters and the time slider
            timerVideoTime = new DispatcherTimer();
            timerVideoTime.Interval = TimeSpan.FromSeconds(1);
            timerVideoTime.Tick += new EventHandler(timer_Tick);
            timerVideoTime.Start();
        }

void timer_Tick(object sender, EventArgs e)
        {
            // Check if the movie finished calculate it's total time
            if (MyMediaElement.NaturalDuration.TimeSpan.TotalSeconds > 0)
            {
                if (TotalTime.TotalSeconds > 0)
                {
                    // Updating time slider
                    timeSlider.Value = MyMediaElement.Position.TotalSeconds /
                                       TotalTime.TotalSeconds;
                }
            }
        }

Deuxième direction (l'utilisateur met à jour le curseur)
sur le form ctor ou quelque chose comme ça, écrivez la ligne suivante :

timeSlider.AddHandler(MouseLeftButtonUpEvent, 
                      new MouseButtonEventHandler(timeSlider_MouseLeftButtonUp), 
                      true);

et le gestionnaire d'événement est :

private void timeSlider_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
        {
            if (TotalTime.TotalSeconds > 0)
            {
                MyMediaElement.Position = TimeSpan.FromSeconds(timeSlider.Value * TotalTime.TotalSeconds);
            }
        }

Answer 2

Les propriétés Value et Maximum du curseur sont toutes deux de type Double. Vous essayez de vous lier à des valeurs de type TimeSpan y Duration et c'est pourquoi le système de liaison ne fonctionne pas dans votre cas.

Vous pouvez essayer d'écrire un convertisseur, ou de vous lier à NaturalDuration.TimeSpan.TotalSeconds propriété.

J'espère que cela vous aidera.

Par ailleurs, si certaines de vos liaisons ne fonctionnent pas, vous pouvez vérifier les erreurs de liaison dans la fenêtre "Output" de Visual Studio.

Answer 3

J'ai eu le même problème, le curseur ne se mettait pas à jour dans l'interface utilisateur du MediaElement.
J'ai passé pas mal de temps à essayer de le réparer et je ne suis pas sûr que cela puisse aider les autres.
Mais au cas où quelqu'un d'autre rencontrerait ce problème, sachez qu'il existe une ScrubbingEnabled dans l'élément média qui permet à l'interface utilisateur de l'élément média de rechercher automatiquement l'image correcte en fonction de la position.
Très utile lorsque vous êtes en mode pause et que vous essayez de faire glisser le curseur.
Il suffit d'ajouter : ScrubbingEnabled="True" dans le XAML de votre MediaElement.

Answer 4

Voici ce que j'ai fini par utiliser pour mon application UWP.

Cette réponse ne concerne que la question spécifique du déplacement du pouce du curseur en réponse à la lecture. Elle ne traite pas de la modification de la position de la vidéo en réponse au déplacement du curseur par l'utilisateur.

Ajoutez d'abord ceux-ci :

private DispatcherTimer timerVideoPlayback;

private void TimerVideoPlayback_Tick(object sender, object e)
{
    long currentMediaTicks = mediaElement.Position.Ticks;
    long totalMediaTicks = mediaElement.NaturalDuration.TimeSpan.Ticks;

    if (totalMediaTicks > 0)
        slider.Value = (double)currentMediaTicks / totalMediaTicks * 100;
    else
        slider.Value = 0;
}

Puis, lorsque votre vidéo démarre, lancez la minuterie :

timerVideoPlayback = new DispatcherTimer();
timerVideoPlayback.Interval = TimeSpan.FromMilliseconds(10);
timerVideoPlayback.Tick += TimerVideoPlayback_Tick;
timerVideoPlayback.Start();

J'ai utilisé un intervalle de 10 ms pour que le mouvement du curseur reste stable. Utilisez la valeur de votre choix.

Et n'oubliez pas d'arrêter le minuteur à la fin de la lecture :

timerVideoPlayback.Stop();