Share via

Source Property (Silverlight Plug-in)

  • Article

Specifies the XAML content to render.

Scripting (Instantiation)
Silverlight.CreateObject('sourceReference')

-or-

Silverlight.CreateObjectEx({source:'sourceReference'})
Scripting (Runtime)
value = silverlightObject.Source
silverlightObject.Source = value

Property Value

string

The URI of the XAML file or XAML scripting tag that contains the content to load into the Silverlight plug-in. Generally, this is a reference to a XAML file. The URI can also be an inline XAML reference using the "#" prefix; see Remarks.

This property is read/write. The default value is null.

Remarks

For more information on using JavaScript helper files for initializing and creating Silverlight plug-ins on a Web page, see Instantiating a Silverlight Plug-in (Using CreateSilverlight.js and Silverlight.js).

Changing the Source value at runtime is permitted. In terms of performance in Silverlight version 1.0, this operation is equivalent to unloading and reloading the Silverlight plug-in. In some cases it may be better performance-wise to instead use CreateFromXaml and rebuild the object tree below the original root than it is to reset Source.

The string provided for the Source property is interpreted as a Uniform Resource Identifier (URI). This is in contrast to an Internationalized Resource Identifier (IRI). This distinction means that characters used to identify a Source that are outside of US-ASCII will need to be encoded.

The URI for Source cannot be set to a URI that is not from the site of origin of the HTML page that hosts the Silverlight plug-in instance. In general, this means that you should only use relative references to specify a Source URI.

The prefix '#' in the string is used to identify a Source that references inline XAML. See Using Inline XAML as the XAML Source (that topic includes an example of inline XAML usage).

Examples

The following JavaScript example of a modified CreateSilverlight.js file shows how to load a XAML file by setting the source initialization parameter to the name of the XAML file, "HelloWorld.xaml":

JavaScript 
function createSilverlight()
{  
    Sys.Silverlight.createObject(
        "HelloWorld.xaml",                  // Source property value.
        parentElement,                      // DOM reference to hosting DIV tag.
        "myPlugin",                        // Unique plug-in id value.
        {                                   // Plug-in properties.
            width:'1024',                   // Width of rectangular region of plug-in in pixels.
            height:'530',                   // Height of rectangular region of plug-in in pixels.
            inplaceInstallPrompt:false,      // Determines whether to display verbose install prompt if invalid version detected.
            background:'OldLace',           // Background color of plug-in.
            isWindowless:'true',            // Determines whether to display plug-in in Windowless mode.
            framerate:'30',                 // MaxFrameRate property value.
            version:'1.0'                   // Plug-in version to use.
        },
        {
            onError:null,                   // OnError property value -- event handler function name.
            onLoad:onLoad                   // OnLoad property value -- event handler function name.
        },
        null);                              // Context value -- event handler function name.
}

Notice that when the Source property or source parameter value refers to a file reference, it is set to the directory location of the XAML file relative to the HTML file.

The following XAML example shows the XAML content that corresponds to the file referenced by the Source property value in the previous HTML example.

XAML 
<!-- HelloWorld.xaml -->
<Canvas
  xmlns="https://schemas.microsoft.com/client/2007">
  <TextBlock
    Foreground="Maroon" FontFamily="Verdana" FontSize="24" FontWeight="Bold"
    Text="Hello, world" />
</Canvas>

Loading XAML Using the Source Property at Run Time

You can also use the Source property to load XAML content after the Silverlight plug-in has been created. When you reload XAML content, the existing XAML content is the plug-in is no longer valid. The following JavaScript example shows an event handler function that reloads the XAML content.

JavaScript 
// Event handling function for reloading the XAML content on the page.
function reloadContent(plugin)
{
    // Define the XAML content.
    plugin.source = "HelloWorld.xaml";
}

Note   The XAML content renders immediately when setting the Source property.

Applies To

Silverlight Plug-in

See Also

Silverlight Object Models and Scripting to the Silverlight Plug-in
Instantiating a Silverlight Plug-in (Using CreateSilverlight.js and Silverlight.js)
Using Inline XAML as the XAML Source
Using the createFromXaml Method