Silverlight

Silverlight-Introduction

Silverlight is used to create rich internet applications. It is both a User Interface technology as well as a robust platform for creating web applications. It is integrated with .NET Platform so you can not only create interactive applications, but also enhance your current web applications to give your users a better experience.

Silverlight applications will run in a local machine but to run a Silverlight application on a web server, you need to add the extension .XAP with the MIME type application/x-silverlight in the server supported file types configuration.

Silverlight technology is comprised of four main parts:

• Silverlight Plug-in
• Silverlight Host, the Web Page
• Silverlight Application File (.XAP)
• The Interface language, Extensible Application Markup Language (XAML)

A Silverlight Plug-in is the engine that renders the Silverlight application in the browser, the host is the web page where Silverlight Application is hosted, and the Silverlight Application is the Internet Application which is developed using Microsoft Visual Studio and Expression Blend.

The core of the Silverlight technology is an Extensible Application Markup Language (XAML) which is a declarative programming language used to create rich vector graphics and animations and is used in the Silverlight Application file. Figure 11.1 shows an overview of the Silverlight Technology:

Figure 11.1 XAML is the core of a Silverlight application. In the next few sections we will discuss these in more details.

Silverlight Plug-in

Silverlight is a Plug-in for a web browser. A Plug-in is an extension of an application created to enhance or extend functionality. Examples of other web browser plug-ins are Flash, Java applets, Windows Media Player, and QuickTime. To run a Silverlight application in a browser, users have to download and install the Silverlight plug-in first. TheSilverlight Plug-in is the complete environment where the Silverlight applications run. The Plug-in contains the XAML Parser, Media Pipeline, Presentation Engine, and a .NET programming layer that uses the embedded Common Language Runtime (CLR). The Plug-in also provides a way for Silverlight applications to communicate with the Browser. Figure 11.2 shows the components of Silverlight Plug-in.

Figure 11.2 The Plug-in contains the necessary components to render silverlight applications. The Silverlight Plug-in consists of the following sub components and features:

• The Presentation Engine with Multi Core support
  • Drawing Vector graphics and Shapes
  • PNG/JPG decoders
  • Image Cache, Text and Glyph cache
  • Animation System
  • 3D rendering engine
• The XAML Parser
• Subset of the .NET Framework
  • Core Common Language Runtime (CLR)
  • The .NET base class libraries
• Media features
• Media Pipeline
• Download and streaming
• Audio/video decoders
• Browser Interaction
  • HTML Bridge
  • Mouse and Keyboard Input and Events
  • Ink Support
• The Downloader

The Silverlight Plug-in resides in the browser and is activated when you navigate to a web page that has the embedded code for Silverlight Application.

Steps for rendering Silverlight on a web page

The Plug-in acts in the following sequence when a user navigates to a Page with Silverlight, as shown in the figure 11.3:

Figure 11.3 CLR is launched which then extract XAML and other assemblies.

1. User opens a web page with Silverlight
2. The page has embedded code which refers to a XAML Application (.XAP) file
3. The Silverlight Plug-in is installed in the browser, and then downloads the .XAP file
4. Launch the embedded Common Language Runtime (CLR), the environment which ex- ecutes and manages theSilverlight application
5. Extract the XAML Files and Assemblies from the XAML Application (.XAP) file
6. Load the .NET Assemblies
7. Create instances of the Silverlight Control that includes:
   1. Creating a User Interface Element Tree
   2. Managing the Layout of the User Interface
   3. Drawing the User Interface

Silverlight application is hosted on a web page using an HTML Object tag. We discuss how this works in the next section “Silverlight Host”.

Silverlight Host

Microsoft Visual Studio and Expression Blend both allow you to create Silverlight applications. These applications essentially create a XAML Application file (.XAP) file, referenced by a link in an object tag.

There are three ways you can host a Silverlight Application File in a web page

1. Hosting the Silverlight in any HTML Page using <object> tag
2. Hosting in an ASPX Page using a Silverlight Control
3. Hosting in an ASPX Page using a MediaPlayer Control

Using an <object> Tag is similar to embedding any ActiveX control like a Media Player or a Flash file. Here is a sample code which embeds a Silverlight Object that link to a HelloWorld.xap.

 Collapse | Copy Code

<object data="data:application/x-silverlight-2," type="application/x-silverlight-2">
<param name="source" value="ClientBin/HelloWorld.xap" />
<param name="onError" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="4.0.50826.0" />
<param name="autoUpgrade" value="true" />
</object>

Visual Studio allows creating web projects that uses Silverlight User Controls in a webform. This user control is eventually converted into an object tag as shown in the earlier example. Silverlight also allows using Media control inside a web form (ASPX).

Silverlight Controls can also be embedded into an existing or new Web application by dragging the user control from the Tool Box to the web page. To use these controls, you will also need a Script- Manager control, the control which manages script files. See figure 11.4.

Figure 11.4 Silverlight and MediaPlayer control are available in the Toolbox. Here is an example using a Silverlight Control in a Web Form (ASPX)

 Collapse | Copy Code

<asp:Silverlight ID=”Xaml1” runat="”server”" Source=”HelloWorld.xap” Minimum- Version=”4.0.50826.0” Width=”100%” Height=”100%” />

Using a MediaPlayer Control in a Web Form (ASPX)

 Collapse | Copy Code

<asp:MediaPlayer ID=”MediaPlayer1” runat="”server”" Height=”240px” Width=”320px”> 

Silverlight Application File (.XAP)

A Silverlight Application file is a single compressed .ZIP file whose extension is changed to .XAP (XAML Application). It consists of a number of XAML files, .NET assemblies, and other resources. When you build a Silverlight application, Visual Studio compresses all relevant files into this single file.

The .XAP file is referenced inside the Silverlight Object tag in HTML and is loaded, parsed and executed by theSilverlight Plug-in. The .XAP file contains the actual logic and the interface of the Silverlight application. See the instruction for “Hello World” application at the end of the chapter to follow along as we develop the application.

Notice there are four files- App.xaml, App.xaml.cs, MainPage.xaml, and MainPage.xaml.cs. These are automatically created by Visual Studio. App.xaml and .cs files are used for application level properties and events. MainPage.xaml and .cs file are the files which contain the first visual of the application. Note the InitializeComponent method in the .cs files. This method combines the XAML file with the code.

To better understand the code interaction, we will open the HelloWorld Folder as a website inside Visual Studio. This will show us the hidden folders and files which are not shown in a Silverlight application.

In the Solution Explorer click on the HelloWorld Solution and click on add existing website and select the HelloWorld Folder and click ok. See figure 11.5 for an updated explorer view. In the Website view you will find two new folders:

• Obj folder, used for intermediate processing
• Bin folder, which stores the binaries after the project is compiled

Figure 11.5 shows a website view of the HelloWorld application with details of OBJ Folder(left) and Debug Folder(right).

Figure 11.5 The Obj/Debug Folder contains the intermediate files.

The Obj/Debug Folder store objects and intermediate files before they are linked together:

