This project is read-only.

How can I get DockWidth to be relative

Jun 15, 2012 at 12:49 AM

Sometimes my app will run on low resolution screens.  When that happens I want my LayoutAnchorablePane DockWidth to be small (150).

But if the user resizes the window to something much bigger, I would like to have it resize with it.

I thought I could use the trick you can use with a Grid (DockWidth="0.25*") but it did not work.

Is there a way to get the width of a pane to be a percentage of the whole DockingManager?

Jun 15, 2012 at 8:27 AM

Relative DockWidth/DockHeight work as long as you put the LayoutAnchorablePane in a LayoutPanel that contains other LayoutAnchorablePane only. If in the same LayoutPanel there is a LayoutDocumentPane or a LayoutDocumentPaneGroup it will automaticcally assumes the * length as happen in VS2010.

I think the best you can do is traverse the layout tree and change the width by your self as the available width for the DockingManager changes.
Code like this (not tested):

dockManager.LayoutUpdated =>(s,e)=>
{
double dockManagerWidth = dockManager.ActualWidth;
double dockManagerHeight = dockManager.ActualHeight;
dockManager.Layout.Descendents().OfType<LayoutAnchorable>().ForEach((pane)=>
{
    if (pane.DockWidth.IsPixel && pane.DockWidth.Length > dockManagerWidth / 3.0)
        pane.DockWidth = new GridLength(dockManagerWidth / 3.0, GridUnit.Pixel);
}
}

Jun 28, 2012 at 7:30 PM
Edited Jun 28, 2012 at 9:36 PM

@adospace -- Can you clarify further when DockWidth / DockHeight automatically assume the * value?

In this simple example the DockHeight becomes * at runtime yet I wish to have control over it.  I should note that the designer behavior is as I would expect and want.

<ad:DockingManager>
    <ad:LayoutRoot>
        <ad:LayoutPanel Orientation="Vertical">
            <ad:LayoutAnchorablePane DockHeight="50">
                <ad:LayoutAnchorable>
                    <v:ChildView />
                </ad:LayoutAnchorable>
            </ad:LayoutAnchorablePane>
            <ad:LayoutAnchorablePane DockHeight="50">
                <ad:LayoutAnchorable>
                    <v:ChildView />
                </ad:LayoutAnchorable>
            </ad:LayoutAnchorablePane>
        </ad:LayoutPanel>
    </ad:LayoutRoot>
</ad:DockingManager>
Jun 29, 2012 at 9:04 AM

You have control setting the height as a star value. For example if you set the first anchorable to be 0.3* and the second 0.7* you're actually setting 30 percent of the available space to the first anchorable and 70 percent to the second. You can't anyway set the DockWidth/Height to a fixed pixel value because layoutpanel automatically change it to *. So just to be clear in your sample you are setting DockHeight to 50 that is a absolute pixel value; the LayoutPanel will convert it to a 1* value.

If you instead put a LayoutDocumentPane/LayoutDocumentPaneGroup inside the same LayoutPanel you can use absolute values for the anchorables; this because LayoutPanel can give the star value to the LayoutDocumentPane/LayoutDocumentPaneGroup.

<ad:DockingManager>
    <ad:LayoutRoot>
        <ad:LayoutPanel Orientation="Vertical">
            <ad:LayoutAnchorablePane DockHeight="50">
                <ad:LayoutAnchorable>
                    <v:ChildView />
                </ad:LayoutAnchorable>
            </ad:LayoutAnchorablePane>
            <ad:LayoutAnchorablePane DockHeight="50">
                <ad:LayoutAnchorable>
                    <v:ChildView />
                </ad:LayoutAnchorable>
            </ad:LayoutAnchorablePane>
            <ad:LayoutDocumentPane />
        </ad:LayoutPanel>
    </ad:LayoutRoot>
</ad:DockingManager>

Ado