Ok, let’s take a look at the different types of Silverlight applications that you can create out-of-the-box with Visual Studio 2010. Now that I’ve installed Visual Studio 2010 and Silverlight 4, I want to take a quick spin through each of the different project types that the New Project wizard makes available.
After firing up Visual Studio 2010, I click on the New Project link and then select the Silverlight project type under C#. Here’s the default list that I see:
- Silverlight Application
- Silverlight Navigation Application
- Silverlight Class Library
- Silverlight Business Application
- WCF RIA Services Class Library
- Silverlight Unit Test Application
I’d like to take a quick look at each project type, looking at the pieces that make up the project and then thinking a little bit about when to use that particular project type. As I walk through the various project types, I’d also like to think a little bit about the ecosystem in which the Silverlight application lives. In other words, what other components might you typically create when designing a solution of that type?
I also want to think a little bit about the tooling. What tools would you typically use to work on the project that you’re creating? Would Visual Studio 2010 alone be sufficient? Or would you spend a lot of time working in Blend? What about SQL Server 2008?
The Silverlight Application
The first project type—the Silverlight Application—looks like it might be the same thing that I created with Visual Studio 2008 and Silverlight 2, back in the Hello Silverlight World, Part 1 post.
The New Application dialog that we see next is very similar to what I saw with Visual Studio 2008 and Silverlight 2. As before, we have to host our Silverlight application somewhere.
Notice that this time we have one additional project type that we didn’t have before—an ASP.NET MVC Web Project. So we can basically go with a “classic” ASP.NET web site or an MVC web site.
The default is to host Silverlight in a new ASP.NET web application project. But if I uncheck the first checkbox, I get a simple Silverlight project with no containing web site:
If you go this route and then press F5 to “run” your Silverlight application, Visual Studio will just create a test .html page in which to host your Silverlight control.
If you take a look at this page, you’ll see a simple HTML page with a familiar <object> tag hosting the Silverlight control. (See my post on the Lifecycle of a Silverlight Control for more details on how this is done).
If we instead go with the defaults on the New Silverlight Application dialog (host the Silverlight Application in a new ASP.NET Web Application project), we end up with a simple ASP.NET project that contains both .html and .aspx pages hosting the new Silverlight control.
In either case, .html or .aspx, your Silverlight application is embedded in the web page
<div id="silverlightControlHost"> <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%"> <param name="source" value="ClientBin/SLApp1.xap"/> <param name="onError" value="onSilverlightError" /> <param name="background" value="white" /> <param name="minRuntimeVersion" value="4.0.41108.0" /> <param name="autoUpgrade" value="true" /> <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.41108.0" style="text-decoration:none"> <img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/> </a> </object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe></div>
As I describedin The Lifecycle of a Silverlight Control, this <div> tag embeds your Silverlight application (control) into a web page using the application/x-silverlight-2 MIME type. This MIME type now maps to the AgControl.AgControl.4.0 class, implemented in npctrl.dll, which can be found in C:\Program Files\Microsoft Silverlight\4.0.41108.0.
Visually, the pieces of the puzzle look like this (from MSDN article on Silverlight 4.0 Application Services):
So as before, a Silverlight application is managed code that runs in the context of a browser plugin. Here’s how things work when your browser renders a page containing a Silverlight control:
- Browser renders HTML from .html page (or generated HTML from ASP.NET page)
- Browser sees <object> tag for application/x-silverlight-2 MIME type and fires up the Silverlight plug-in
- Silverlight plug-in loads the Silverlight core services
- Silverlight plug-in loads the Silverlight CLR, which creates an AppDomain for your application
- .xap file containing your Silverlight application is downloaded from the server
- Your application manifest is loaded/read (from AppManifest.xaml, in .xap)
- Your main Silverlight application DLL is loaded (from .xap)
- Silverlight CLR instantiates your Application object and fires its Startup event
- Your application’s Startup event creates a new instance of your main page (a Silverlight UserControl)
- Your main page (e.g. MainPage in wizard-generated project) renders itself by reading/loading its .xaml file
Voila. At the end of all this, you get a Silverlight Application rendered in an ASP.NET web page. In our case, having generated everything using the Project Wizard, we can just press F5 to run the application–launching a browser window and loading your auto-generated ASP.NET page. It looks like this (the Silverlight application has the green background):
The XAP Payload
One final topic to cover quickly is–what exactly does the downloaded .xap file contain? In our wizard-generated test project, you’ll find a ClientBin directory, which contains the compiled Silverlight application in a .xap file. In our case, it’s named SLApp1.xap.
If you just rename the .xap file as SLApp1.zip and double-click on it, you can see what it contains:
The main pieces here are the application manifest, which tells the Silverlight runtime what object to start up first, and the assembly in which that object lives. The .xap file also contains the assembly (SLApp1.dll) that contains our actual code.
The .xap file also contains some dependent DLLs, which are sent down to the client as part of the .xap package.
That’s all there is to a basic Silverlight Application. Next time, I’ll take a look at the Silverlight Navigation Application, which lets us create a complete Silverlight application with multiple pages, rather than a single user control.