RIA Development Center
Features Tips Events
Delivering business processing logic through RIA (Rich Internet Application) format is very attractive to architects, developers and operators of IT shops. RIA combines the richness of the desktop application with the ease of deployment, ubiquity and platform independence of the web application. RIAs in the form of mashups, are very popular in the consumer space but have yet to see similar success in the enterprise space. Enterprise applications are stateful and process-centric in nature. Read more
See more tips
Get regular email alerts when we publish new features!
DevX RIA Development Update

More Newsletters
Playing with Media in Silverlight 1.0
Waiting for Silverlight to deliver on its promise of delivering rich media experiences? Take your first steps with this tutorial on how to embed a Windows media file in your Silverlight application, control its playback, and create simple video effects.  

y previous article on getting started with Silverlight provided an overview of Silverlight in general and also covered how to execute managed code in a Silverlight 1.1 application. This article explores one of Silverlight's key capabilities—rich media experience. To this end, you will learn how to embed a Windows media file in your Silverlight application and how to control its playback. In addition, you will also learn how to create simple effects on the video.


Creating the Silverlight Project
The first step is to create a Silverlight project. Using the Microsoft Expression Blend 2 September Preview, name the project Media (see Figure 1). Switch to the XAML view of the page and add a Canvas object to the page, like this:


<Canvas
	xmlns="http://schemas.microsoft.com/client/2007"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	Width="664" Height="611"
	Background="White"
	x:Name="Page"
	>

	<Canvas Width="544" Height="595" 
         Canvas.Left="8" 
	   Canvas.Top="8"/>	

</Canvas>

Figure 1. New Project: Create a new project using Expression Blend 2 September Preview.

You will use this Canvas object to hold a Windows Media file.

In the Project window, right click on the project name (Media) and select Add Existing Item…. Select a Windows Media file. In this case, you'd select a .wmv file named WindowsMedia.wmv. After this, the WindowsMedia.wmv file will be added to the project.

Double-click the WindowsMedia.wmv file in the Project window to add it to the page.





Author's Note: You need Windows Media Player 10 or later for this project to work..

Ensure that the WindowsMedia.wmv file is now contained within the Canvas object (see Figure 2). You might need to move the <MediaElement> element into the <Canvas> element manually.

Figure 2. Adding the File: The .wmv file is now hosted within the Canvas object. Figure 3. As the Video Plays: The media will by default automatically play when the page has finished loading.

Press F5 to test the page. You will notice that the video automatically starts to play when the page has finished loading (see Figure 3).

  Next Page: Disabling Autoplay


Page 1: IntroductionPage 3: Creating the Mirror Effect
Page 2: Disabling Autoplay 
We have a winner in the RIA Run contest! Check out the Contest Winners Gallery and see which entries took the top prizes. You can play the games, too! Also, be sure to check out our interview with the grand prize winner to see how he crafted his winning entry. (Silverlight 2 Beta 2 required)