• Page.g.cs and App.g.cs are the intermediate files corresponding to each xaml file. The “g” stands for generated. Each XAML file is converted into this partial class file. This file declare the initialize component method, and loads the corresponding xaml file as components.
• HelloWorld.g.resources file is the compressed binary form for all the xaml files which is also sometimes called BAML files
• The HelloWorld.dll, the assembly created by Visual Studio, is also copied to the BIN folder before compressing into the .XAP
• XAPCacheFile is the intermediate file for the Assembly Manifest
• HelloWorld.PDP is the projects related file that contains debugging and project state information
• FilelistAbsolute.txt, as the name suggest stores the absolute path of the files used before compiling them inside the dynamic link library

The Bin/Debug is the folder where the compiled files are stored. The files created as a result of the build process are:

• HelloWorld.XAP: File is the final compressed Silverlight application file which contains the HelloWorld.dll as well as the AppManifest.XAML. You can see this by changing the extension to .zip and opening it.
• TestPage.html: Host file which embeds the HelloWorld.XAP file
• The HelloWorld.dll: Assembly created by Visual Studio that contains the XAML files, required .NET assemblies, and other embedded resources related to the application.
• AppManifest.xaml: Application manifest file which stores the Entry Point of the applica- tion, describes the names and source of assemblies that the application should bind to at the run time, and also contains metadata for assemblies used by the application.

To deploy your Silverlight application, you upload the TestPage.html and HelloWorld.XAP file to a web server. The HelloWorld.XAP file has all the needed files. HelloWorld Application has the fol- lowing files in the .XAP:

• AppManifest.xaml
• HelloWorld.dll

A sophisticated Silverlight Application file will have other .NET assemblies, xaml files and other resources like images, and media files. When the Silverlight Plug-in loads a HelloWorld.zap file in a web browser, it reads the AppManifest file first to find out the entry point.

The entry point is the name of the dll which needs to be loaded first and is entered in the field Entry- PointAssembly. In AppManifest.XAML, the value is HelloWorld. The manifest file will also have references to other required assemblies as AssemblyPart to be loaded by the application at run time.

 Collapse | Copy Code

<deployment xmlns="http://schemas.microsoft.com/client/2007/de- ployment" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" entrypointassembly="HelloWorld" entrypointtype="HelloWorld.App" meversion="2.0.31005.0">
<deployment.parts>
<assemblypart x:name="HelloWorld" source="HelloWorld.dll">
<assemblypart x:name="OtherAssembly" source=" OtherAssembly.dll">
</assemblypart></assemblypart></deployment.parts>
</deployment>

In our example we have only one assembly, but Deployment.Parts can have list of all assemblies used in the application. Other assemblies will be loaded as required. Now let’s look at the Hello- World.dll. Figure 11.6 shows the HelloWorld.dll inside a .NET Reflector.

Figure 11.6 The XAML files are stored in the resource section inside the HelloWorld assembly.

The figure 11.6 shows the inside view of the HelloWorld.dll. Note that the DLL file has kept the XAML files in the resources and the code behind files becomes the standard methods of the Silver- light application.

The Silverlight plug-in follows the following sequence of events:

1. The XAP file is extracted
2. AppManifest.XAML file is consulted for the entry point assembly
3. The entry point assembly is loaded (in our case HelloWorld.dll)
   1. Application InitializeComponent is called
   2. Initialize component links and loads App.xaml which load application resources
   3. Application Startup method is called
   4. Startup method sets Application’s RootVisual to Page object
      1. A new instance of Page is created
      2. Page’s InitializeComponent is called
   5. MainPage.xaml is linked and loaded
   6. Silverlight User interface is rendered based on MainPage.xaml
4. Web page displays the content of MainPage.xaml

When you create a new Silverlight application, MainPage.xaml becomes the default visual inter- face. In our example, “Hello World” text block in the MainPage.xaml is displayed. What makes MainPage.xaml rich is the vector quality of the interface markup language. Try changing the font size to 34, and notice how it scales without loss of quality. Thanks to eXtensible Application Markup Language (XAML), which we are going to discuss in the next section.

Silverlight XAML

Silverlight XAML (eXtensible Application Markup Language) is an interface markup language which has a visual file (MainPage.xaml) and a .NET code behind file (MainPage.xaml.cs) for logic. The visual part is an advanced HTML, and the code behind file brings the robustness of .NET type safe, managed environment. These two parts make XAML simple and a powerful language.

XAML = MainPage.xaml + MainPage.xaml.cs

The visual part is extended from xml and allows you to declaratively define your User Interface. It is straight forward, you have fields, attributes and properties and you get what you declare. Main- Page.xaml.cs has application logic and event declarations. Let’s see each of these in more details.

Silverlight XAML can be divided into two parts:

• Extensible Markup languages file (Visual Part)
• XAML .NET files (Application Part)

Extensible Markup Language files (Visual Part)

XAML is much more advanced than HTML, it lets you declare tags for objects, shapes and allows URL linking to jpg, png images and other multimedia files. While HTML parsing is done at run- time, XAML markup is compiled.

The object and shapes you declare in XAML are vector images and can scale without loss of qual- ity. It also supports advanced Anti-alias features for sharp image borders and 2-D animations using story board tags. Animations in XAML are also declared-no programming is involved.

XAML Markup files support:

• Vector graphics
• Tag based 2-D animations
• Allow linking images and multimedia files

The second aspect of XAML is extensibility. XAML is based on XML, so apart from the tags available in the default xml namespace defined for objects and shapes, you can create your own namespace and use your own tags. In fact it’s the extensibility of the Silverlight XAML file which allows for defining a code behind file.

Let’s look at the MainPage.xaml we created in HelloWorld application.

 Collapse | Copy Code

<UserControl x:class="”HelloWorld.MainPage”" xmlns="”http://schemas.microsoft.com/winfx/2006/xaml/presentation”" xmlns:x="”http://schemas.microsoft.com/winfx/2006/xaml”" xmlns:d="”http://schemas.microsoft.com/expression/blend/2008”" xmlns:mc="”http://schemas.openxmlformats.org/markup-compatibility/2006”" mc:ignorable="”d”" d:designheight="”300”" d:designwidth="”400”">

<grid x:name="”LayoutRoot”" removed="”White”">
<textblock x:name="”TextHello”" fontsize="”34”" margin="”80”"> Hello World !</textblock>
</grid>
</UserControl>

Note the following four elements:

1. Root element UserControl
2. The significance of x:Class
3. Mapping (xmlns and xmlns:x) and XAML Namespace
4. The Grid and TextBlock Object

Let’s talk about each of these to have a better understanding of the embedded code.

Root Element

UserControl is the root element of the XAML file. Silverlight allow two kinds of XAML templates in a silverlightproject, an Application template and a User Control template with corresponding root elements.

A Silverlight project will have these two default files: App.xaml (Application) and MainPage.xaml (UserControl). The HelloWorld program had one application file (App.xaml) which uses one User- Control (MainPage.xaml) for display but you can have multiple templates in the same project. See Figure 11.7 for the class diagram.

