A Straightforward Approach to Silverlight Component Design

A Straightforward Approach to Silverlight Component Design

icrosoft recently took WPF/E (which stood for Windows Presentation Foundation Everywhere) out of the labs and released it as Silverlight, a new technology that lets you run XAML-based content—including animations and interactivity—in a web browser in a manner similar to Adobe Flash or Sun’s Java. At this time Microsoft supports Silverlight on both Apple’s OS X and on Microsoft Windows XP SP2 (and later) operating systems. It also supports the most common browsers: IE 6.0+, Mozilla, and Mozilla derivatives such as Firefox.

With the announcement, Microsoft made available two separate releases that have widely differing functionality. Silverlight 1.0 supports development using a subset of XAML and JavaScript, while Silverlight 1.1 (currently in alpha release) adds managed code support for a subset of the .NET managed code libraries.

If you have any previous XAML background, it’s important to note that a lot of the staple approaches you may be familiar with from building Windows Presentation Foundation (WPF) applications will not work in Silverlight, which uses only a subset of WPF’s capabilities. Silverlight does not support most of the WPF component primitives, such as Buttons and TextBoxes, and it supports only one layout type: the absolute positioning layout. As a result, porting an existing WPF application to Silverlight will force a total rewrite of all the UI-related code.

At present, you can choose among several options for building a Silverlight component. You can use Expression Blend or Visual Studio Orcas (both in beta as of this writing), but you don’t need such advanced tools—you can use plain old Notepad. You don’t even need a compiler to develop Silverlight controls!

This introduction includes two short examples that will show you the basics to get started with Silverlight. The first example shows the minimal amount of code necessary to get Silverlight to display an ellipse in a browser. The second example covers how to develop a simple button navigation control for a web site. Both examples require nothing but Notepad and the Silverlight end-user runtimes.

Getting Started
To use the examples included in this article, you don’t have to get the development kit. To show off how easily you can get started with Silverlight development, everything in this article was built using nothing but Notepad, the Silverlight 1.0 Beta end-user runtimes, and a pre-defined JavaScript library.

To get started, download the Silverlight 1.0 Beta, and the pre-defined JavaScript file in the sample code for this article. You do not need to install any add-ons to your web server to make Silverlight work. In fact you don’t even have to have a web server; Silverlight applications will run just by clicking a local HTML file that uses Silverlight.

Build a Basic Example
All HTML files that host Silverlight controls have a few common characteristics that you’ll need to include those in your code. First, you need to include a


Share the Post: