AvalonDock的基本用法ide
AvalonDock是優秀的開源項目,用於建立可停靠式佈局,可以在WPF中方便開發出相似VS2010的軟件界面。對於複雜的軟件系統,大量控件的使用會使的界面變得難以管理。AvalonDock幫咱們解決了這一問題。想要在WPF項目中使用AvalonDock的功能,首先要加載AvalonDock所提供的動態庫,下載地址:http://avalondock.codeplex.com/releases/view/107371,目前最新的庫版本爲2.02。下載AvalonDock的動態庫與主題庫,解壓後如圖所示:工具
在WPF項目的引用中添加這些庫,而後使用在xaml中引入命名空間:xmlns:avalon="http://schemas.xceed.com/wpf/xaml/avalondock",即可以在WPF中開發AvalonDock應用程序了。佈局
下圖是AvalonDock主頁展現的示例截圖。學習
AvalonDock庫中提供了一些基本的類,熟悉這些類的功能是使用AvalonDock的第一步。this
DockingManager : 停靠管理器類,是AvalonDock中的核心控件之一,負責管理浮動窗體、佈局存儲、恢復,樣式主題等。在XAML中,是AvaDock元素的根節點。3d
LayoutRoot : 佈局根節點類,DockingManager中的內容控件徹底佔滿DockingManager中的空間。LayoutRoot包含四個屬性,LeftSide,RightSide,TopSide,BottomSide,分別用於展現DockingManager中左右上下四個位置的內容,但初始狀態爲隱藏狀態。另外兩個屬性FloatingWindows,Hidden分別爲浮動窗體集合和隱藏窗體集合。當一個窗格浮動時,AvalonDock會將其從其所在組中刪除,而後放置到FloatingWindows集合中。當一個窗格關閉時,會將其放置在Hidden集合中。code
LayoutPanel:佈局面板類,LayoutRoot中的內容控件,徹底佔滿LayoutRoot中的空間,在LayoutPanel中,能夠有多個LayoutGroup,能夠設定Orientation 屬性,控件佈局組的浮動方向。實際的窗格都位於LayoutPanel節點下。xml
LayoutAnchorablePane:可停靠窗格類,浮動窗格是可停靠控件LayoutAnchorable的容器。一個窗格中,能夠有多個可停靠控件。浮動窗格中的可停靠控件只能是LayoutAnchorable.窗格大小設定後,不能自動改變。對象
LayoutDocumentPane:文檔窗格類,與LayoutAnchorablePane相似,也是可停靠控件的容器,文檔窗格類中能夠放置可停靠控件LayoutAnchorable,也能夠放置文檔控件LayoutDocument,LayoutDocunemtPane會自動佔滿窗體的窗體佈局中的剩餘空間。blog
LayoutAnchorablePaneGroup:可停靠窗格組類,是可停靠窗格LayoutAnchorablePane的容器。經過設置Orientation 屬性,用於管理多個可停靠窗格的浮動方向。
LayoutDocumentPaneGroup:文檔窗格組類,是文檔窗格LayoutDocumentPane的容器。經過設置Orientation 屬性,用於管理多個文檔窗格的浮動方向。
LayoutAnchorable:可停靠內容類,通常放置在LayoutAnchorablePane中,其內容能夠是用戶自定義控件類型,好比,在UserControl中設置好WPF基礎控件佈局,而後將整個UserControl放置在LayoutAnchorable中,這樣,整個UserControl內容就能夠隨着可停靠控件一塊兒浮動或者停靠。
LayoutDocument:文檔類,與LayoutAnchorable功能相似,區別在於LayoutDoucument會隨着LayoutDocumentPane一塊兒佔滿窗體剩餘空間。
介紹了這麼多內容,目的只是爲了讓你們對AvalonDock中的類有個簡單的瞭解。其實AvalonDock中的類有着明顯的層次結構,其實就是容器的嵌套。DockingManager做爲頂層容器,而後包含一個LayoutRoot對象,LayoutRoot中又包含一個LayoutPanel對象。LayoutPanel中即是LayoutAnchroablePane對象和LayouDocumentPane對象的集合。同時,能夠對LayoutAnchroablePane對象和LayouDocumentPane對象進行分組,每一個組能夠單獨設定組內的浮動方向。LayoutAnchorablePane又是LayoutAnchorable的容器,LayioutDocumanePane又是LayoutDocument的容器。一層一層進行嵌套,在最後的LayoutAnchorable中或者LayoutDocument中,咱們放入咱們真正的控件對象,這樣,就能夠對他們進行分類擺放佈局。
下面介紹具體的用法。
1.窗體佈局存儲與恢復
DockingManager中提供了將窗體佈局序列化爲xml文件內容的方法,同時提供了從xml佈局文件中恢復佈局的方法。
(1)保存佈局
XmlLayoutSerializer serializer = new XmlLayoutSerializer(DockManager); using (var stream = new StreamWriter("Layout.xml")) { serializer.Serialize(stream); }
(2)恢復佈局
XmlLayoutSerializer serializer = new XmlLayoutSerializer(DockManager); using (var stream = new StreamReader("Layout.xml")) { serializer.Deserialize(stream); }
恢復佈局時,有一點須要注意,須要爲LayoutAnchrobale對象和LayoutDocument對象設置ContentId屬性,不然,DockingManager會忽略內容的恢復。
2.主題更換
AvalonDock中提供了六種主題樣式,要使用這些主題,須要在程序中導入主題庫。DockManger爲DockingManager對象,經過改變DockingManager中的Theme屬性,即可以改變整個界面的樣式。
DockManager.Theme = new GenericTheme(); //DockManager.Theme = new AeroTheme(); //DockManager.Theme = new ExpressionDarkTheme(); //DockManager.Theme = new ExpressionLightTheme(); //DockManager.Theme = new MetroTheme(); //DockManager.Theme = new VS2010Theme();
3.RootSide操做
動態改變LayoutRoot.LeftSide對象內容。
(1)xaml中的代碼
<avalon:LayoutRoot.LeftSide> <avalon:LayoutAnchorSide> <avalon:LayoutAnchorGroup x:Name="LeftGroup"> </avalon:LayoutAnchorGroup> </avalon:LayoutAnchorSide> </avalon:LayoutRoot.LeftSide>
(2)後臺代碼
private void miLeft_Click_1(object sender, RoutedEventArgs e) { try { LayoutAnchorable anchorable = new LayoutAnchorable(); anchorable.Title = "Left"; LeftGroup.Children.Add(anchorable); } catch (Exception ex) { MessageBox.Show(ex.Message, "[MainWindow][miLeft_Click_1]"); } }
4.Pane操做
動態改變軟件中的窗格佈局。
(1)xaml中的代碼
<avalon:DockingManager x:Name="DockManager"> <avalon:DockingManager.Theme> <avalon:ExpressionDarkTheme/> </avalon:DockingManager.Theme> <avalon:LayoutRoot x:Name="Root"> <avalon:LayoutPanel x:Name="Panel" > <avalon:LayoutAnchorablePaneGroup x:Name="LeftAnchorableGroup" DockWidth="300"> <avalon:LayoutAnchorablePane x:Name="LeftPane"> <avalon:LayoutAnchorable x:Name="Solution" Title="解決方案" ContentId="Solution"/> </avalon:LayoutAnchorablePane> </avalon:LayoutAnchorablePaneGroup> <avalon:LayoutAnchorablePane> <avalon:LayoutAnchorable ></avalon:LayoutAnchorable> </avalon:LayoutAnchorablePane> <avalon:LayoutDocumentPane> <avalon:LayoutDocument></avalon:LayoutDocument> </avalon:LayoutDocumentPane> <avalon:LayoutDocumentPaneGroup x:Name="DocumentGroup"> <avalon:LayoutDocumentPane x:Name="DocumentPane"> <avalon:LayoutDocument Title="document" ContentId="document"> </avalon:LayoutDocument> </avalon:LayoutDocumentPane> </avalon:LayoutDocumentPaneGroup> <avalon:LayoutAnchorablePaneGroup x:Name="RightAnchorableGroup" Orientation="Vertical" DockWidth="300"> <avalon:LayoutAnchorablePane x:Name="RightPane" > <avalon:LayoutAnchorable Title="屬性" ContentId="Property"/> </avalon:LayoutAnchorablePane> </avalon:LayoutAnchorablePaneGroup> </avalon:LayoutPanel> </avalon:LayoutRoot> </avalon:DockingManager>
(2)添加水平AnchorablePane
private void miAnchorPane_Click_1(object sender, RoutedEventArgs e) { try { LayoutAnchorablePane pane = new LayoutAnchorablePane(); LayoutAnchorable anchorable = new LayoutAnchorable(); anchorable.Title="水平方向"; pane.Children.Add(anchorable); LeftAnchorableGroup.Children.Add(pane); } catch(Exception ex) { MessageBox.Show(ex.Message,"[MainWindow][miAnchorPane_Click_1]"); } }
(3)添加豎直AnchorablePane
private void miAnchorVerticalPane_Click_1(object sender, RoutedEventArgs e) { try { LayoutAnchorablePane pane = new LayoutAnchorablePane(); LayoutAnchorable anchorable = new LayoutAnchorable(); anchorable.Title = "豎直方向"; pane.Children.Add(anchorable); RightAnchorableGroup.Children.Add(pane); } catch (Exception ex) { MessageBox.Show(ex.Message, "[MainWindow][miAnchorVerticalPane_Click_1]"); } }
(4)添加DocumentPane
private void miDocumentPane_Click_1(object sender, RoutedEventArgs e) { try { LayoutDocumentPane documentPane = new LayoutDocumentPane(); LayoutDocument document = new LayoutDocument(); document.Title = "document"; document.Content = new RichTextBox(); documentPane.Children.Add(document); DocumentGroup.Children.Add(documentPane); } catch (Exception ex) { MessageBox.Show(ex.Message, "[MainWindow][miDocumentPane_Click_1]"); } }
5.浮動窗體顯示
private void miSearchWnd_Click_1(object sender, RoutedEventArgs e) { LayoutAnchorable anchorable = new LayoutAnchorable(); anchorable.Title = "查詢"; anchorable.FloatingWidth = 300; anchorable.FloatingHeight = 300; anchorable.FloatingTop = 200; anchorable.FloatingLeft = 300; Button button = new Button(); button.Content = "查詢"; button.Width = 80; button.Height = 40; anchorable.Content = button; LeftPane.Children.Add(anchorable); anchorable.Float(); //調用Float方法,使窗體浮動顯示 }
6.隱藏窗體顯示
private void miRestoreHideWnd_Click_1(object sender, RoutedEventArgs e) { try { if (Root.Hidden != null) { while (Root.Hidden.Count > 0) { Root.Hidden[0].Show();//調用show方法,恢復窗體顯示。 } } } catch(Exception ex) { MessageBox.Show(ex.Message, "[MainWindow][miRestoreHideWnd_Click_1]"); } }
7.窗體操做
(1)添加Anchorable
private void miAddAnchroable_Click_1(object sender, RoutedEventArgs e) { LayoutAnchorable anchorable = new LayoutAnchorable(); anchorable.Title = "工具"; Button btn = new Button(); btn.Content = "this is a test button"; anchorable.Content = btn; btn.Height = 30; btn.Width = 150; anchorable.IsActive = true; RightPane.Children.Add(anchorable); }
(2)添加Document
private void miAddDocument_Click_1(object sender, RoutedEventArgs e) { LayoutDocument document = new LayoutDocument(); document.Title = "doc"; document.Content = new RichTextBox(); document.IsActive = true; DocumentPane.Children.Add(document); }
(3)添加並顯示窗體
private void miOutPutWnd_Click_1(object sender, RoutedEventArgs e) { LayoutAnchorable anchorable = new LayoutAnchorable(); anchorable.Title = "輸出"; anchorable.Content = new RichTextBox(); anchorable.AddToLayout(DockManager, AnchorableShowStrategy.Bottom); }
(4)窗體切換自動隱藏
private void miAutoHide_Click_1(object sender, RoutedEventArgs e) { if (Solution != null) { Solution.ToggleAutoHide(); } }
至此,AvalonDock的基礎用法,至於更改AvalonDock的外觀樣式,使用MVVM模式等高級的用法,須要本身慢慢去學習了。