Create Silverlight Project

We'll start the tutorial by creating a project for a web application that spins in a browser and requires a Silverlight plugin.

1) Install SDK

The Silverlight SDK contains an English tutorial and documentation. The first step is to download and install it. See Silverlight website and download page for instructions.
Once installed, browsers can browse web pages with a rich graphical interface.

2) Create a directory

For example, c :\demo, where your project will be located.

3) Copy script

The initialization script can be found at:

Program Files/Microsoft Silverlight 1.0 SDK/Tools/Silverlight.js/Silverlight.js

Copy it to the directory you just created. This script checks if the system supports XAML.
Perhaps you can take the localized version in French in the subcategory "localized."

4) Create a web page.

To use SampleHTMLpage.html in the Quickstarts\quickstart\samples\directory , but any page created by, for example, FreeOffice is suitable. The example here is called mapage.html.

5) Insert script

The script is inserted into the web page with the following line between the <head> and </head> tags:

<script type="text/javascript" src="Silverlight.js"></script>

This is already done in the mapage.html file, which is linked above.

You can also add a line for your own script:

<script type="text/javascript" src="monscript.js"></script>

6) Create an ActiveX object

XAML is inserted into the page as an ActiveX control. This requires a container, usually a <div> tag and initialization code. You can actually create multiple controls, that is, multiple container/initializer pairs.
In practice, you create an ActiveX control by adding a line on a web page between the <body> and </body> tags:

<!-- Where the Silverlight plugin will go-->
<div id="monControle">
</div>

7) Configure ActiveX object in createSilverlight.js

Insert the code below after the previous line .

<script type="text/javascript">

 Silverlight.createObject(
     "monxaml.xaml", 
     parentElement, 
     "monControleID", 
    { 
         width:'300', 
         height:'300', 
         inplaceInstallPrompt:false,
         background:'#D6D6D6', 
         isWindowless:'false', 
         framerate:'24', 
         version:'0.9' 
    },
   {
        onError:null, 
       onLoad:null 
    },
    null 
 ); 

</script>

Description of components:

Silverlight.createObject (): Creating Silverlight ActiveX control.
monxaml.xaml: This is the name of the source file containing the XAML code. You can change that name, of course.
parentElement: The name in the template document object (on the page) of the control being created to access it with DOM functions.
monControlID: Unique identifier of the control> ActiveX created.
width: 300: The width of the control followed by the height.
inplaceInstallPrompt: false: Indicates whether a message is displayed when an incorrect version is detected. "false" for silent mode, "true" for displaying messages.
background: # D6D6D6: Background color with hexadecimal sequence of RGB codes.
isWinsdowless: false: Indicates whether the control is displayed without a window. If there is a window, assign "false" if not "true."
framerate: 30: Number of views per second.
version:" 1.0: Silverlight version number. This guide uses version 1.0.
onerror: null: The name of the error event handler, or null if not used.
onload: null: The name of the event handler to run on load, or null if none exists.
zero: The name of the event handler for the context .

8) Create source XAML file

This is a simple text file, the name of which, as we saw above, will be monxaml.xaml.
If you did not use another name as an initialization parameter...

The structure of the XAML file for Silverlight is as follows:

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

You now have the following files:

mapage.html
Silverlight.js
monscart.js (optional)
monxaml.xaml

Your Silverlight XAML project is complete. It remains to add the code, and this will be the next step.