Feeds

Get started with Silverlight

A time to shine

HP ProLiant Gen8: Integrated lifecycle automation

The basics

Whichever platform you use to develop, you'll need to install the Silverlight 1.0 runtime for your browser. If you visit a site that uses Silverlight, and you don't yet have the Silverlight runtime installed, you'll be directed to an installation process. The runtime is surprisingly small (less than 2MB). The Silverlight home page lets you install the plug-in and see demonstrations. The Microsoft Silverlight 1.0 Software Development Kit (SDK) is available along with other resources for Windows from MSDN.

A Silverlight application typically consists of XAML markup and JavaScript code. You also need an HTML file to call the application. We'll start with four files:

  • Default.html – the HTML page containing the Silverlight content
  • Silverlight.js – the Microsoft provided runtime file
  • CreateSilverlight.js – some JavaScript that you provide to start your application
  • Scene.xaml – some XAML describing your desired Silverlight content

The HTML contains references to the JavaScript files, provides a DIV tag to host the Silverlight control and then calls the JavaScript code to start the Silverlight content:

<!DOCTYPE html PUBLIC
  "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

The Silverlight.js file is a standard file, distributed as part of the Microsoft Silverlight 1.0 SDK and widely available elsewhere on the Web.

The CreateSilverlight.js file defines the createSilverlight() function that is called from the HTML. It finds the DIV tag that will host the Silverlight control and provides the glue to load and start your XAML content (defined in Scene.xaml).

function createSilverlight()
{  
        Silverlight.createObjectEx({
                source: 'Scene.xaml',
                parentElement: document.getElementById('SilverlightPlugInHost'),
                id: 'SilverlightPlugIn',
                properties: {
                        width: '400',
                        height: '400',
                        background:'#ffffff',
            isWindowless: 'false',
                        version: '1.0'
                },
                events: {
                    onError: null,
                        onLoad: null
                },              
                context: null 
        });
}

All the magic happens in Scene.xaml – this is where we define our Hello World application.

<Canvas xmlns="http://schemas.microsoft.com/client/2007" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

        <TextBlock FontFamily="Times New Roman" 
                           FontSize="70" 
                           FontStyle="Italic" 
                           Foreground="Red"   
                           Text="Hello World" />

</Canvas>

I'll explain the thinking behind XAML in a moment, but for now save these four files to a new directory and load the HTML into your browser. If you are running locally, your browser may warn you about Active X controls and block the content (this isn't the case when you run from a web server). Unblocking should give you a page like this:

Top three mobile application threats

Next page: XAML and Microsoft

More from The Register

next story
HIDDEN packet sniffer spy tech in MILLIONS of iPhones, iPads – expert
Don't panic though – Apple's backdoor is not wide open to all, guru tells us
Apple fanbois SCREAM as update BRICKS their Macbook Airs
Ragegasm spills over as firmware upgrade kills machines
NO MORE ALL CAPS and other pleasures of Visual Studio 14
Unpicking a packed preview that breaks down ASP.NET
Captain Kirk sets phaser to SLAUGHTER after trying new Facebook app
William Shatner less-than-impressed by Zuck's celebrity-only app
Do YOU work at Microsoft? Um. Are you SURE about that?
Nokia and marketing types first to get the bullet, says report
Microsoft takes on Chromebook with low-cost Windows laptops
Redmond's chief salesman: We're taking 'hard' decisions
Cheer up, Nokia fans. It can start making mobes again in 18 months
The real winner of the Nokia sale is *drumroll* ... Nokia
prev story

Whitepapers

Designing a Defense for Mobile Applications
Learn about the various considerations for defending mobile applications - from the application architecture itself to the myriad testing technologies.
How modern custom applications can spur business growth
Learn how to create, deploy and manage custom applications without consuming or expanding the need for scarce, expensive IT resources.
Reducing security risks from open source software
Follow a few strategies and your organization can gain the full benefits of open source and the cloud without compromising the security of your applications.
Boost IT visibility and business value
How building a great service catalog relieves pressure points and demonstrates the value of IT service management.
Consolidation: the foundation for IT and business transformation
In this whitepaper learn how effective consolidation of IT and business resources can enable multiple, meaningful business benefits.