One of my customers has been using the Microsoft Silverlight Media Framework player for their Business-to-Business media sharing portal and wanted to add a download progress bar behind the scrub bar. I was able to show them how to do this with a combination of template binding, re-templating the SMFPlayer and Timeline classes and subclassing the Timeline class.
Notice how the X scale of the rectangle is bound to the download progress (both are values from 0-1).
<Rectangle x:Name="DownloadProgressBar" Grid.ColumnSpan="3" Fill="{TemplateBinding Foreground}" Margin="0,6" Stroke="{TemplateBinding BorderBrush}" Opacity="0.5" RenderTransformOrigin="0,0" IsHitTestVisible="False"> <Rectangle.RenderTransform> <CompositeTransform ScaleX="{Binding DownloadProgress, RelativeSource={RelativeSource TemplatedParent}}"/> </Rectangle.RenderTransform> </Rectangle>
This replaced the Timeline control:
<dp:DownloadProgressTimeline x:Name="TimelineElement" Cursor="Hand" Chapters="{TemplateBinding Chapters}" EndPosition="{TemplateBinding EndPosition}" HorizontalContentAlignment="Stretch" IsLive="{TemplateBinding IsMediaLive}" LivePosition="{TemplateBinding LivePosition}" Margin="0" StartPosition="{TemplateBinding StartPosition}" TimelineMarkers="{TemplateBinding TimelineMarkers}" VerticalAlignment="Center" DownloadProgress="{Binding DownloadProgress, RelativeSource={RelativeSource TemplatedParent}}" Foreground="{TemplateBinding Foreground}"/>
You can download the source code of a sample application here.