Figure 11.7 The App class deals with the application as a whole.

App class deals with the application as a whole and Page class as single interface inside the applica- tion. At any point of time the root elements of Silverlight is set to a Page class. By default this is set in the Application Startup event.

 Collapse | Copy Code

private void Application_Startup(object sender, StartupEventArgs e){
this.RootVisual = new Page1(); }

To change the user interface you will need to change the RootVisual to a different Page.

X:Class

The X: Class attribute allows you to add your namespace in the XAML file. The attribute declares the value of the namespace and the class. By default every MainPage.xaml file is associated with a Page class which is the code behind file. You can use this attribute to add more namespaces. The compiler use this values to generate the intermediate partial class (Page.g.cs) which is later com- bined with the code behind file. This attribute links the Visual XAML with the code behind file.

 Collapse | Copy Code

//	For x:Class="HelloWorld.Page" Namespace, class generated is shown namespace HelloWorld { class Page : UserControl {} }

Namespace is the Assembly name, and since this is an attribute of a UserControl the Page class, it is inherited from the assembly.

xmlns and xmlns:x

In the root element we saw two attribute declarations: xmlns and xmlns:x. These attributes indi- cate to the XAML processor which XML Namespaces (xmlns) contain the element definitions the markup will reference. Let’s go through more details of the XML Namespace.

XML Namespace

XML Namespace is a context associated with a set of XML elements and attribute, and are defined by a unique identifier. When you define an XML Namespace in the root of an XML files, you de- clare that the objects defined in the file will follow predefined language elements. XML Namespace ensures uniqueness of elements and their attributes Names in an XML file.

 Collapse | Copy Code

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

As we can see, the xmlns identifier is a URI (Uniform Resource Identifier) but is not required to point to an actual resource.

In Silverlight, this is meant for XAML files which are an extended version of XML so it is also called XAML Namespace. XAML Namespace defines many commonly-used features that are nec- essary for basic functionalities. It also defines a set of elements, attributes and properties which are accessible through the XAML processor.

The Default Namespace (Xmlns)

The xmlns attribute indicates the default XML namespace. All the elements which are specified without a prefix map to the default namespace. This includes all the UI elements like Grid, Text- Block, vector, and Animation objects.

The XML Namespace http://schemas.microsoft.com/winfx/2006/xaml/presentation is the namespace for Windows Presentation Foundation (WPF). The Silverlight technology originated from WPF so the first namespace defaults to the WPF namespace.

These elements are defined in the PresentationFramework.dll

The XAML Language Namespace (xmlns:x)

The second namespace is specific to XAML language and is mapped it. Every element or attribute which needs to use this namespace have to use the prefix “x:”. We saw “x:Name” “x:Class” attri- butes in the XAML example above, these two attributes uses the XAML language namespace. So in the following example, although the TextBlock uses the default namespace, Grid’s X:Name attribute is specific to the XAML language namespace.

 Collapse | Copy Code

<grid x:name="LayoutRoot" removed="White">
<textblock margin="120" fontsize="20">Hello World!</textblock>
</grid>

Figure 11.8 shows the two namespaces with common elements

Figure 11.8 The Namespace contains the element definition.

The Grid and the TextBlock

A Grid object in XAML is similar to a Table tag and TextBlock and a label tag in HTML. By Default the Grid has one row and one column. We entered “Hello World” with FontSize 24 in a TextBlock inside a Grid. In HTML, this is similar to a label with text inside a borderless table with one row and one column.

The difference is the quality of the text block is better in XAML because it is in vector. The same text in HTML will not scale with that quality.

XAML .NET Files (Application Part)

Silverlight XAML is also a powerful application and treated as a .NET class by Common Language Runtime (CLR). There are three aspects to the application part of XAML:

• MainPage.xaml.cs, .NET code behind file is attached with the XAML file.
• Page.g.cs, a partial class file which is generated for the XAML file (MainPage.xaml)
• A BAML (Binary Application Markup Language) file is created based on the XAML file and stored as a resource (HelloWorld.g.resources) in Assembly.

MainPage.xaml.cs

A .NET code behind file is created for each XAML file. The XAML file uses the X:Class attribute to attach this file. The code behind file contains functions and methods. XAML allows declaring event names in the attributes, but the logic for the events is declared in this code behind file.

Page.baml

Binary Application Markup Language (BAML) file is an intermediate file which becomes a part of the Resources in the Assembly. It is a binary representation of the object hierarchy and proper- ties defined in the source XAML file. It has been pre-tokenized (broken into discrete elements) so at runtime loading of BAML from the resource file is much faster than loading a xaml file. This allows XAML to retain the ease of XML during development without performance overhead at the runtime.

Page.g.cs

During build process, an intermediate partial class file is generated with an extension .g.cs for every xaml file. The Roles of Page.g.cs includes the following:

• It defines a field for every element with an X:name attribute
   Collapse | Copy Code

  internal System.Windows.Controls.Grid LayoutRoot;
  internal System.Windows.Controls.TextBlock TextHello;
  

• It declares the InitializeComponent method which creates the tree of Object by calling LoadComponent() and loads the MainPage.xaml from the Assembly resource
   Collapse | Copy Code

  System.Windows.Application.LoadComponent(this, new System.Uri("/ HelloWorld;component/MainPage.xaml", System.UriKind.Relative));
  

• The InitializeComponent method also links the elements created with attribute x:Name to their respective names so that you can directly use them. The Field LayoutRoot and Tex- tHello will be set to the value of the grid and textbox that was created for it at that time.
   Collapse | Copy Code

  this.LayoutRoot = ((System.Windows.Controls.Grid)(this. FindName("LayoutRoot")));
  this.TextHello = ((System.Windows.Controls.TextBlock)(this. FindName("TextHello")));
  

Page.g.cs file is combined with the code behind file MainPage.xaml.cs at runtime to create a single class.

 Collapse | Copy Code

 
Page Class = MainPage.xaml + MainPage.xaml.cs becomes,
Page Class = Page.g.cs + MainPage.xaml.cs + HelloWorld.g.resources

The Build process takes both visual and application part and combines it into a single assembly (HelloWorld.dll). This separation of markup and application in the XAML provides easier develop- ment and robustness of .NET. Figure 11.9 summarizes the three aspects of XAML.

Figure 11.9 XAML is an Extensible Application Markup Language.

Silverlight and .NET Framework

The real power of Silverlight comes from .NET Framework. The .NET support in Silverlight ranges from base class library, to advanced internet features like AJAX and LINQ, available in .NET Framework 3.5. All of these features are managed through an embedded Common Language Runtime(CLR) in the Silverlight Plug-in.

The .NET Application support in Silverlight can be divided into two parts:

• Embedded Common Language Runtime (CLR)
• .NET Framework Libraries

