DockWidth in LayoutAnchorablePaneGroup

Question

I have an AvalonDock which is almost there but not quite. I can’t figure out why the very first horizontal pane resize snaps back to the incorrect location. Subsequent resizes work fine, its just the first one that goes wrong. I’m sure it has something to do with DockWidth=”Auto” but I need this to default my pane to its content dynamic width.

1. Initial horizontal resize to this point:
   _{(source: logitexsystems.co.uk)}

2. Pane snaps back to this width:
   _{(source: logitexsystems.co.uk)}

3. Repeat horizontal resize:
   _{(source: logitexsystems.co.uk)}

4. Subsequent resizes work fine:
   _{(source: logitexsystems.co.uk)}

   <xcad:LayoutRoot>
   
       <xcad:LayoutPanel>
   
           <xcad:LayoutAnchorablePaneGroup DockWidth="Auto">
   
               <xcad:LayoutAnchorablePane>
   
                   <xcad:LayoutAnchorable Title="Tools"
                                       CanAutoHide="False"
                                       CanHide="False"
                                       CanClose="False">
   
                       <Grid HorizontalAlignment="Left"
                           Background="Aqua">
   
                           <ListBox Width="150"
                                   HorizontalAlignment="Left"
                                   Opacity="0.5">
                               <ListBoxItem Content="Tool1"/>
                               <ListBoxItem Content="Tool2"/>
                               <ListBoxItem Content="Tool3"/>
                           </ListBox>
   
                       </Grid>
   
                   </xcad:LayoutAnchorable>
               </xcad:LayoutAnchorablePane>
   
           </xcad:LayoutAnchorablePaneGroup>
   
           <xcad:LayoutDocumentPane ShowHeader="False" >
               <xcad:LayoutAnchorable CanClose="False">
   
                   <TextBlock Text="Test"
                           Margin="0"
                           Background="BlueViolet"/>
   
               </xcad:LayoutAnchorable>
           </xcad:LayoutDocumentPane>
   
       </xcad:LayoutPanel>
   
   </xcad:LayoutRoot>
   

Answer 1

Set HorizontalAligment of the Grid to Stretch

<xcad:DockingManager>
        <xcad:LayoutRoot>

            <xcad:LayoutPanel>

                    <xcad:LayoutAnchorablePaneGroup DockWidth="Auto" >

                    <xcad:LayoutAnchorablePane DockWidth="Auto" >

                        <xcad:LayoutAnchorable Title="Tools" 
                                    CanAutoHide="False"
                                    CanHide="False"
                                    CanClose="False">

                            <Grid HorizontalAlignment="Stretch" 
                        Background="Aqua">

                                    <ListBox  HorizontalAlignment="Left" Width="150"

                                Opacity="0.5">
                                    <ListBoxItem Content="Tool1xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"/>
                                    <ListBoxItem Content="Tool2"/>
                                    <ListBoxItem Content="Tool3"/>
                                </ListBox>

                            </Grid>

                        </xcad:LayoutAnchorable>
                    </xcad:LayoutAnchorablePane>

                </xcad:LayoutAnchorablePaneGroup>

                <xcad:LayoutDocumentPane  >
                    <xcad:LayoutAnchorable CanClose="False">

                        <TextBlock Text="Test"
                        Margin="0"
                        Background="BlueViolet"/>

                    </xcad:LayoutAnchorable>
                </xcad:LayoutDocumentPane>

            </xcad:LayoutPanel>

        </xcad:LayoutRoot>
        </xcad:DockingManager>