| Downloads |
|---|
| SilverlightFeatureBrowser.zip |
Click here to download the code for this article.
Because only a short time elapsed between the release of Silverlight 3 and Silverlight 4, you might think that Microsoft didn't add many new features. But nothing could be further from the truth: Silverlight 4 is packed with improvements to existing features, as well as with many new features.
In this two-part series, I take you on a tour of the 10 most striking new features available in Silverlight 4. In the first article, I looked at printing in Silverlight; dragging content into a Silverlight control; and improvements in rich text area, data binding, and right-clicking controls. In this article, I'll look at an additional 5 new Silverlight features.
So that you can see the new features in action, I've created an application called SilverlightFeatureBrowser, which is based on the Navigation Application template introduced with Silverlight 3. A Navigation Application lets you browse pages inside a Silverlight application; in this case, each page contains a Silverlight feature I’ll be looking at. The most important part in such an application is the Frame control, which is comparable to an IFRAME in HTML. To display a page in the Frame, you can specify the URL of the page you want for the Source property of the Frame. The Page is the second most important aspect of this template: Frame controls can’t display a UserControl; they need a Page instead. Not to worry though, because a Page is similar to a UserControl.
One last note about the code: Silverlight 4 is Visual Studio 2010 (VS2010) only. The most recent version of VS2010 is Beta 2, which you can download for free at http://msdn.microsoft.com/en-us/vstudio/dd582936.aspx. Silverlight 4 in VS2010 features a fully functional designer view and many improved dialogs for easier Silverlight development. Let's look at the second set of new features I'm highlighting.
6. Webcam and Microphone Support
In previous versions of Silverlight, you couldn't connect from Silverlight with a webcam or a microphone. Silverlight 4 has added support for both of these. Because of this new functionality, you can build new types of applications with the platform. For example, you can write an application that captures the barcode of a product, interprets it through an available barcode library written in .NET, and retrieves product information about the scanned product. It’s also quite easy to capture the barcode as a picture and work with it inside an application.
The classes that expose the webcam functionality live in the System.Windows.Media namespace. Let’s take a look at how you can create a simple application that can take your picture. The interface is shown in Figure 1.
Silverlight lets you choose the webcam and microphone you want. Through code (Figure 2), you can get a list of available devices by using the CaptureDeviceConfiguration.GetAvailableAudioCaptureDevices() method. If, in your application, you don’t allow a user to choose, Silverlight will take the default device. You can change the default in the Silverlight configuration screen.
Before capturing the barcode can begin, a user needs to grant access to the Silverlight application to use the device. This can be done using the CaptureDeviceConfiguration.RequestDeviceAccess() method. If access has already been given, CaptureDeviceConfiguration.AllowedDeviceAccess will return true.
Once the user has given Silverlight access to the device, you begin the capture by creating a new CaptureSource instance, setting its VideoCaptureDevice property to the selected device, and calling the Start() method. To paint the video on an element, you can use the newly added VideoBrush (see Figure 2).
At this point, you literally should be looking at yourself but you still need to add the capturing function. For this, you can use the AsyncCaptureImage() method on the CaptureSource instance. In the callback method, you have access to a WriteableBitmap instance, which you can use to draw or print an image, or do any other editing:
captureSource.AsyncCaptureImage((snapshot) =>
\\{
snapshots.Add(snapshot);
\\});
7. Implicit Styling
A small but handy function that has always been available in Windows Presentation Foundation (WPF) but not in Silverlight is the default styling mechanism. Imagine you’re building an application and all TextBlock controls in the application require a specific font size, font weight, and so on. Because previous versions of Silverlight lacked a default styling mechanism, you had to create a style and apply this style on every instance of the TextBlock.
Default or implicit styling lets you override a control's default style. By defining a style that does not have a Key set in its declaration (and thus only has a TargetType defined), you're saying to Silverlight: use this style for every instance of the type specified in the TargetType that does not have a style set. Although it’s a rather small feature, it’s a real time-saver.
The XAML listing in Figure 3 has two styles defined: the implicit style and a regular, named style. Now, if you create an application containing TextBlock controls that do not have a style applied to them, they will automatically have the default style applied.
8. Browsing the Web with the WebBrowser Control
Allowing HTML content to be displayed within a Silverlight application was one of the most requested features for the new version. It opens up many integration scenarios. Let's assume you're migrating from an existing ASP.NET application to a Silverlight application. Instead of requiring that all the functionality be converted to Silverlight, you can opt to leave some part in ASP.NET and still integrate it in the Silverlight environment.
You render HTML in Silverlight by using the WebBrowser control. If you have done WinForms development, you may remember a similar control in that area as well. The control is easy to use and it offers a few properties you can use to indicate which HTML should be shown:
- Source: gets or sets the URL that should be rendered in the WebBrowser control
- Navigate: specifies the URL that should be loaded in the control (works the same as the Source property)
- NavigateToString: lets you display a string of HTML generated on the fly
One very important note: you can use the WebBrowser control only in out-of-browser applications inside Silverlight. In this case, Silverlight can display only HTML pages of the same domain on which it is hosted. If you want to display pages from other domains (for example, www.silverlight.net), the application must be run as a trusted application (I’ll look at trusted applications a little later in this article). You can circumvent this security measure by using a string of HTML that contains an IFRAME, as shown in the sample code.
Figure 4 displays www.silverlight.net running inside a Silverlight application that mimics a browser with an address bar at the top. Because I am displaying a page of another domain, this application is running with elevated permissions (as a trusted application).
Let’s take a look at the code. In the XAML, I instantiate a WebBrowser control:
<pre><WebBrowser x:Name="MainWebBrowser" Width="800" Height="600"></WebBrowser></pre>
In the C# code, when clicking on the Go!-button, I check if the application has elevated permissions. If it does, I load in the page directly using the Navigate method. If it doesn't, I generate a string of HTML containing an IFRAME and load the page in there:
private void AddressButton_Click(object sender, RoutedEventArgs e)
\\}
if (Application.Current.HasElevatedPermissions)
MainWebBrowser.Navigate(new Uri(AddressTextBox.Text));
else
\\{
string localIFrame = "<HTML><HEAD></HEAD><BODY><IFRAME width='100%' height='100%' src='" + AddressTextBox.Text + "' /></BODY></HTML>";
MainWebBrowser.NavigateToString(localIFrame);
\\}
\\}
Together with the WebBrowser control, the HtmlBrush is introduced, allowing painting with the content of a WebBrowser control. This way, you can, for example, create irregular browser windows. In the following code sample, I create a rectangle and fill it with the content of the WebBrowser control used earlier:
<Rectangle x:Name="OpaqueBrowserRectangle" Width="800" Height="600">
<Rectangle.Fill>
<HtmlBrush x:Name="MainHtmlBrush" Opacity="0.5" AlignmentX="Left" AlignmentY="Top" Stretch="Fill"></HtmlBrush>
</Rectangle.Fill>
</Rectangle>
9. Notification Windows (or Toasts)
We’ve all come to love the notification messages from Outlook that let us know when a new message has arrived. The ability to create these small windows (also known as toasts) is now available in Silverlight. A new class was added to instantiate them: NotificationWindow. Just like the WebBrowser control, notification windows are an out-of-browser feature only.
The following code creates an instance of the NotificationWindow class, sets its contents to a custom user control called NotificationControl, specifies its width and height, and calls the Show() method to display the window. The code displays the window shown in Figure 5.
private void ToastButton_Click(object sender, RoutedEventArgs e)
\\{
NotificationWindow notificationWindow = new NotificationWindow();
notificationWindow.Content = new NotificationControl();
notificationWindow.Height = 80;
notificationWindow.Width = 350;
notificationWindow.Show(10000);
\\}
10. Trusted Applications
Code executed in Silverlight 1, 2, and 3 always ran in the sandbox of the browser. You had no way to get out of this sandbox. Even when running a Silverlight 3 out-of-browser application, it still ran in the sandbox.
Silverlight 4 adds a new mode—a trusted Silverlight application—that runs with elevated permissions and allows actions not possible in previous versions. You now have three modes: in-browser, out-of-browser (but still in the sandbox), and trusted (out-of-browser with elevated permissions).
You can enable elevated permissions in a Silverlight application by using the project properties of the Silverlight application. In the project properties, click the Out-of-Browser settings button and in the dialog, check the elevated permissions checkbox as shown in Figure 6. When you want to install this kind of application, a different dialog appears (Figure 7), warning a user that the application requires more privileges to run.
Basically, trusted applications can do more than non-trusted ones. Let’s take a look at the extras they have up their sleeve.
- COM interop: the biggest enhancement is the support from Silverlight for COM interop; Silverlight lets you work with already existing COM objects on the client’s PC. This way, it becomes possible to work with Office applications from Silverlight (Outlook, Word, Excel). The class that makes all this work is ComAutomationFactory. The following lines of code create an instance of Excel:
- using (dynamic excel = ComAutomationFactory.CreateObject("Excel.Application"))
\\{
//do stuff with Excel here
\\}
Note the use of the C# 4 dynamic keyword in this context: CreateObject returns an IDisposable, of which the type will only be determined at runtime. COM interop is at this point a Windows-only feature.
- Full-screen keyboard access: In previous versions of Silverlight, it was impossible to get keyboard access when the application was in full-screen mode. However, some types of applications, such as kiosk applications, required this. In Silverlight 4, this is now supported.
- Full path when using OpenFileDialog and SaveFileDialog: when using both dialogs to open or save a file, the only thing that Silverlight received was a stream to the file; it never got information on the full path of the file. Silverlight 4 trusted applications get this full path information. Also, these dialogs can now open without user interaction.
- Local file system access: another I/O-related enhancement is local file access for trusted applications. This type of Silverlight application now has full access to a number of specific directories, namely the Documents, Videos, Pictures, and Music folders. Cross-domain access: Silverlight Trusted Applications can perform cross-domain network calls to a domain where there is no clientaccesspolicy.xml or crossdomain.xml available.
In this two-part series, I've presented what I believe are the 10 most interesting new features in Silverlight 4. But this list is far from complete. Silverlight 4 includes a large number of enhancements to existing features, as well as more new features than explored here. With a release so close to its predecessor, Microsoft surely has many surprises coming in the next months for Silverlight developers.
