将MVVM与AvalonDock一起使用时,如何在不同的窗格中提供LayoutAnchorables和LayoutDocuments的默认位置?
当然,像AvalonDock这样的功能是使用户能够按自己的喜好排列UI组件,但我想提供一个不错的默认布局。
(非常基本的)示例:
没有MVVM,并排放置两个LayoutAnchorables非常简单:
<xcad:DockingManager x:Name="MyDockingManager">
<xcad:LayoutRoot>
<xcad:LayoutPanel>
<xcad:LayoutAnchorablePane>
<xcad:LayoutAnchorable Title="Foo">
<TextBox Text="foo" />
</xcad:LayoutAnchorable>
</xcad:LayoutAnchorablePane>
<xcad:LayoutAnchorablePane>
<xcad:LayoutAnchorable Title="Bar">
<TextBox Text="bar" />
</xcad:LayoutAnchorable>
</xcad:LayoutAnchorablePane>
</xcad:LayoutPanel>
</xcad:LayoutRoot>
</xcad:DockingManager>
使用MVVM,我会有类似的东西:
<xcad:DockingManager AnchorablesSource="{Binding Anchorables}">
<xcad:DockingManager.LayoutItemContainerStyle>
<Style TargetType="xcad:LayoutItem">
<Setter Property="Title" Value="{Binding Model.Title}" />
</Style>
</xcad:DockingManager.LayoutItemContainerStyle>
<xcad:DockingManager.LayoutItemTemplate>
<DataTemplate>
<ContentPresenter Content="{Binding Content}" />
</DataTemplate>
</xcad:DockingManager.LayoutItemTemplate>
<xcad:LayoutRoot>
<xcad:LayoutPanel>
<xcad:LayoutAnchorablePane>
</xcad:LayoutAnchorablePane>
<xcad:LayoutAnchorablePane>
<!-- How to place something in here? -->
</xcad:LayoutAnchorablePane>
</xcad:LayoutPanel>
</xcad:LayoutRoot>
</xcad:DockingManager>
后面有一些代码:
public MainWindow()
{
DataContext = this;
Anchorables = new ObservableCollection<AnchorableViewModel>() {
new AnchorableViewModel("foo"),
new AnchorableViewModel("bar")
};
InitializeComponent();
}
public ObservableCollection<AnchorableViewModel> Anchorables { get; }
还有一个非常基本的视图模型:
public class AnchorableViewModel
{
public AnchorableViewModel(string title)
{
Title = title;
Content = new TextBox() { Text = title };
}
public string Title { get; }
public UIElement Content { get; }
// (No INotifyPropertyChanged for sake of brevity, this example works without.)
}
这会将两个可定位对象放置在同一窗格中,堆叠在一起。如何将可锚定物放置在不同的平面上?