The Silverlight Hello World Example
So enough with the news and opinion that is Silverlight this week, let's do some coding. I thought I would start with the basics, the traditional Hello World example. The first thing you need to do is install Visual Studio Orcas, then install the Silverlight tools for Orcas to add the Silverlight projects. This project is done in Silverlight 1.1 so you will need it installed on your machine as well.
After opening Visual Studio Orcas you will need to create a new project, I chose 'Silverlight Project'. This will create a base project with a XAML, HTML and JavaScript file.
The next step was to add a TextBlock element to my XAML. Since Visual Studio Orcas only gives you the source view for XAML you will need to type this yourself. I then set several attributes to specify the text, it's font characteristics and location on the page. In this case I set the Text properrty to 'Hello World' and the font to a large navy color offset by 50 characters to the X and Y axis.
Before you launch the application let's examine the HTML file to get an idea how this will be rendered to the browser. Notice in the header of the markup there are two script files being referenced; Silverlight.js and TestPage.html.js. The Silverlight.js contains the JavaScript to embed the Silverlight control for the particular browser being used and also checks to see if Silverlight has been installed. If Silverlight is not installed, it will display a nice looking graphic
asking the user to install it on their computer. The code automatically takes the user to the approperiate page on the Microsoft site to download the run-time.
The Testpage.html.jp is a JavaScript file with one function, createSilverlight. This JavaScript method opens the XAML file in the project and loads it into a Silverlight object and writes the HTML for the Silverlight object ot the page.
To see the example run, hit F5 and it will launch the HTML page in the browser and you will see Hello World on the page.
This is pretty simple, but we all have to start somewhere. Look for more great Silverlight examples to come soon.