wpf - TabControl 的每个选项卡上的不同 View /用户控件

Question

我正在尝试编写一个使用选项卡来保存不同用户控件的程序。我目前想要发生的是用户单击查找按钮，创建一个新选项卡，并在其中出现一个查找屏幕。使用查找屏幕，用户可以选择客户端，然后在它们自己的新选项卡中打开这些客户端，允许用户对其进行编辑。因此，如果用户进入并选择了三个客户端，则屏幕将有四个选项卡，一个用于查找屏幕，三个客户端选项卡。当用户单击该选项卡中用户控件上的退出按钮时，它还需要关闭该选项卡。

我的问题是我不确定如何在我的程序中进行设置。我创建了一个 TabControl 并将 ItemsSource 绑定(bind)到一组 View 模型(每当用户添加新屏幕时，我都可以添加这些 View 模型)。我可以使用 DataTemplateSelector 来选择包含正确 View 的 DataTemplate，但我不知道如何将 View 的资源设置为我的 View 模型。

我在 WPF 中执行此操作，我目前正在使用 Bxf 将我的 View 模型放入 View 中，这通常可以工作，但我不确定它如何适合 TabControl。

我正在尝试坚持使用 MVVM，因此在我的 View 模型中有一个 View 列表已经出来了。

有没有人做过类似的事情？

Answer 1

我会让我的主要 ViewModel 看起来像这样:

ObservableCollection<ViewModelBase> OpenTabs

ICommand AddTabCommand

ICommand CloseTabCommand

在构造函数中，一个新的 SearchViewModel已创建并添加到 OpenTabs , 它是 Search方法连接到 MainViewModel 中的某个方法
MainViewModel 中的方法处理搜索命令将创建一个新的 CustomerViewModel指定客户，设置为 CloseCommand ，然后将其添加到 OpenTabs

var vm = new CustomerViewModel(customer);
vm.CloseCommand = this.CloseTabCommand;
OpenTabs.Add(vm);

您还可以使用事件系统，例如 PRISM 的 EventAggregator或 Galasoft 的 Messenger传递 AddTab/CloseTab 事件，而不是连接 MainViewModel 中的命令

当然，你会使用 DataTemplates定义每个 OpenTab对象将显示在 View 中

<TabControl ItemsSource="{Binding OpenTabs}">
    <TabControl.Resources>
        <DataTemplate DataType="{x:Type local:SearchViewModel}">
            <local:SearchView />
        </DataTemplate>
        <DataTemplate DataType="{x:Type local:CustomerViewModel}">
            <local:CustomerView />
        </DataTemplate>
    </TabControl.Resources>
</TabControl>