The .NET Core Common Language Runtime resides with the Silverlight Plug-in the browser and is installed withSilverlight Plug-in. The Core CLR is responsible for the execution of the Silver- light application in the browser. The .Net Framework Libraries are required for the rendering of the Silverlight application, and all other functionalities.

Understand the Embedded CLR

The .NET Embedded CLR is the engine responsible for managing the .NET part of the Silverlight application. The CLR instantiates the Silverlight Application, loads it in the memory, renders it using the presentation framework libraries and dynamically links it with the networking libraries for the data and internet related features. It manages memory and ensures type safety and security features. The Embedded CLR provides the following features:

• Automatic Memory Management
• Garbage Collection
• Just in Time Compiler
• Managed Exception handling
• Type Safety
• Security Features
• Threading

These features are analogous to the CLR used for .NET applications. We will see more details on these in examples. The next part is the .NET Framework libraries available for Silverlight.

.NET Framework Libraries for Silverlight

The .NET Framework libraries supported by Silverlight are Base Class Libraries, Generics, Collections, Regular Expression, LINQ and Threading.

.NET Framework Libraries

• Base Class library
• Presentation Foundation
• Data framework
• Communication Foundation
• Additional Libraries Specific to Silverlight

Base Class library

The base class library in Silverlight is meant to provide all the basic features of .NET applications, like input/output (IO) operations, text, Regular expressions, collections, and Generics. Here is the list of namespaces supported by base class libraries:

• System for the core object
• System.IO handles input and output
• System.Text support storage and manipulation of text
• System.Text.RegularExpressions for Regular expression support
• System.Resources allows embedding of resource in the assembly
• System.Collections.Generics allows generics in Silverlight
• System.Cryptography enforces Security features
• System.Globalization for multi language support
• System.Reflections for assembly related information

Presentation Foundation

Presentation foundation consists of all the libraries used to render the Silverlight application on the webpage. This include libraries related to Markup, Shapes, Vector, Animations, and libraries related for User Controls and multimedia files. This also includes Windows library for Silverlight applica- tions and deployment. Here is the list of namespaces:

• System.Windows for application and deployment
• System.Windows.Shapes for Ellipse, Line, Path and Polygons
• System.Windows.Documents for Glyphs and linebreaks
• System.Windows.Media supports brush and transformations
• System.Windows.Media.Animation for Animation and storyboards
• System.Windows.Threading supports Dispatcher and DispatcherTimer
• System.Windows.Browser for communicating with the HTML Browser
• System.Windows.Controls Standard controls and UserControls

Data framework

The next set is for .NET libraries related to XML, JSON data and LINQ

• System.XML provides XMLReader and XMLWriter
• System.Runtime.Serialization provides data and XML Serializer
• System.Runtime.Serialization.JSON supports JSON data
• System.Linq for advanced LINQ support
• System.XML.Linq for LINQ to XML conversions

Communication Foundation

Communication foundation relates to data communication in the Web. It is meant to support AJAX technologies, web services and RSS, Atom feed formats.

• System.Net provides Ajax, HTTPWebRequest, WebClient and Sockets
• System.ServiceModel supports web service client and Service reference
• System.ServiceModel.Channel for binding and message
• System.ServiceModel.Syndications used for RSS and Atom feed

Additional Libraries Specific to Silverlight

Silverlight provides additional functionalities for creating rich and interactive applications:

• System.IO.IsolatedStorage
• DeepZoom through MultiScale class in System.Windows.Controls
• System.ComponentModel for Background Worker (Async. Programming)
• HTML managed code interaction through System.Windows.Browser
• XML, JSON and POX (Plain Old XML) data Support through System.XML
• Dynamic Language Runtime which supports IronRuby and IronPython

Figure 11.10 gives an overview of the .NET library available in Microsoft Silverlight.

Figure 11.10 Silverlight comprises the best of the .Net Framework.

Create Silverlight Application

Let’s start with two simple programs.

1. Hello World – Basic application
2. Silverlight Rocks – Event driven Silverlight application with dynamic resources

The first example application has already been discussed in the chapter, and the second example is to give you a taste of event driven Silverlight programming.

Creating the Hello World Application

Problem

How to create a Hello World in Silverlight?

Solution

The Hello World application is normally seen as the first and the simplest program. The program will demonstrate the methods exposed by the App class which is derived from Application class. See figure 11.11.

Figure 11.11 The RootVisual property of the Application class defines the Visual element of the Silverlightapplication.

Steps to create the HelloWorld Silverlight Application:

1. Open Visual Studio, click on File, New, Project, and select Silverlight in the Project Type and select SilverlightApplication in the template. Enter HelloWorld in the Name and Solu- tion field and click ok.
2. Select automatically generate a test page to host Silverlight and click ok.
3. Open the MainPage.xaml file in the editor add a TextBlock control inside the Grid tag and enter Hello World as shown below
    Collapse | Copy Code

   <grid x:name="LayoutRoot" removed="AliceBlue">
   <textblock fontsize="24" margin="100">Hello World !</textblock>
   </grid>
   

4. Press F6 to build Solution and CTRL F5 to run the test page with Silverlight inside. See figure 11.12.

Figure 11.12 The Hello World Text scales without loss of quality.

Once you have created the Hello World application, look into the application files inside Visual Stu- dio. The important point here is the MainPage class which is used to set the RootVisual property of the App.cs. This is done in the Application_Startup method. The application has the following four public methods: Startup, Exit, UnhandledException and ReportErrortoDOM. Also note the properties of the base Application class.

XAML
App.xaml

 Collapse | Copy Code

<application xmlns=" http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:class="HelloWorld.App">
<application.resources>
</application.resources></application>

MainPage.xaml

 Collapse | Copy Code

<UserControl x:class="HelloWorld.Page" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" width="400" height="300">
<grid x:name="LayoutRoot" removed="AliceBlue">
<textblock margin="120" fontsize="20">Hello World!</textblock>
</grid>
</UserControl>

Code
App.xaml.cs

 Collapse | Copy Code

using System;
using System.Windows;
namespace HelloWorld {
public partial class App : Application {
public App() {
this.Startup += this.Application_Startup;
this.Exit += this.Application_Exit;
this.UnhandledException += this.Application_UnhandledException; InitializeComponent();
}
private void Application_Startup(object sender, StartupEventArgs e) {
this.RootVisual = new Page();
}
private void Application_Exit(object sender, EventArgs e){}
private void Application_UnhandledException(object sender, ApplicationUnhandledExceptionEventArgs e) {
if (!System.Diagnostics.Debugger.IsAttached)	{ e.Handled = true; Deployment.Current.Dispatcher.BeginInvoke(delegate{ReportErrorToDOM;});
}
}
private void ReportErrorToDOM(ApplicationUnhandledExceptionEventArgs e) {
try	{
string errorMsg = e.ExceptionObject.Message +	11
e.ExceptionObject.StackTrace;
errorMsg = errorMsg.Replace('"', '\'').Replace("\r\n", @"\n"); System.Windows.Browser.HtmlPage.Window.Eval("throw new Error(\"Unhandled Error in Silverlight 2 Application " + errorMsg + "\");");
}
catch (Exception){}
}
}

MainPage.xaml.cs 

