第 71 页

http://asp.net/mvc.

22

silverlight

what’s in this chaPter?

.

Creating your First Silverlight application

.

Using the Navigation Framework

.

Theming your Silverlight application

.

Running a Silverlight application outside of the browser

Although it ’s a rather new technology, Silverlight has been getting a lot of traction from within

Microsoft and the developer community due to its huge potential as a development platform. New

major versions are released very regularly (there were only nine months between the version 2 and

version 3 releases), demonstrating that it is progressing fast. At the time of writing Silverlight had

reached version 4, which is already showing a lot of maturity for a reasonably young technology.

Previously, it was quite a chore to configure Visual Studio 2008 for Silverlight development,

requiring Service Pack 1 along with the Silverlight Tools to be installed just to get started.

Visual Studio 2010 comes already configured for Silverlight development “out of the box,”

making it very easy to get started. Also, Visual Studio 2008 had no designer for Silverlight

user interfaces (initially there was a preview view but this was later abandoned), requiring

developers to write the XAML and run their application to view the results, or use Expression

Blend if they had access to it (which did have a designer). This has been vastly improved in

Visual Studio 2010, with a very capable designer now available making it much easier for

developers to create user interfaces in Silverlight.

Because Silverlight is effectively a subset of Windows Presentation Foundation (WPF) you

will find that many of the Visual Studio features for WPF detailed in Chapter 18 also apply

to Silverlight, and thus aren’t repeated here. Of course, Silverlight has no Windows Forms

interoperability (due to it running in a sandboxed environment and not using the full .NET

Framework), but the other Visual Studio features detailed for WPF development can also be

used when developing Silverlight applications. This chapter takes you through the features of

Visual Studio that are specific to Silverlight and don’t apply to WPF.

472 .

chaPter 22 SilVerlighT

what is silVerliGht?

When starting Silverlight development you will notice its similarity to WPF. Both technologies

revolve around their use of XAML for defining the presentation layer, and are very similar to

develop with. However, they do differ greatly in how they are each intended to be used. Silverlight

could essentially be considered a trimmed-down version of WPF, designed to be deployed via the

Web and run in a web browser — what is generally called a Rich Internet Application (RIA). WPF,

on the other hand, is for developing rich client (desktop) applications. It could be pointed out that

WPF applications can be compiled to an XBAP (XAML Browser Application) and deployed and

run in the same manner as Silverlight applications, but these require the .NET Framework to be

installed on the client machine and can only be run on Windows — neither of which is true for

Silverlight applications.

One of the great benefits of Silverlight is that it doesn’t require the .NET Framework to be installed

on the client machine (which can be quite a sizable download if it isn’t installed). Instead, the

Silverlight run time is just a small download (about 5 MB), and installs itself as a browser plug-in.

If the user navigates to a web page that has Silverlight content but the client machine doesn’t have

the Silverlight run time installed, the user is prompted to download and install it. The install

happens automatically once the user agrees to it, and the Silverlight application opens when the

install completes. With such a small download size for the run time, the Silverlight plug-in can be

installed and running the Silverlight application in under two minutes. This makes it very easy to

deploy your application. Though not as prevalent as Adobe Flash, Silverlight is rapidly expanding its

install base and eventually it’s expected that its install base will come close to that of Flash.

One of the advantages Silverlight applications (and RIA applications in general) have over ASP.NET

applications is that they allow you to write rich applications that run solely on the client, and

communicate with the server only when necessary (generally to send or request data). Essentially,

you can write web applications in much the same way as you write desktop applications. This

includes the ability to write C# or VB.NET code that runs on the client — enabling you to reuse

your existing codebase and not have to learn new languages (such as JavaScript).

Another great benefit of Silverlight is that Silverlight applications will run in all the major web

browsers, and most excitingly will also run on Mac as well as Windows, enabling you to build

cross-browser and cross-platform applications very easily. Support for Linux is being provided by

Moonlight (developed by the Mono team at Novell), although its development is running somewhat

behind the versions delivered by Microsoft. This means that Silverlight can be the ideal way to write

Web-deployed cross-platform applications. Silverlight applications render exactly the same across

different web browsers, removing the pain of regular web development where each browser can

render your application differently.

The downsides of Silverlight are that it only includes a subset of the .NET Framework in order

to minimize the size of the run time download, and that the applications are run in a sandboxed

environment — preventing access to the client machine (a good thing for security, but reduces the

uses of the technology). There are tradeoffs to be made when choosing between WPF and Silverlight,

and if you choose Silverlight you should be prepared to make these sacrifices to obtain the benefits.

Ultimately, you could say that Silverlight applications are a cross between rich client and web

applications, bringing the best of both worlds together.

Getting started with silverlight .

473

GettinG started with silVerliGht

Visual Studio 2010 already comes configured with the main components you need for Silverlight

development. Silverlight is supported out of the box with Visual Studio 2010, but if a new version

of Silverlight has been released that you want to target you will need to download the SDK for that

version. The best place to check if a new SDK has been released and download any required (or

related) components is http://www.silverlight.net/getstarted.

Create a new project and select the Silverlight category (see Figure 22-1). You will find a number

of project templates for Silverlight to start your project.

fiGure 22-1

The Silverlight application project template is essentially a blank slate, providing a basic project

to start with (best if you are creating a simple gadget). The Silverlight Navigation Application

