TabControl中的WPF MVVM多個ContentControls

Question

我希望我的tabitem以網格形式顯示多個usercontrols 。 想象一下在一個tabitem中有一個grid ，其中第一行和第二行包含相應的usercontrol1和usercontrol2 。 這些用戶控件的ViewModel是View1Model.cs和View2Model.cs 。

我目前可以使用以下方法顯示單個usercontrol ：

View.xaml代碼：

<TabControl.ItemTemplate>
    <DataTemplate>
        <TextBlock Text="{Binding Header}"/>
    </DataTemplate>
</TabControl.ItemTemplate>
<TabControl.ContentTemplate>
    <DataTemplate>
        <ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">
            <ContentControl Content="{Binding Content}" />
        </ScrollViewer>
    </DataTemplate>
</TabControl.ContentTemplate>

ViewModel.cs代碼：

public ObservableCollection<TabItem> Tabs { get; set; }

public ToolViewModel ()
{
    Tabs = new ObservableCollection<TabItem>();
    Tabs.Add(new TabItem { Header = "Header", Content = new View1Model()});
}

TabItem.cs代碼（模型）：

public string Header { get; set; }
public ViewModelBase Content { get; set; }

顯然，我不能以這種方式將另一個ContentControl添加到同一Header 。 為了解決該問題，我想我應該首先更改public ViewModelBase Content { get; set; } public ViewModelBase Content { get; set; } public ViewModelBase Content { get; set; }到public ViewModelBase[] Content { get; set; } public ViewModelBase[] Content { get; set; } public ViewModelBase[] Content { get; set; } 。 但是，我不確定如何在xaml中顯示ContentControl的列表。

編輯：我最終使用ObservableCollection<ViewModelBase>而不是簡單的數組。

Answer 1

為了解決該問題，我想我應該首先更改public ViewModelBase Content { get; set; } public ViewModelBase Content { get; set; } public ViewModelBase Content { get; set; }到public ViewModelBase[] Content { get; set; } public ViewModelBase[] Content { get; set; } public ViewModelBase[] Content { get; set; } 。 但是，我不確定如何在xaml中顯示ContentControl的列表。

使用ItemsControl ：

<TabControl.ContentTemplate>
    <DataTemplate>
        <ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">
            <ItemsControl ItemsSource="{Binding Content}" />
        </ScrollViewer>
    </DataTemplate>
</TabControl.ContentTemplate>