RSS Feed
Download our iPhone app
Browse DevX
Sign up for e-mail newsletters from DevX


Managed Code Shines in Silverlight 1.1

Find out where Silverlight is headed by adding managed code in addition to JavaScript and XAML.

n addition to the XAML and JavaScript combination supported in Silverlight 1.0, this Silverlight 1.1 Alpha client also supports managed code written in a language such as C# or VB.NET. That single addition brings many more development possibilities into play, and also pulls in a host of exisiting .NET developers, who can immediately take advantage of the new managed code feature.

As an illustration of the power available by combining .NET code, JavaScript, XAML, animations, web services, isolated storage, and of course, HTML, this article shows you how to build a "user viewer" application using Microsoft Silverlight 1.1 that displays user information via a rich and intuitive interface. The user viewer application shows a list of users in a card-like view, much like a Rolodex. Each card contains baseline information about a user. When a user can select a specific card to view, it flies out and enlarges, displaying a detail view.

Running the application—or any Silverlight application—requires only that the client machine has the appropriate Silverlight plug-in installed. When clients without the correct plug-in attempt to run the application they are prompted to download that plug-in version. Silverlight currently supports all major browsers on both Windows and Mac OSX.

Silverlight applications can be hosted on any web server, because they are just serving out HTML. However, if your Silverlight application is embedded within an ASP.NET application, or it uses ASP.NET AJAX Web services (as the sample application does), you'll have to host it on IIS.

Expression Blend is a great tool for designing your user interface and animations, but you will need to use Visual Studio to edit the managed code to go along with it. Note that Blend does not currently include Intellisense support for XAML, but Visual Studio does, so you will also want to use Visual Studio when writing XAML manually.

What You Need
To develop Silverlight 1.1 Alpha applications you need:

Rolodex List
Figure 1. Changing Opacity: Hovering over a card brings it forward and increases its opacity.
The sample application's Rolodex-like view initially presents the cards with a very low opacity, so it can display all the cards in a relatively small area on-screen. Hovering over a card increases its opacity and brings it to the forefront of the list. Similarly, moving the mouse pointer away from a card returns that card's opacity to its default low state (see Figure 1).

The cards are overlaid to make efficient use of screen space. The application achieves the overlay effect by incrementing the Z index and increasing the top and left values for each successive card—although you should note that child control locations are not absolute, they're relative to their parent.

The user card itself is a custom Silverlight control. Whenever you begin creating a custom control, add a private field to keep a reference to your newly created control:

   // Keep a reference to parent canvas for later 
   // use in finding child objects.
   _control = (Canvas)this.InitializeFromXaml(
      new StreamReader(s).ReadToEnd());
There are a couple of things to keep in mind when creating a custom control. All custom controls must be compiled as embedded resources, which allows the Silverlight client to access their XAML via the manifest resource stream of the assembly:

   Stream s = this.GetType().Assembly.
Be very careful when you copy and paste an existing control to create a new one; it's easy to forget to change the file reference, which means you'll load the XAML for the wrong control. If you look into the manifest collection you will see all the XAML files for your application's controls. You can inspect all the available resource streams by drilling into the following collection:

   string[] manifestResources = 

Close Icon
Thanks for your registration, follow us on our social networks to keep up-to-date