[Version 2.0] Just a simple window with a side bar

May 21, 2012 at 11:44 AM

Hi.

I'm new to AvalonDock. I've looked in the samples and the tutorial but it seems that I can't do what I need :(

I have a WPF application that has a toolbar on the top and a statusbar on the bottom. Between those two I need a TabControl, that will occupy all the application free space. 

Additionally, I'll need a kind of Side Bar which will include some statistics. That side bar might be in a floating window state, docked to the left or docked to the right.

I was able to include that window inside my application and it docks to the right, however I can't grab the window and dock it to the left. I didn't put the TabControl inside the DockManager, because I don't know how to do it.

I have something like the code snippet below.

So, can anyone advise me on how can I add 'sessionTabsControl' inside the DockingManager?

Thanks a lot!

<DockPanel>
	<ad:DockingManager DockPanel.Dock="Right">
                <adLayout:LayoutRoot>
                    <adLayout:LayoutPanel>
                        <adLayout:LayoutAnchorablePaneGroup>
                            <adLayout:LayoutAnchorablePane DockMinWidth="300">
                                <adLayout:LayoutAnchorable x:Name="ToolWindow1" Title="Tool Window 1">
                                    <local:SideBar />
                                </adLayout:LayoutAnchorable>
                            </adLayout:LayoutAnchorablePane>
                        </adLayout:LayoutAnchorablePaneGroup>
                    </adLayout:LayoutPanel>
                </adLayout:LayoutRoot>
	</ad:DockingManager>            
	<sc:SessionTabControl x:Name="sessionsTabsControl" />
</DockPanel>
ve something l
May 21, 2012 at 12:54 PM

I think that in your scenario AD is not the right solution; Have you tried something like http://navigationpane.codeplex.com/ ?

May 21, 2012 at 1:07 PM

I've looked into it but I don't think it will work because I need the Sidebar to be a floating window.

I've managed to use AvalonDock with something like the snippet below. However, perhaps AD is not the right solution because I'll need to:

  • Restrict the side bar to dock only to the left or to the right;
  • Disable the "X" button on each Document when on certain states;
  • Disable/Remove the Maximize button on the "Side bar"

I've tried templating and styling but I think that I can't fulfill this requirements :(

 

		<ad:DockingManager>
			<adLayout:LayoutRoot>
				<adLayout:LayoutPanel>
					<adLayout:LayoutDocumentPaneGroup>
						<adLayout:LayoutDocumentPane>
							<adLayout:LayoutAnchorable Title="Tab1">
								<Rectangle Fill="Red" />
							</adLayout:LayoutAnchorable>
							<adLayout:LayoutAnchorable Title="Tab2">
								<Rectangle Fill="Orange" />
							</adLayout:LayoutAnchorable>
						</adLayout:LayoutDocumentPane>
					</adLayout:LayoutDocumentPaneGroup>
				</adLayout:LayoutPanel>
                
                <adLayout:LayoutRoot.RightSide>
                    <adLayout:LayoutAnchorSide >
                        <adLayout:LayoutAnchorGroup>
                            <adLayout:LayoutAnchorable Title="SideBar" AutoHideWidth="120" AutoHideHeight="100">
                                <Rectangle Fill="Blue" Width="227" Height="768" />
                            </adLayout:LayoutAnchorable>
                        </adLayout:LayoutAnchorGroup>
                    </adLayout:LayoutAnchorSide>
                </adLayout:LayoutRoot.RightSide>
			</adLayout:LayoutRoot>
		</ad:DockingManager>

May 23, 2012 at 6:33 PM

If it were me, at this juncture, I would use one of the existing releases of AvalonDock.  It has support for things like

Pane.DockableStyle = DockableStyle.BottomBorder | DockableStyle.AutoHide;

I have an app with just two controls, tabbed on the right, and a datagrid in the main document area.

        <ad:DockingManager x:Name="DockMgr" >
            <ad:ResizingPanel Orientation="Horizontal">
                <ad:DockablePane>
                    <ad:DockableContent Title="Outages"
                                        Width="180"
                                        IsCloseable="False">
                        <local:OutagePane x:Name="OutagePane" />
                    </ad:DockableContent>
                    <ad:DockableContent x:Name="HistControlPane"
                                        Title="History Querying"
                                        Width="180"
                                        IsCloseable="False">
                        <local:HistoryControls x:Name="HistControls" />
                    </ad:DockableContent>
                </ad:DockablePane>
                <ad:DocumentPane x:Name="MainDocPane" >
                    <ad:DocumentContent Name="General"
                                        Title="Selected History"
                                        IsCloseable="False">
                        <DataGrid x:Name="HistoryGrid">
                        </DataGrid>
                    </ad:DocumentContent>
                </ad:DocumentPane>
            </ad:ResizingPanel>
        </ad:DockingManager>
I'm porting it to 2.0 now, and it's ok, but there's a good bit of hacking I've had to do.