Philippe Maes
Philippe Maes

Reputation: 510

MediaElement: show when loaded

I have an image with the thumbnail of a video and a MediaElement with the real video, like so:

<Image Source="{Binding thumbnailurl}"/>
<MediaElement Position="{Binding currenttime}" MediaOpened="MediaElement_Opened" Source="{Binding videourl}" AutoPlay="True" Visibility="Collapsed"/>

With a property changed listener on the currenttime of the video:

private TimeSpan _currenttime;
public TimeSpan currenttime
{
    get { return _currenttime; }
    set
    {
        if (_currenttime == value) return;
        _currenttime = value;
        NotifyTimeSpanChanged("timespan");
    }
}

protected void NotifyTimeSpanChanged(string name)
{
    System.ComponentModel.PropertyChangedEventHandler handler = PropertyChanged;
    if (handler != null)
    {
        handler(this, new System.ComponentModel.PropertyChangedEventArgs(name));
    }
}

With this eventhandler:

private void MyClass_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
{
    if (e.PropertyName.Equals("timespan"))
    {
        MediaElement me = (MediaElement)sender;

        if (me.Position.Milliseconds > 42)
        {
            me.Visibility = Visibility.Visible; // show video now
        }
    }
}

I want to make a steamless transition from thumbnail to video when the video is at 42ms (first frame). The problem is that there never seems to happen a timespan changed event...

Upvotes: 0

Views: 1022

Answers (1)

XAMeLi
XAMeLi

Reputation: 6289

You can add a property of TimeSpan (let's call it CurrentTime) and bind Position property of MediaElement to CurrentTime.

When CurrentTime changes, check that it's "bigger" than an arbitrary epsilon (let's say 42ms, which is about the duration of one frame). If it's bigger, do the visibility trick and stop comparison.

Upvotes: 1

Related Questions