Avalondock MVVM Layout

本文关键字：Layout MVVM Avalondock | 更新日期: 2023-09-27 18:33:36

所以这个问题以前被问过，但没有回答或没有按照我想要的方式回答

我知道如何在 XAML 中使用 LayoutAnchorablePaneGroup、LayoutAnchorablePane 和 LayoutDocument 创建我想要实现的布局，但我想以 MVVM 方式使用 Avalondock，将我的 XAML 简化为：

<avalonDock:DockingManager x:Name="dockingManager" 
                                       DataContext="{Binding DockManagerViewModel}"
                                       DocumentsSource="{Binding Documents}"
                                       AnchorablesSource="{Binding Anchorables}"
                                       Loaded="dockingManager_Loaded" 
                                       Unloaded="dockingManager_Unloaded">

填充Documents和Anchorables会使所需的窗口出现在停靠管理器中，但我看不出如何划分它们将出现的位置。

如何指定一些规则（最好是在 XAML 中）来构建特定的布局，而不会丢失 MVVM 分离？

例如：A型物体应该全部放在右边的LayoutAnchorablePane中，B型物体应该在左边的LayoutAnchorablePane中一起走，等等。

提前谢谢。

Avalondock MVVM Layout

我去了同样的情况。 并找到了一个棘手但对我有用的解决方案。

遵循代码项目解决方案，并暗示保存和加载布局。

请注意，应用程序第一次启动时，它没有布局，因此您需要使用所需的布局创建 XML，稍后您可以加载保存的布局。 希望这有帮助。

示例停靠管理器：

  <xcad:DockingManager x:Name="DockingManagerDockView"
                         AnchorablesSource="{Binding AnchorableSource}" 
                         DocumentsSource="{Binding DocumentSource}" 
                         Utility:AvalonDockLayoutSerializer.SaveLayoutCommand="{Binding SaveLayoutCommandOnExit}"
                         Utility:AvalonDockLayoutSerializer.LoadLayoutCommand="{Binding LoadLayoutCommand}">       
    <xcad:DockingManager.Theme>
        <xcad:MetroTheme />
    </xcad:DockingManager.Theme>
    <xcad:DockingManager.LayoutUpdateStrategy>
        <Pane:LayoutInitializer/>
    </xcad:DockingManager.LayoutUpdateStrategy>
    <xcad:DockingManager.Resources>            
        <DataTemplate DataType="{x:Type ViewModels:ExplorerViewModel}">
            <Views:ExplorerView />
        </DataTemplate>            
        <DataTemplate DataType="{x:Type ViewModels:TableOfContentViewModel}">
            <Views:TableOfContentView x:Name="TOCView" Focusable="True">
                <Views:TableOfContentView.InputBindings>
                    <KeyBinding Key="F5" Command="{Binding GridF5Command}"/>
                </Views:TableOfContentView.InputBindings>
            </Views:TableOfContentView>
        </DataTemplate>
        <DataTemplate DataType="{x:Type ViewModels:PropertyViewModel}">
            <Views:PropertyView />
        </DataTemplate>           
        <DataTemplate DataType="{x:Type ViewModels:SearchViewModel}">
            <Views:SearchPanel />
        </DataTemplate>
        <DataTemplate DataType="{x:Type ViewModels:DocumentViewModel}">
            <Views:DocumentView />
        </DataTemplate>
        <DataTemplate DataType="{x:Type ViewModels:ReIndexPanelViewModel}">
            <Views:ReIndexPanel />
        </DataTemplate>
    </xcad:DockingManager.Resources>       
    <xcad:DockingManager.LayoutItemContainerStyleSelector>
        <Pane:PanesStyleSelector>
            <Pane:PanesStyleSelector.ToolStyle>
                <Style TargetType="{x:Type xcad:LayoutAnchorableItem}">
                    <Setter Property="Title" Value="{Binding Model.Title}"/>
                    <Setter Property="Visibility" Value="{Binding Model.IsVisible, Mode=TwoWay, Converter={StaticResource BoolToVisibilityConverter}, ConverterParameter={x:Static Visibility.Hidden}}"/>
                    <Setter Property="ContentId" Value="{Binding Model.ContentId}"/>
                    <Setter Property="FlowDirection" Value="LeftToRight"/>
                    <Setter Property="UseLayoutRounding" Value="False"/>
                    <Setter Property="IconSource" Value="{Binding Model.IconSource}"/>
                </Style>
            </Pane:PanesStyleSelector.ToolStyle>
            <Pane:PanesStyleSelector.FileStyle>
                <Style TargetType="{x:Type xcad:LayoutItem}">
                    <Setter Property="Title" Value="{Binding Model.Title}"/>
                    <Setter Property="ToolTip" Value="{Binding Model.FilePath}"/>
                    <Setter Property="ContentId" Value="{Binding Model.ContentId}"/>
                    <Setter Property="CanClose" Value="False"/>                        
                </Style>
            </Pane:PanesStyleSelector.FileStyle>
        </Pane:PanesStyleSelector>
    </xcad:DockingManager.LayoutItemContainerStyleSelector>
    <xcad:LayoutRoot>
        <xcad:LayoutPanel Orientation="Horizontal">                
                <xcad:LayoutAnchorablePaneGroup>
                    <xcad:LayoutAnchorablePane Name="Explorer" DockMinWidth="250"/> 
                    <xcad:LayoutAnchorablePane Name="TOC" DockMinWidth="500"/>
                    <xcad:LayoutAnchorablePane Name="Property" DockMinWidth="300" />
                    <xcad:LayoutAnchorablePane Name="Search" DockMinWidth="300" />
                    <xcad:LayoutAnchorablePane Name="ReIndex" DockMinHeight="300" />
                </xcad:LayoutAnchorablePaneGroup>
            <xcad:LayoutDocumentPaneGroup >
                <xcad:LayoutDocumentPane/>
            </xcad:LayoutDocumentPaneGroup>
        </xcad:LayoutPanel>            
    </xcad:LayoutRoot>
</xcad:DockingManager>
相关文章：