part 2: create a Silverlight XAML file

In the previous document, create a Silverlight project, you added a Silverlight control to an HTML page and created a blank XAML file. This document shows you how to begin creating Silverlight content inside your XAML file.

step 1: create a Canvas and namespace declarations
step 2: draw something!
step 3: view your XAML content
what's next?

step 1: create a Canvas and namespace declarations

Open the myxaml.xaml XAML file you created in the previous step, create a Silverlight project. Create a Canvas and the Silverlight and XAML namespace declarations by copying the following markup into your XAML file.

[hide XAML]

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

</Canvas>

Each Silverlight XAML file begins with a <Canvas> tag that contains the Silverlight namespace declaration and an xmlns attribute that declares the Silverlight namespace together with an xmlns:x attribute that declares the XAML namespace.

step 2: draw something!

Copy and paste the following code into your XAML file, between the <Canvas> tags, and save the file.

 <Ellipse
    Height="200" Width="200"
    Stroke="Black" StrokeThickness="10" Fill="SlateBlue" />

step 3: view your XAML content

To view your XAML content, double-click the hosting HTML file. You should see a slate-blue colored circle with a black border.

[hide XAML]

<Canvas
   xmlns="http://schemas.microsoft.com/client/2007"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    
  <Ellipse 
     Height="200" Width="200"
     Stroke="Black" StrokeThickness="10" Fill="SlateBlue" />
</Canvas>

[hide] [restart]

Note that, if you have WPF installed, double-clicking on a XAML file will launch WPF, not Silverlight.

Congratulations! You just created your first Silverlight project!

what's next?

The next topic, the Canvas object, describes the Canvas object in more detail.