 Collapse | Copy Code

using System;
using System.Windows.Controls;
namespace HelloWorld {
public partial class Page : UserControl {
 public Page() { InitializeComponent();}
 }
}

Create an Event Driven Application

Problem

How to create a simple silverlight application with events?

Solution

This program is meant to give you the next step for creating Silverlight-based applications. From now on we will concentrate only on the Page class (see figure 11.13)which is the visual element. In this example we will also see how to wire up events in a Silverlight User Interface and understand how to add and use resources.

Figure 11.13 A Page is a UserControl.

The Silverlight Rocks program displays a smiley at the point where the user clicks on the User Interface (see figure 11.14) and gives an option to delete them individually or delete them all.

The application is meant to show you the event driven programming in Silverlight. We will look into more detail on Reading XAML and XML files in later chapters. There are two different colored Smiley’s: One added as a Content (smiley.xaml Build Action= Content) and the other as a Resource (smileypink.xaml Build Action=Resource) in the Application.

The first thing to notice in the MainPage.xaml is the LayoutRoot_MouseLeftButtonUp. Every UIElement in Silverlightexposes the following methods for interaction:

• Loaded
• SizeChanged
• Layout Updated
• BindingValidationError

Along with the following events as shown in figure 11.14

Figure 11.14 A UIElement comes with a number of Events for input.

All of these methods can be created dynamically in the code as well as at design time. This means that when the use clicks on the LayoutRoot element (canvas here) the event is fired with the sender object, and MouseButtonEventArgs (see code listing below). The Mouse Event Arguments gives the coordinates is used to position the dynamically created Smiley.

In the Add Smiley method, we randomly select a smiley either from the Content or from the Resource. The difference is Content Smiley is inside the XAP file, the resource Smiley is converted into binary resource and is stored and retrieved from the Resource part of the HelloSilverlight.dll.

Other items of particular note: LayoutRoot.Children.Add and LayoutRoot.Children.Remove method which gives a standard way to add UIElement in the User Interface, and the JavaScript Alert message which is called using HtmlPage.Window.Alert and HtmlPage.Window.Confirm method.

Figure 11.15 Silverlight supports alert boxes. XAML

 Collapse | Copy Code

<UserControl x:class="HelloSilverlightWorld.Page" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" width="600" height="400">
<canvas x:name="LayoutRoot" removed="AliceBlue" mouseleftbuttonup="LayoutRoot_MouseLeftButtonUp">
<textblock x:name="Hello" canvas.left="200" canvas.top="170" fontfamily="Arial" fontsize="24" text="Silverlight Rocks !" foreground="#FF000000">
<textblock x:name="Reset" canvas.left="250" canvas.top="206" fontfamily="Arial" fontsize="12" text="(Click Anywhere)" foreground="#FF000000">
</textblock></textblock></canvas>
</UserControl>

Code

