Silverlight Tutorial

Intertech Tutorials

Silverlight Tutorial Objective


Silverlight 2.0 is a .NET web-based technology, which leverages a number of programming features first introduced with Windows Presentation Foundation. Using Silverlight, you are able to embed highly interactive content within a standard web page, similar in concept to Adobe Flash.

This chapter gives an overview of Silverlight 2.0, including the overarching programming model and technologies, as well as the core development tools. Furthermore, this chapter will introduce you to the role of XAML, the XML based grammar which allows you to describe the UI of a Silverlight web plug in. The information presented here will serve as a foundation for the remainder of the tutorial.

Understanding the Role of Silverlight 2.

As you very well know, Silverlight is a web-centric programming technology. Simply put, using Silverlight, you are able to embed highly interactive and media-rich content into your web applications. Ironically, the best way to understand the nature of Silverlight is to examine a desktop programming model, named WPF.

.NET 3.0 introduced the Windows Presentation Foundation (WPF) API. WPF is a supercharged UI framework for building desktop applications. WPF integrates graphics, animations, a rich data binding layer, video / audio services and print-ready document functionality into a single unified programming model.

Using WPF, you are able to build extremely rich ‘next-gen’ desktop user interfaces. Consider the following WPF sample program, authored using Expression Blend. Although not viewable from the printed page, when you click on any of the stylized buttons on the bottom of the window, a 3d-rendered motorcycle spins into view. Also notice the transformed text blocks and dynamic shadowing. While such an application could be built without WPF, doing so would require a large amount of low-level code and quite a bit of time.


NET 3.0 also introduced the Extensible Application Markup Language (XAML), which is typically used when creating WPF applications. XAML is an XML-based grammar which can be used to describe a tree of .NET objects (UI-based or otherwise). The XAML file is typically compiled into a WPF application as a binary resource, named ‘BAML’ (the Binary Application Markup Language). At runtime, BAML is used to hydrate declared objects into memory.

XAML provides a clear separation of concerns between UI and functionality. For example, a WPF Window is typically composed of a XAML file to describe its look and feel, in addition to a C# or VB code file to describe its behavior (event handlers, custom methods, etc). A Silverlight control is also composed of a XAML file and a related C# or VB code file.

XAML also provides a separation of concerns at the tool level. A graphical artist can use dedicated tools (such as Microsoft Expression Blend) to generate the XAML. Programmers can use Visual Studio to add the coding functionality.

This allows different skill sets (artists and coders) to cooperatively build a single WPF or Silverlight application, using appropriate tools. You will learn more about XAML, Expression Blend and Visual Studio’s Silverlight support over the remainder of this class.

While WPF is ultimately an API for desktop development, it also supports ‘XBAP development’. XAML Browser Applications (XBAP) provide a way for a browser to display the UI of a WPF application. XBAPs are essentially lightweight WPF application deployed from a web server, and hosted in a browser.

An XBAP leverages the .NET 3.0/3.5 runtime of the client machine. Therefore, the machine viewing the XBAP must have the .NET 3.0/3.5 runtime libraries. Because of this requirement, only Windows-based computers can correctly view an XBAP. Provided you do have a Windows-based machine, you may view an XBAP using Microsoft IE or Firefox web browsers.

XBAPs are *not* ASP.NET applications and have no native web-awareness. The browser is simply used as a host for the lightweight WPF window (technically termed a ‘WPF-Page’. The benefit however, is that XBAPs provide a much richer UI than traditional HTML/script code. As well, an XBAP can be programmed to invoke remote web services to communicate with ‘home base’.


Silverlight is a web-centric programming model is based on several WPF technologies. However, unlike WPF, Silverlight allows you to build highly interactive web plug-ins. You would never use Silverlight to build a traditional desktop application. A Silverlight plug-in is *not* a WPF XBAP. The client machine does *not* require a full .NET 3.0/3.5 installation.

The major goal of Silverlight is to bring the same quality of a desktop UI to the web (e.g., highly interactive, graphically rich, etc). Like WPF, Silverlight makes use of XAML and integrates a number of features (graphics, animations, data binding, etc) into a unified programming model. Consider Silverlight to be Microsoft’s answer to Adobe Flash.

In addition to XAML, Silverlight (and WPF) also provides a good number of inherit services, including (but not limited to) the following:

Silverlight is not limited to Microsoft-centric OSs / browsers. Silverlight applications can run on multiple operating systems (currently Windows and Mac OS X and possibly other OSs in the future). Silverlight plug-ins can be hosted by multiple browsers (IE, Safari, Opera, and Firefox).

Regardless of the OS / browser, the machine must download and install the free Silverlight runtime plug-in. You will come to know the nature of the Silverlight plug in later in this chapter. For now, understand that if a end user navigates to a web site requiring this plug-in, they will be able to install the runtime with their permission. After this point, your Silverlight web plug-in will load into the browser.

The Silverlight web site ( provides numerous links to download:


Copyright (c) 2008-2013. Intertech, Inc. All Rights Reserved. This information is to be used exclusively as an online learning aid. Any attempts to copy, reproduce, or use for training is strictly prohibited.