Thumbnail image of Silverlight video

Question

Hello everyone,

For the popular video player, like sl2videoplayer, http://www.codeplex.com/sl2videoplayer, my question is how is the thumbnail image of Siverlight video is displayed before we click play (in the scenario of non-autoplay).

thanks in advance, George

Answer 1

the MediaElement that the Video Player uses will show a thumbnail image of the frame at the current position. Otherwise, tools like Expression Encoder create thumbnail images (JPEGs or PNGs) that will be used for the video thumbnails and chapter markers.

This will show the first frame of the Bear.wmv video and won't play automatically:

<Grid x:Name="LayoutRoot" Background="White">
 <MediaElement AutoPlay="False" Source="Bear.wmv"/>
</Grid>

If you knew the time that the thumbnail comes from, you could have a secondary MediaElement with its Current Position having that time. When playback starts, you would collapse its visiblity.

Michael

Answer 2

I agree that the above answer works, but it might not be optimal for every scenario. An alternate to this would be to have a specific image control that overlays the mediaElement and have it's visibility bound to an "IsPlaying" property. You would need to create the "IsPlaying" property.

Something like this:

<Grid x:Name="LayoutRoot" Background="White">
        <MediaElement AutoPlay="False" Source="Bear.wmv"/>
        <Image Source="Thumbnail" Visibility="{Binding Path=IsPlaying, Converter={StaticResource BooleanToVisibilityConverter}} />
</Grid>

Just an alternative solution. They both seem like hacks a little, but that's the fun part of what we do!