locked
Positioning HTML elements relative to Silverlight elements RRS feed

  • Question

  • When mixing both Silverlight and DOM elements in an application,is there a strategy for working out where and how to place HTML elements?

    For instance, if I had the following:

     

            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                
                <Border Grid.Column="0" Width="{Binding LeftWidth}"></Border>
                <Border Grid.Column="1" x:Name="HtmlContainer" />
    
            </Grid>
    

     
     And I want to position my HTML content where the "HtmlContainer" resides (who's size will change)...is there a strategy for calculating these positions?  And then passing them to an HTML DOM element?

     

    This is basically what DivElements is doing with the HtmlHost control, whereby they are positioning an IFRAME element.

    http://www.divelements.co.uk/silverlight/tools.aspx

    I'm wondering how they are doing this...and if there are commonly known strategies for doing this.

    Thanks

     

    Phil

     

     

    Monday, May 18, 2009 7:23 PM

Answers

  • You can get the position of any element relative to the host. That means that your HTML position would be the left/top of the host + whatever that value returns.
    You can transform coordinates relative to one element to be relative to another using TransformToVisual. So if you want to transform the upper left of an element (myElement) to the host use:
    Point p = myElement.TransformToVisual(Application.RootVisual).Transform(new Point(0,0));
    Monday, May 18, 2009 10:35 PM

All replies

  • You can get the position of any element relative to the host. That means that your HTML position would be the left/top of the host + whatever that value returns.
    You can transform coordinates relative to one element to be relative to another using TransformToVisual. So if you want to transform the upper left of an element (myElement) to the host use:
    Point p = myElement.TransformToVisual(Application.RootVisual).Transform(new Point(0,0));
    Monday, May 18, 2009 10:35 PM
  •  That points me in the right direction.  Thanks Morten.

    Tuesday, May 19, 2009 9:59 AM