Position in Stream

You can assign the Position property of the SmoothStreamingMediaElement to a new position and the player will seek to the new position in the stream. Simply assign a TimeSpan object to the Position property. The TimeSpan object specifies the time interval from the beginning of the stream.

The current topic extends the functionality of previous examples in Silverlight Applications and Events.

Position from Slider Bar

To implement a slider that seeks back and forth in a media stream, add a slider to MainPage.xaml after the combo box.

  <Slider x:Name="SliderBar" Width="200" ValueChanged="SliderBar_ValueChanged"/>

The ValueChanged event of the slider shown above specifies the handler for slider movements. The Value property of the slider will require some calculation to convert the slider Value to a TimeSpan object that can be assigned to the Position property of the SmoothStreamingMediaElement. Add the following variables to the MainPage class.

    // Slider seek variables.
    double sliderProportion;
    double sliderLengthSeconds;
    double conversion;
    TimeSpan tsPositionFromSlider = new TimeSpan();

Calculate New Position from Slider

The following event handler uses the seek variables shown above to calculate a new position value and to reassign the Position property so that the media stream will resume playing at a new position.

    private void SliderBar_ValueChanged(object sender,
                             RoutedPropertyChangedEventArgs<double> e)
    {
        // Calculate proportion of slider length at current position.
        sliderProportion =  ((Slider)sender).Value/((Slider)sender).Maximum;
        // Get media length in seconds.
        sliderLengthSeconds = SmoothPlayer.EndPosition.TotalSeconds;
        // Calculate position in seconds.
        conversion = sliderProportion * sliderLengthSeconds;
        // Convert seconds to a TimeSpan object.
        tsPositionFromSlider = TimeSpan.FromSeconds(conversion);
        // Assign new position by TimeSpan.
        SmoothPlayer.Position = tsPositionFromSlider;
    }

Reset Slider

When the media stream ends or the user clicks Stop, the slider should return to the zero value. The MediaEnded event can be used to reset the slider value when the stream ends. This code also resets the caption of Play.

    void SmoothPlayer_MediaEnded(object sender, RoutedEventArgs e)
    {
        OutputText.Text = "Media Ended. SmoothPlayer CurrentState: " +
                    ((SmoothStreamingMediaElement)sender).CurrentState;
        SliderBar.Value = 0;
        PlayButton.Content = "Play";
    }

Add SliderBar.Value = 0 to the click event to correctly position the slider when the user stops the playback.

    private void StopButton_Click(object sender, RoutedEventArgs e)
    {
        SmoothPlayer.Stop();
        SliderBar.Value = 0;
        PlayButton.Content = "Play";
    }

These changes complete implementation of the slider. The user can navigate to any position in the media stream by dragging the slider thumb to a position forward or backward along its range.

The topic Timeline Markers and Events demonstrates how to capture Microsoft.Web.Media.SmoothStreaming.TimelineEvent markers and seek to them and/or handle the events they generate.

See Also

Concepts

Events