project template, however, provides you with a

much better structure if you are planning to build

an application with more than one screen/view,

providing a user interface framework for your

application and some sample views. The Silverlight

Class Library project template generates exactly

the same output as a standard Class Library

project template, but targets the Silverlight run

time instead of the full .NET Framework.

Use the Silverlight Navigation Application template

for your sample project because it gives you a good

base to work from. When you create the project

you are presented with the template wizard screen

shown in Figure 22-2 to configure the project.

fiGure 22-2

474 .

chaPter 22 SilVerlighT

Most of the options in this window are dedicated to confi guring the web project that will be

generated in the same solution as the Silverlight project. Designed primarily to be accessed via a web

browser, Silverlight applications need to be hosted by a web page. Therefore, you also need a separate

web project with a page that can act as the host for the Silverlight application in the browser.

So that the wizard generates a web project to host the Silverlight application, select the Host the

Silverlight application in a new Web site option. If you are adding a Silverlight project to a solution

with an existing web project that will host the application, you can uncheck this option and manually

configure the project link in the project properties (for the Silverlight application). A default name for the

web project will already be set in the New Web Project Name textbox, but you can change this if you

want. The final option for configuring the web project is to select its type. The options you have are:

.

ASP.NET Web Application Project

.

ASP.NET Web Site Project

.

ASP.NET MVC Web Project

Which of these web project types you choose to use is up to you, and has no impact on the Silverlight

project at all. The sample application uses the Web Application Project, but how you intend to develop

the web site that will host the application will ultimately determine the appropriate web project type.

In the Options group are some options that pertain to the Silverlight application itself. The Silverlight

Version drop - down list allows you to choose the Silverlight version you want to target. The versions

available in this list will depend on the individual Silverlight SDKs you have installed, defaulting to

the latest version available. Because RIA Services are discussed in Chapter 35 , disregard the Enable

WCF RIA Services option for now and leave it unchecked for the sample application.

You can change the properties in the Options group at a later point in time via

the project properties pages for the Silverlight project (see Figure 22-4).

Let ’s take a tour through the structure of the solution that has been

generated (shown in Figure 22 - 3). As was previously noted you have

two projects: the Silverlight project and a separate web project to host

the compiled Silverlight application. The web project is the startup

project in the solution because it ’s really this that is opening in the

browser and then loading the Silverlight application.

The web project is linked to the Silverlight project such that once the

Silverlight application is compiled its output (that is, the .xap file) is

automatically copied into the web project (into the ClientBin folder),

where it can be accessed by the web browser. If you haven’t already

done so, compile the solution and you will see the .xap file appear

under the ClientBin folder.

The web project includes two different pages that can be used to

host the Silverlight application: a standard HTML page and an

ASPX page. Both will do exactly the same thing, so it’s up to

you which one you use and you can delete the other.

fiGure 22-3

Getting started with silverlight .

475

Looking at the Silverlight project now, you will see an App.xaml file and a MainPage.xaml file —

very similar to the initial structure of a WPF project. The MainPage.xaml file will fill the browser

window, show a header at the top with buttons to navigate around the application, and host different

“views” inside the Frame control that it contains. So you could think of MainPage.xaml as being the

shell for the content in your application.

The project template includes two default content views: a Home view and an About view. Modifying

and adding new views is covered in the next section. This folder also contains ErrorWindow.xaml,

which inherits from ChildWindow (essentially a modal dialog control in Silverlight) and pops up when

an unhandled exception occurs (the unhandled exception event is handled in the code-behind for

App.xaml and displays this control).

The Assets folder contains Styles.xaml, which comprises the theme styles used by the application.

This is discussed in the “Theming” section in this chapter.

Now take a look at what options are available in the project properties pages of the Silverlight project.

The property page unique to Silverlight applications is the Silverlight page that is shown in Figure 22-4.

fiGure 22-4

A number of options are of particular interest here. The Xap file name option allows you to set the

name of the .xap file that your Silverlight project and all its references (library and control assemblies,

and so on) will be compiled into. A .xap file is simply a zip file with a different extension, and opening

it in a zip file manager enables you to view its contents. If your project is simple (that is, was created

using the Silverlight Application project template and doesn’t reference any control libraries), it will

probably only contain your project’s assembly and a manifest file. However, if you reference other

assemblies in your project (such as if you use the DataGrid control that exists in the System.Windows.

Controls.Data.dll assembly) you will find that your .xap file blows out in size very quickly (because

these are also included in the .xap file). This would mean that each time you make a minor change to

476 .

chaPter 22 SilVerlighT

your project and deploy it that the users will be re-downloading the assemblies (such as the assembly

containing the DataGrid) that haven ’t changed simply because they are included again in the .xap file.

Fortunately, there is a way to improve this scenario, and that ’s to use application library caching. This

is very easy to turn on, simply requiring the Reduce XAP size by using application library caching

option to be checked. The next time the project is compiled the referenced assemblies will be separated

out into different files and downloaded separately from the application ’s .xap file.

One caveat is that for assemblies to be cached they must have an extension map XML fi le, which

is included in the .xap fi le and points to the zip fi le containing the assembly. Most controls from

Microsoft will already have one of these, so you should not have to worry about this issue. Now

when you compile your project again, take a look at the ClientBin folder under the web project.

You will fi nd one or more .zip fi les — one for each external assembly referenced by your Silverlight