Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>It is still possible, though the experience is very different. You must load an initial Root visual element via a source property on the Silverlight object referencing a XAML file on the server, but after that you have full access to the visual tree via javascript.</p> <p>The below Test.html and Root.xaml files together will produce a testable page if placed in the same folder.</p> <p>Note the differences from a "standard" (i.e. *.xap source) scenario - the 'source' parameter on the SL object tag is set to a .XAML file instead of a .XAP file. The .XAML file is also different from what you would get in a default SL application in VS: the x:Class="MyApp.MainPage" is missing from the root element, and the root element is a Grid (or any Visual element) instead of a UserControl element. This is because there is no application (at least not loaded from the .XAP - I assume the SL control actually creates a default application instance in the process of loading the Root.XAML file), and no UserControl because there is no code-behind. This is consistent with the Pre-SL1.1/2.0 experience of no UserControls.</p> <p>Additionally, you will need to reference <a href="http://msdn.microsoft.com/en-us/library/bb979679%28v=VS.95%29.aspx" rel="nofollow">Javascript API for Silverlight Reference</a> in your javascript coding. Have fun with the FindName method and/or walking the Visual Tree! Those are the only ways to get references to any visual objects to manipulate from your code!</p> <p>Test.html</p> <pre><code>&lt;html&gt; &lt;body&gt; &lt;object id="slObject" data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="400" height="300"&gt; &lt;param name="source" value="Root.xaml"/&gt; &lt;param name="onError" value="onSilverlightError" /&gt; &lt;param name="background" value="white" /&gt; &lt;param name="minRuntimeVersion" value="4.0.50826.0" /&gt; &lt;param name="autoUpgrade" value="true" /&gt; &lt;a href="http://go.microsoft.com/fwlink/?LinkID=149156&amp;v=4.0.50826.0" style="text-decoration:none"&gt; &lt;img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/&gt; &lt;/a&gt; &lt;/object&gt; &lt;input type="button" onclick="sayGoodBye();" value="Say Goodbye, Silverlight!" /&gt; &lt;script&gt; function sayGoodBye() { var slObject = document.getElementById('slObject'); var slContent = slObject.Content; var layoutRoot = slContent.FindName('LayoutRoot'); var message = layoutRoot.FindName('Message'); message.Text = 'Goodbye'; } &lt;/script&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>Root.xaml</p> <pre><code>&lt;Grid x:Name="LayoutRoot" Background="White" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="400"&gt; &lt;TextBlock x:Name="Message" Text="Hello, Silverlight!" FontSize="30" HorizontalAlignment="Center" VerticalAlignment="Center" /&gt; &lt;/Grid&gt; </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload