Tuesday, February 17, 2009

My First Silverlight Application

After reading about Silverlight Overview and Silverlight for ASP.NET developers, I hope you got the basic idea about Silverlight and You must be bored enough without doing any implementation and also excited to create something in Silverlight to get an idea how it works, how to create our first "Hello World!!!" application using Silverlight, how it is different from ASP.NET application.



Basic Requirements to create Silverlight Application
  1. Install Visual Studio 2008

  2. Install Visual Studio 2008 SP1 or .NET Framework 3.5 SP1

  3. Install Silverlight Tools for Visual Studio 2008 SP1

Now you are ready to create your first Silverlight Application.

Following are the steps you need to follow.

Step 1: Open your Visual Studio 2008 IDE

Step 2: Open File Menu - > New - > Project



Step 3: Select your choice of Language and select Silvelight in Project Type and select Silverlight Application in Templates. Select Location of your Silverlight Application and in Name box type "HelloWorld" and click OK.


Step 4: It will ask you for options about hosting silverlight application. We need a webpage (it can be html, asp, aspx, php, or any supported webpage) to host our silverlight application. Please select "Add a new ASP.NET Web project to the solution to host Silverlight." Select "ASP.NET Web Application Project" in Project Type drop down and Type Name "HelloWorld.Web". (These all are defaults.) Click on OK.


Step 5: Visual Studio will do some processing and open following screen. If Page.xaml is not open by default, open Solution Explorer and open Page.xaml.

Step 6: We will add some text in our page. Inside the "Grid" tag type following.

<TextBlock>
Hello, My first step to the world of Silverlight.
</TextBlock>

Step 7: Press F5 to run your application. You can see the output in your default browser.

Visual Studio manage lot of things for us, that we need to know.

1. Your startup project is the Web Application, which hosts your Silverlight Application.

2. It creates a space at client side to run the silverlight application. You will find ClientBin folder in your web application.

3. You can find .xap file, which is nothing but the compressed file that contains all dlls required to run your silverlight application. (Rename your .xap file to .zip and uncompress this file to view the contents. You will find all components of your silverlight application.)

4. Open your "HelloWorldTestPage.aspx" and "HelloWorldTestPage.html" and see how we can host silverlight control in aspx page and html page.

Congaratulations!!!! You started working with Silverlight. In next article we will see more about Silverlight Architecture and after that we will continue with different examples with Silverlight.