How do you change the template?

Jul 12, 2010 at 7:56 AM
I like the minimal look of the SMF v1 template. Is there a way to change it in v2? I did try to open the project in Blend, but wasnt sure how to change it. Also, how do I disable the playlist viewer? I typically have only one video playing. Thanks
Jul 12, 2010 at 1:53 PM
Edited Jul 12, 2010 at 1:54 PM
The best way to change the template in Blend is to put the SMFPlayer control onto a page/control and right click "Edit Template"->"Create a Copy" and go from there. It's pretty easy to set the "ShowPlaylistElement" as Visibility=Collapsed to hide it. I did that for my current project and it worked like a charm, no need to show the playlist when there is only going to be 1 item
The old theme is not included from what I've seen. I also liked it's minimalist approach but the new one is a good example of how to do a richer interface. Methinks an alternative non-gradient theme is in order for the player. So if you do end up creating one, please share if you can ;)
Jul 12, 2010 at 8:15 PM
Can you elaborate where the ShowPlaylistElement goes please? I couldnt find it anywhere in the docs. Here is what I have so far: <Core:SMFPlayer AutoPlay="False"> <Core:SMFPlayer.Playlist> <Media:PlaylistItem MediaSource=""/> </Core:SMFPlayer.Playlist> </Core:SMFPlayer> Also, is there a way to dynamically set the mediasource? Basically, I have a list of videos, and when the user clicks on each, i want the smf player to stop the current video and play the new one. Tim Heuer did an extension of smf 1 here and with that code it was rather easy to do it. Thanks
Jul 12, 2010 at 8:23 PM

You need to use Blend to edit a copy of the template to get to the ShowPlaylistElement. Basically with blend and editing a copy of the template you copy all of the Xaml for the player into your project and then can control it. I'm not sure if there is a way in VS to do this. Another way is to copy the generic.xaml file from the source code of SMF and place it into your project and then link to it in your app.xaml as a MergedDictionary

To have it auto switch a video just swap the current item in the playlist

something like

Player.PlayList.Items.Add(new PlayListItem{ ...});

I don't think dynamically changing the source uri will change it since it is not a bound property.

Jul 12, 2010 at 8:46 PM
Edited Jul 12, 2010 at 8:48 PM
Gotcha. I figured the way you disable playlist via code. Just give the player and x:name and then use that to set PlayListVisibility to disabled. I think for the minimalist player buttons, all i would have to do is remove the cc button and then shorten the spacing. Il try to play with that a little bit. Thanks for the help. EDIT: Would you know of a way to dynamically create playlist images from the playlist?
Jul 12, 2010 at 9:22 PM

Good to know about the PlaylistVisibility property.

I'm not aware of an easy way of doing the thumbnails.. one way I do know of is to create a hidden player/mediaelement, set it to load the video and advance to the first frame after that render it into a writablebitmap. That will get you an image you can use (but cannot transfer it out of silverlight since it has copyright concerns)

Aug 5, 2010 at 2:42 PM

I used Blend and pulled in a page with the player embedded, and followed the Edit Template > Create a Copy method you mentioned, but I can't seem to the style to apply to the player.  In Blend it shows the buttons I've set to Hidden, but when I run the Silverlight app the style doesn't apply.   I'm good with VS, but a newb in Blend.  What am I missing?


Aug 8, 2011 at 12:24 PM

Some additional information and pointers can be found here:

Building a Custom Video Player with the Silverlight Media Framework for the Web, Desktop and Phone (session on Channel9)

Building a custom video player with the Player Framework for the web, desktop and the phone (blogpost)

Player Framework – How to set the background color of the video (blogpost)

Player Framework–A Sample UI with tips and tricks (blogpost)