Tater Salad

You can chop em up, mash em up, or boil em in a stew.

Dynamically Resizing a Silverlight Control from Managed Code

Posted by caseyrayl on May 23, 2007

I discovered recently that the root silverlight control is not available from managed code in the 1.1 alpha.  Microsoft intends to make it available and it will probably be there in the beta, but for those of us trying to manipulate our RIAs with information from the control before the beta hits, another solution is in order.

 

The way I solved this was by using JavaScript to call into my managed code.  The basic setup involved specifying [Scriptable] elements in the managed code, specifically the class that interprets the calls (for me this was my main handling class linked from the XAML) and any getters/setters and functions within that class you want to expose to JavaScript.  I exposed a width and height setter, a function to handle a resize event from the browser, as well as a “main” function to get the app running.  The last requirement is a registration of the variable name from which you can access the class from JavaScript.  To do this you use the WebApplication.Current.RegisterScriptableObject() static function call.  Incredibly intuitive!

 

Then in the JavaScript file, I registered an event to handle the post load of the Silverlight control.   Within that function I extract the width and height from the control and set them into the managed code.  Then I register an event on the control to receive resize events.  Finally I tell the managed application to begin execution.

 

When the browser is resized, my JavaScript handler cascades the information down into the managed code and the entire app resizes to fit into the browser properly.  Sort of the long way to go about doing something that should be fairly straightforward, but it works for now.

 

-Casey

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <pre> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>