 Collapse | Copy Code

using System;
using System.Windows;
using System.Windows.Controls; using System.Windows.Input; using System.Xml;
using System.Windows.Browser; using System.Windows.Markup; namespace HelloSilverlightWorld{
public partial class Page : UserControl {
bool ResetFlag;
public Page() 
 { InitializeComponent(); }
private void LayoutRoot_MouseLeftButtonUp(object sender, MouseButtonEventArgs e) {
 UIElement s = (UIElement)e.OriginalSource;
 Point MousePosition = e.GetPosition(LayoutRoot); AddSmiley(MousePosition.X,  MousePosition.Y); 
 }
private void Smiley_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
 {
 if (HtmlPage.Window.Confirm("Delete Smiley?"))
 { 
 RemoveSmiley(sender); 
 } 
}
private void Reset_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
 { 
 RemoveAllSmiley();
 }
private void AddSmiley(double x, double y)
 { 
 XmlReader xmlReader ;
 if ((int)x % 2==0) xmlReader = XmlReader.Create("files/smiley.xaml");
 else xmlReader =
  XmlReader.Create("/HelloSilverlight;component/files/smileypink.xaml");
  xmlReader.MoveToContent();
  UIElement MySmiley = (UIElement)XamlReader.Load(xmlReader.ReadOuterXml());
  MySmiley.SetValue(Canvas.TopProperty, y);
  MySmiley.SetValue(Canvas.LeftProperty, x);
  MySmiley.MouseLeftButtonDown += new
   MouseButtonEventHandler(Smiley_MouseLeftButtonUp); 
  LayoutRoot.Children.Add(MySmiley);
  if (!ResetFlag) 
   ResetText(); 
 }
private void ResetText() 
 { 
 ResetFlag = true;	
 Reset.Text = "(Click To Reset)";
 Reset.MouseLeftButtonDown += new
  MouseButtonEventHandler(Reset_MouseLeftButtonUp); 
 }
private void RemoveSmiley(Object sender)
{
 LayoutRoot.Children.Remove((UIElement)sender); 
}
private void RemoveAllSmiley() 
{
 if (HtmlPage.Window.Confirm("Delete All Smiley?")) 
 {
 int TotalCount = LayoutRoot.Children.Count; 
  for (int i = TotalCount - 1; i > 1; i--) 
  { 
  LayoutRoot.Children.RemoveAt(i); 
  }
  ResetFlag = false;	
  Reset.Text = "(Click Anywhere)"; 
  Reset.MouseLeftButtonDown -= new
   MouseButtonEventHandler(Reset_MouseLeftButtonUp); 
  }
 }
}

References

Download:  Pro Silverlight 5 in C#, 4th Edition

Download:  Silverlight 5 in Action

Questions

1.What is Microsoft Silverlight?
• Silverlight is a web based technology, launched by Microsoft in April 2007. Silverlight is considered as a competitor to Adobe's Flash.
• Silverlight is Microsoft's implementation of a cross-browser, cross-platform client framework that allows designers and developers to deliver Rich Internet Applications (RIA) embedded in Web pages.
• Silverlight is a browser plug-in approximately 6 MB in size; it is client-side free software, with an easy and fast (less than 10 sec) one time installation available for any client side browser.
• It supports advanced data integration, multithreading, HD video using IIS Smooth Streaming, and built-in content protection. Silverlight enables online and offline applications for a broad range of business and consumer scenarios.
• One of the design goals of the Silverlight technology is to fill the gap between Windows applications and Web applications in terms of creating Graphical User Interfaces (GUI).
• Silverlight applications are run as client-side applications without the need to refresh the browser to update the UI. However, because of the built-in .NET framework, Silverlight applications can easily integrate with server-side controls and services. Using Silverlight's implementation of the .NET framework, developers can easily integrate existing libraries and code into Silverlight applications.

2. Why use Silverlight?
• Support for the .NET Framework – if you are already a .NET developer, it is easy to start programming on Silverlight.
• Support for managed code – you can write programs in your favorite language which .NET CLR supports like C#, VB.NET, dynamic languages (IronPython, IronRuby).
• Better development tools -Visual Studio 2010, Expression Blend.
• Large community- More learning resources available compared to Flash.
• Integration with Enterprise based technologies like WPF, LINQ etc…
• Silverlight integrates the XAML declarative language with the .NET framework.
• It is a cross-browser, cross-platform technology which provides a consistent user experience everywhere it runs.
• The Silverlight plug-in installs in seconds, and leaves a very small footprint.
• After you install the plug-in, users no longer need to install anything on their workstations to run Silverlight applications. The applications are available to them from whatever browser they are accessing.
• It runs a client-side application that can read data and update the UI without interrupting the user by refreshing the whole page.
• It can run asynchronous communications with the server, allowing the UI to continue to function while waiting for the server response.
• It delivers rich video, audio, and graphics.

3. Which platforms does Silverlight support?
• Mac OS
• Windows Vista
• Windows XP SP2
• Windows 2000
• Windows Server 2003
• Linux (Moonlight)

4. Which browsers does Silverlight support?
• Microsoft - Internet Explorer 6, 7, 8
• Mozilla - Firefox 2 and 3
• Apple - Safari 3 and 4
• Google - Chrome

5. What are the system requirements for Silverlight?
The system requirements for Microsoft Silverlight and associated technologies are listed below.
Windows
• Operating System: Windows 7, Windows Vista, Windows XP Service Pack 2
• Intel® Pentium® III 450 MHz or faster processor (or equivalent)
• 128 MB of RAM
Mac OS
• Operating System: Apple Mac OS X 10.4.8 or above
• Intel Core™ Duo 1.83 GHz or faster processor
• 128 MB of RAM
Linux
• Moonlight

6. What is Moonlight?
Moonlight is an Open Source implementation of Silverlight, primarily for Linux and other Unix based Operating Systems. In September of 2007, Microsoft and Novell announced a technical collaboration that includes access to Microsoft's test suites for Silverlight and the distribution of a Media Pack for Linux users that will contain licensed media codecs for video and audio.
Moonlight 2 was released December 17, 2009

7. What are the goals of Moonlight?
• To run Silverlight applications on Linux.
• To provide a Linux SDK to build Silverlight applications.
• To reuse the Silverlight engine built for desktop applications.

8. Is Silverlight free?
Yes, Microsoft has made the Silverlight browser plug-in freely available for all supported platforms and browsers.

9. What is the difference between Silverlight 1.0 and 2?
• Silverlight 1 is purely AJAX and JavaScript based. All the code has to be written in JavaScript and XAML.
• Silverlight 2 supports managed code. When the Silverlight 2 runtime is installed, it installs a limited version of the .NET runtime on the client machine. This allows .NET programmers to write managed code to be executed on the client PC, and provides a better user experience to users. Of course, there is security restrictions built in to it so that the code has limited access to the client computer.
• The biggest change is the implementation of the .NET Framework. If you are familiar with Silverlight 1.0, then you will be used to coding the application functionality in JavaScript. You can still implement functionality using JavaScript; however, you can now also implement functionality using C#, Visual Basic, Python, Ruby, and managed JavaScript.
• Another major change is the introduction of the XAP package. In Silverlight 1.0, the XAML code was referenced directly by the Silverlight object embedded in the browser. In Silverlight 2, however, the embedded object references an XAP package that contains the XAP file, assemblies, and resources necessary to run the Silverlight application.

10. What is the Silverlight plug-in?
• The Silverlight plug-in is a very lightweight component that is necessary for users to access Silverlight applications. The plug-in download and install takes only a few moments, and do not take up much hard drive space.
• The Silverlight plug-in is responsible for accessing the Silverlight object in the Web page, downloading and accessing the XAP package, setting up the program environment, and beginning execution of the application.
• When a Web page containing a Silverlight application is displayed, the user should be given a link to download the plug-in from Microsoft if the plug-in is not already installed.


11. What is Silverlight Runtime?
Silverlight Runtime is a browser plug-in to support Silverlight enabled applications. If the Silverlight runtime is not installed, browsers will not be able to run Silverlight elements in the browser. You can set up your Silverlight tags in such a way that your browser will automatically prompt the user to download and install the Silverlight plug-in when your application is launched in the browser.
Installing the run time is a onetime operation on the client. Once installed, it will be automatically launched when any Silverlight application is loaded in the browser.
Note: Silverlight plug-in and the runtime, both are the same; however, I am giving two definitions here.


12. What is Silverlight SDK?
Silverlight SDK is a set of tools, documentation, samples, and templates for web developers to enable them to easily develop Silverlight enabled applications. The SDK is not really mandatory to develop Silverlight applications; however, the SDK will make development much easier.

13. What are the tools required to develop Silverlight applications?
To run Silverlight applications in a web browser, you need to have the Silverlight runtime installed on the client browser as a plug-in. This is a light-weight version of the .NET runtime.
However, to develop a Silverlight application, you need something more.
Silverlight SDK: This includes a set of tools required to compile and build Silverlight controls.
If you are comfortable writing HTML using Notepad and compiling .NET applications from console tools, then you just need the Silverlight SDK to develop Silverlight applications.
However, most people use some kind of IDE to develop applications faster.
Microsoft offers two separate tools to develop Silverlight applications:
• Microsoft Expression Studio - This tool is meant for web designers to create rich visual elements for Silverlight applications. Expression Studio is recommended for web designers who create rich internet applications with enhanced visual content and graphics. There are several features provided for creating enhanced graphics elements, with lot of options to pick color, font, etc.
• Microsoft Visual Studio - This is the integrated development environment from Microsoft to develop .NET applications. Programmers can use Visual Studio to develop Silverlight applications which require programming. Visual Studio allows programmers to develop sophisticated Silverlight applications in any .NET language (like C#, VB.NET etc).
Here are some other tools that you can use:
• Install Deep Zoom Composer - This tool allows you to prepare your images for use with the Deep Zoom feature in Silverlight 3.
• Download Silverlight Toolkit - This toolkit is a Microsoft project containing Silverlight controls, components, and utilities that can be downloaded and used in your Silverlight applications. It includes full source code, samples, and tests.
• Download .NET RIA Services - Microsoft .NET RIA Services simplifies the traditional n-tier application pattern by bringing together the ASP.NET and Silverlight platforms. RIA Services provides a pattern to write application logic that runs on the mid-tier and controls access to data for queries, changes, and custom operations.

14. Which tool to use - Expression Studio or Visual Studio?
If your Silverlight application includes just graphics and visual elements, then you can use Expression Studio. However, if you are a programmer and if your Silverlight application includes programming logic, then you might want to choose Visual Studio.

15. What are the Silverlight versions available so far?
• Silverlight 1.0: Silverlight 1.0, which was developed under the code name Windows Presentation Foundation/Everywhere (WPF/E), consists of the core presentation framework which is responsible for the user interface (UI), interactivity, and user input, basic UI controls, graphics and animation, media playback, Digital Restrictions Management (DRM), and DOM integration
• Silverlight 2: Silverlight 2 (previously referred to as version 1.1) includes a version of the .NET Framework, implementing the same full Common Language Runtime (CLR) version as .NET Framework 3.0. The XAML markup as well as the code is compiled into .NET assemblies which are then compressed using Zip and stored in a .xap file.
• Silverlight 3: Silverlight version 3 was released in July 9, 2009, which is an extension to Silverlight 2.0, and mainly provides improvements in graphics capabilities, media management, application development areas (additional controls, enhanced binding support, and out-of-browser functionality), and integration in the designers' Expression Blend 3 tools.
• Silverlight 4: Silverlight version 4 was released on April 15, 2010 (along with Silverlight 4 tools for developers).

16. What is a .xap file?
A .xap file is a Silverlight-based application package (.xap) that is generated when the Silverlight project is built. A .xap file is the compressed output file for a Silverlight application. The .xap file includes AppManifest.xaml, the compiled output assembly of the Silverlight project (.dll), and the resource files referred to by the Silverlight application:
• Web pages like .aspx files and .html files use Silverlight components by loading .xap files using the tag in HTML or by using the tag in ASP.NET pages.
• ".xap" files (pronounced "zap") use the standard Zip compression algorithm to minimize client download size. Rename this file to SilverlightTest.zip and open it using any decompression tool. You can see that this is just like any other zip file, and it includes the project's output DLL and another file called "AppManifest.xaml".

17. How does XAP work?
Once you have created the .xap file , the Silverlight 2 plug-in downloads the file and runs it in a separate work space.

18. How do I use a .xap file?
A .xap file is used to contain and transfer the assemblies and resources of a managed code application. This managed code application must be run within the Silverlight 2 browser plug-in.

19. Can we add a reference to a Class Library project in a Silverlight application project?
No, you can't add a reference to a Class Library project to a Silverlight application project. You can only add the reference of another Silverlight application project inside a Silverlight application project. However, you can add a reference to a Web Service or WCF Service.

20. What is a Silverlight.js file?
Silverlight.js is a helper file which enables websites to create advanced Silverlight installation and instantiation experiences. You can call the createObject and createObjectEx functions defined in this file to embed the Silverlight plug-in in a web page.

21. What is the use of the ClientBin folder?
The ClientBin folder is used to place the .xap file of a Silverlight application. You can keep it anywhere in your web application, but this is the default location used by Silverlight.

22. How to change the default page of a Silverlight application?
To change the default page of a Silverlight application, you need to set the RootVisual property inside the Application_Startup event of the App.xaml file. Collapse private void Application_Startup(object sender, StartupEventArgs e) { this.RootVisual = new MainPage(); }

23. What is XAML?
XAML stands for eXtended Application Markup Language. XAML contains XML that is used to declaratively specify the user interface for Silverlight or WPF applications. For example, if you need to display a rectangle, this is the XAML you need to use.

XAML stands for eXtensible Application Markup Language, and is a declarative markup language that follows the XML rule and is used for developing User Interfaces in WPF and Silverlight technology. XAML files are XML files that generally have the .xaml extension, and separates the UI definition from the run-time logic by using code-behind files, joined to the markup through partial class definitions. XAML has a set of rules that map object elements into classes or structures, attributes into properties or events, and XML namespaces to CLR namespaces. XAML elements map to Microsoft .NET types as defined in referenced assemblies, and the attributes map to members of those types.

24. What is the AppManifest.xml file?
First, let’s look at an example AppManifest.xaml file: Collapse The first element in AppManifest.xaml is a Deployment node. This node defines the application, and contains the child AssemblyPart nodes. As you can see the AssemblyPart nodes define what assemblies (DLLs) are contained within the .xap file, and give each of them a name. Now, if you look back up to the top, you'll see the Deployment node has the EntryPointAssembly and EntryPointType attributes. The EntryPointAssembly attribute defines which assembly defined below (as a child AssemblyPart node) is the main assembly (DLL) for the application. And, the EntryPointType attribute specifies the class contained within the assembly (DLL), defined in the EntryPointAssembly attribute, is the main class that will be instantiated to start the application. The Deployment node also has a RuntimeVersion attribute that defines the version of Silverlight the application is built for.

25. What files are contained within the .xap file?
The .xap file contains an application manifest (AppManifest.xaml) file and all the necessary DLLs that are required by the application. The first DLL contained is the compiled version of your application and has the same name of your application. In my test, I created an application named "SilverlightApplication1", so the DLL is named "SilverlightApplication1.dll". The rest of the DLLs are the dependencies the application requires.

26. What is app.xaml?
App.xaml is a file used by Silverlight applications to declare shared resources like brushes, various style objects, templates etc. Also, the code-behind file of app.xaml.cs is used to handle global application level events like Application_Startup, Application_Exit, and Application_UnhandledException (similar to the Global.asax file for ASP.NET applications). When Visual Studio creates the app.xaml file automatically, it creates a few event handlers with some default code. You can change the code appropriately. Collapse private void Application_Startup(object sender, StartupEventArgs e) { } private void Application_Exit(object sender, EventArgs e) { } private void Application_UnhandledException(object sender, ApplicationUnhandledExceptionEventArgs e) { } For ASP.NET developers, the above code will look familiar. This is similar to the application level event handlers in Global.asax.

27. What is the Silverlight official name?
Silverlight was formerly code-named "WPF/E".

28. What are the main features and benefits of Silverlight?
• Compelling cross-platform user experiences.
• Flexible programming model with collaboration tools.
• High-quality media, low-cost delivery.
• Connected to data, servers, and services.

29. What is MainPage.xaml?
When you create a Silverlight project using Visual Studio, it creates a default XAML file called "MainPage.xaml". This is just a dummy start page created by Visual Studio, and it does not contain any visible UI elements. The default contents of the MainPage.xaml file looks like this: Collapse

30. Which language is Silverlight developed in?
It was developed using a combination of C# and C++.

31. Can I consume WCF and ASP.NET Web Services in Silverlight?
Yes, you can.

32. What are Deep Zoom and Deep Zoom Composer?
Deep Zoom provides the ability to interactively view high-resolution images in Silverlight. You can zoom in and out of images rapidly without affecting the performance of your application. Deep Zoom provides smooth in-place zooming and panning. DeepZoom Composer allows you to create high resolution image compositions which are built for smooth zooming and panning. DeepZoom Composer is absolutely free, and is simple to use - just loads in all your high resolution images and makes your composition on screen. Deep Zoom Composer is a tool that allows preparing of images for use with the Deep Zoom feature in Silverlight 3.

33. What is the difference between WPF and Silverlight?
Silverlight and Windows Presentation Foundation (WPF) are two different products from Microsoft, but have lot of overlap. Silverlight is a subset of WPF in terms of features and functionality. Silverlight is a Microsoft technology, competing with Adobe's Flash, and is meant for developing rich browser based internet applications. WPF is a Microsoft technology meant for developing enhanced graphics applications for the desktop platform. In addition, WPF applications can be hosted on web browsers which offer rich graphics features for web applications. Web Browser Applications (WBA) developed on the WPF technology uses XAML to host user interfaces for browser applications. XAML stands for eXtended Application Markup Language, which is a new declarative programming model from Microsoft. XAML files are hosted as discrete files in the Web server, but are downloaded to the browsers and converted to a user interface by the .NET runtime in the client browsers. WPF runs on the .NET runtime, and developers can take advantage of the rich .NET Framework and WPF libraries to build really cool Windows applications. WPF supports 3-D graphics, complex animations, hardware acceleration etc. Silverlight uses a particular implementation of a XAML parser, with that parser being part of the Silverlight core installation. In some cases, the parsing behavior differs from the parsing behavior in Windows Presentation Foundation (WPF), which also has a particular implementation. In table format: Silverlight WPF Definition Silverlight is Microsoft’s latest development platform for building next-generation Web client applications. Windows Presentation Foundation (WPF) is Microsoft’s latest development platform for building next-generation Windows client applications. Subset of Silverlight is generally considered to be a subset of WPF, and is a XAML-based technology that runs within the sandbox of a browser plug-in. WPF is generally considered to be a subset of .NET Framework, and is a XAML based technology. GUI Silverlight will be used in the development of Rich Internet Applications (RIA) for web client users. WPF will be used in the development of Rich Windows Graphical User Interfaces (GUI) for Windows client users. Support Cross OS, cross browser, cross device. Windows only. Software Required Silverlight is the add-on mechanism available for most browsers; in order to run Silverlight applications at client machines, we need to install Silverlight software on the client machine once. WPF, on the other hand, does not support any plug-in mechanism; instead, we need to install a completed WPF client application in order to use the WPF application at the client place. Framework support Silverlight has a very small, its own rich base class library to make the plug-in as small as possible. It is highly optimized for size, and is a small subset of the full .NET Framework, to be embedded within an application. WPF, on the other hand, has full access to the main .NET Framework and all its associated assemblies. Deployment Silverlight applications are hosted within a web server and a web page. To minimize client download size, Silverlight uses a XAP archive. A XAP archive is a zip-compressed archive of the Silverlight application, plus a manifest file describing the content. Visual Studio automatically generates the XAP archive when using the Silverlight project template. WPF applications can be deployed as standalone applications, ClickOnce applications, or XAML browser applications.

34. What is the difference between Silverlight and Flash?
Adobe Flash is the most popular competitor to Silverlight, supporting browser plug-ins and enabling the execution of rich content for the Web. Flash is not a new technology, and already has had a long life span as compared to Silverlight. But it does not have a huge community as expected; it may be because of the limited development tools which are not known to most developers. Flash uses ActionScript as the programming language and Flex as the programming environment, and most developers are far from these technologies. For ASP.NET developers, to extend their websites using Flash content is not so simple. They need to learn a development environment like ActionScript and Flex. Apart from that, there is no way to generate Flash content using server-side .NET code, which means it’s difficult to integrate ASP.NET content and Flash content. Silverlight aims to give .NET developers a better option for creating rich web content. Silverlight provides a browser plug-in with many similar features to Flash, but one that’s designed from the ground up for .NET. Silverlight natively supports the C# language, and uses a range of .NET concepts. As a result, developers can write client-side code for Silverlight in the same language they use for server-side code (such as C# and VB), and use many of the same abstractions (including streams, controls, collections, generics, and LINQ).

35. What is the difference between Silverlight and ASP.NET AJAX?
Microsoft ASP.NET AJAX, a set of JavaScript libraries built into ASP.NET 3.5, is available as a separate download for ASP.NET 2.0. Being an integral part of ASP.NET 3.5 and the AJAX Controls Toolkit for ASP.NET 3.5, now ASP.NET AJAX client-and server-side libraries are more integrated with Visual Studio 2008. The client-side library allows you to implement client-level processing such as processing and validating information entered by the end user, refreshing a portion of the web page, and developing rich, interactive user interfaces. You can also efficiently integrate the client-side library components with the server-side ASP.NET controls library in asynchronous mode. The key technology driver of ASP.NET AJAX is scripting. In general, script-based web applications face several challenges due to different browser settings (e.g., JavaScript is not enabled by default) on PCs and mobile devices. As a result, scripting is often not always the best strategy for enterprises to use to develop secure and scalable RIAs. ASP.NET AJAX supports limited features of RIAs, and does not support effective multimedia integration, managed code-behind integration, or metadata and information management. Microsoft ASP.NET AJAX is a widely accepted model for building RIAs, but it is very likely that, having Silverlight as an option, .NET developers will migrate ASP.NET AJAX applications to Silverlight RIAs.

36. What are the different Layout controls available in Silverlight?
There are three different types of Layout controls provided by Silverlight:
• Canvas - Position child elements absolutely in x, y space.
• StackPanel - Position child elements relative to one another in horizontal or vertical stacks.
• Grid - Position child elements in rows and columns. You have to add a layout panel to every XAML page you create. All other UI elements must be added inside one of the layout panels. Each page can have exactly one layout panel control.

37. Are XAML files compiled or built at runtime?
XAML files are usually compiled rather than parsed at runtime. But it also supports parsing during runtime. When we build a XAML based project, you will see it creates a g.cs extension in the obi\Debug folder. Therefore, for every XAML file, you will find a g.cs file. For instance, a MainPage.XAML will have a MainPage.g.cs file in the obi\Debug folder. In short, at run time, you actually do not see the XAML file. But if you want to do runtime parsing of the XAML file, it also allows that to be done.

38. What is the long-term goal or vision for Silverlight?
• Microsoft Silverlight is a cross-browser, cross-platform, and cross-device plug-in for delivering the next generation of .NET based media experiences and rich interactive applications for the Web.
• Silverlight offers a flexible programming model that supports AJAX, VB, C#, IronPython, and IronRuby, and integrates with existing Web applications.
• By using Expression Studio and Visual Studio, designers and developers can collaborate more effectively using the skills they have today to light up the Web of tomorrow.
• By leveraging Silverlight's support for .NET, High Definition video, cost-effective advanced streaming, unparalleled high-resolution interactivity with Deep Zoom technology, and controls, businesses can reach out to new markets across the Web, desktop, and devices.

39. Do I need to have the .NET Framework installed in order to use Silverlight?
The answer to this is no - a cross platform version of the .NET Framework is included in the 6 MB Silverlight 4 download, which means you do not need to have anything extra installed on the client in order to access Silverlight applications in the browser. The Silverlight version of the .NET framework includes the same CLR engine (same GC, type-system, JIT engine) that ships with the full .NET Framework, and a subset of the .NET Framework namespace libraries. You can see the full list of all classes/namespaces that are included by opening up the Object Browser when you create a new Silverlight application using Visual Studio.

40. What are the other RIA technologies besides Silverlight?
Adobe Flex, Java FX, Adobe Flash are some of the other RIA technologies besides Silverlight.