Wednesday, March 23, 2011

Silverlight - Make same size as browser frame

Is there a way to scale a silverlight app to 100% width and 100% height of the browser frame that the application is embedded in?

I'm aware of the full screen capabilities, I'd like it to sit nicely inside the browser.

From stackoverflow
  • Using Width=”Auto” Height=”Auto” on your LayoutRoot will cause Silverlight object to fill the room the object tag has. By default (TestPage.html) it is object ... width="100%" height="100%" You might also want to set the d:DesignWidth="640" and d:DesignHeight="480" that way it is easier to do layout in Expression Blend.

    JSmyth : Thank you, the Auto keyword was indeed the one I needed. So simple, yet so easy to miss!
  • Remove the Width and Height attributes from the root UserControl.

  • This Javascript will do it, see this answer:

    private bool _hasResized;
    
    protected override Size ArrangeOverride(Size finalSize)
    {
        if (!_hasResized)
        {
            HtmlPage.Document.GetElementById("silverlightControlHost").SetStyleAttribute("height", finalSize.Height.ToString());
            _hasResized = true;
        }
    
        return base.ArrangeOverride(finalSize);
    }
    

0 comments:

Post a Comment