The Media Control
The Media web control gives you a server-side abstraction over the MediaElement class from Silverlight. The obvious question is, "When should you use the MediaElement, and when should you prefer the server-side Media web control?" They both amount to the same thing -- after all, the server-side Media web control renders a MediaElement,s although it requires slightly more work on the server to do so. The primary advantage to using the Media web control is that you have the chance to set some of its properties using server-side code. For example, you could set the media URL based on information from a database and even extract it through data binding.
Here's an example of how you might define the Media control:
<asp:Media runat="server" ID="Media1" AutoPlay="true" MediaUrl="MyVideoFile.wmv" SilverlightBackColor="blue" MediaSkin="Professional" Height="240" Width="320" />
This creates a Silverlight control with a media player in it, as shown in Figure 1.
The media player attempts to access the MyViewFile.wmv file, and begins playing it immediately. In order to streamline the video playback experience, the media player downloads and buffers small chunks of video data as it plays. Best of all, the Silverlight media player works without requiring Windows Media Player. It's more lightweight and performant, and the user interface (playback buttons, skin, and so on) is more customizable.
To get the most out of Silverlight's media playing ability, you need to take a closer look at the properties provided by the Media control. Table 1 lists some of the most important.
MediaUrl | Identifies the location of the media file. You can use .wma, .wmv, .mp3 and .asx file types. You can specify a relative path for a file on your web server, or you can supply a full URL that points to another location. | AutoPlay | Sets whether playback starts immediately when the page is initialized. The default is false, which means the user will need to use the playback controls to initiate playback. | AutoScale | Sets whether the XAML should be resized to fit the player size. The default is true. | LoopCount | Sets the number of times to loop (repeat) the media file. Use a value of 0 to loop the media file continuously. | MediaSkin | Specifies the "skin" that determines the appearance of the media player. The media player includes several built-in skins that include different graphics, colors, and animated effects. Each skin is defined in a XAML resource that's embedded in the Silverlight assemblies. Skins are defined by the MediaSkin enumeration and include AudioGray, Basic, Blitz, Classic, Expression, Game, Professional, and Simple. PlaceholderImageUrl Specifies a URL to a placeholder image that will be shown while the media file is being opened. Once the media file is opened, this image is replaced with the first frame of your video. | Volume | Sets the volume as a value between 0 (silent) and 1 (the maximum volume). | Muted | Determines whether the audio should be muted initially. The default is false. | StartTime | Specifies a location in the media file (as an offset in seconds) where playback should start. By default, playback starts at the beginning of the file. | Duration | Sets the number of seconds that media should play before stopping. By default, the entire media file is played. |
There are several more features of the Media control that aren't covered here:
- You can define chapters that link to specific locations in your media file, and show them in the media player. The user can then jump directly to one of these chapters.
- You can export any of the media player's skins as XAML, customize it, and then use that customized version on your web page.
- You can use JavaScript methods to control media playback. This gives you another way to interact with ASP.NET, as you can create ASP.NET AJAX routines that interact with the media player.
You can also set various OnXxx properties (like OnClientMediaEnded and OnClientMediaFailed) to trigger a JavaScript function when a specific event happens in the media player. For information about these more advanced tasks, refer to http://quickstarts.asp.net/Futures/Silverlight/media.aspx.