TabControl 中带有用户控件模板的网格

Question

我是WPF的新手，尝试学习VMMV。我尝试使用 xaml 中内容的模板创建 TabControl。我想要带有网格内容和用户控件网格列表的选项卡项。添加用户控件后，选项卡项的标题呈现正确，但内容中没有任何内容。怎么了？

这是我的 xaml：

<TabControl ItemsSource="{Binding Items}" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" Visibility="Hidden" Name="tcContent" Grid.Column="1" Grid.Row="0">
   <TabControl.ItemTemplate>
      <DataTemplate>
         <TextBlock Text="{Binding Header}" />
      </DataTemplate>
   </TabControl.ItemTemplate>
   <TabControl.ContentTemplate>
      <DataTemplate>
         <ContentControl Content="{Binding Content}" />
      </DataTemplate>
   </TabControl.ContentTemplate>
</TabControl>

视图模型：

public class Tab
{
    public string Header { get; set; }
    public ObservableCollection<UserControl> Content { get; set; }
}
public class MainWindowsViewModel
{        
    ObservableCollection<Tab> _items = new ObservableCollection<Tab>();
    public ObservableCollection<Tab> Items
    {
         get
         {
              return _items;
         }
    }       
}

填充选项卡控件的代码后面：

public MainWindow()
{ 
     this.DataContext = new MainWindowsViewModel();
}
public void AddToTab(string header, UserControl c)
{
     Tab tab = new Tab();
     tab.Header = header;
     tab.Content = new ObservableCollection<UserControl>();
     tab.Content.Add(c);
     ((MainWindowsViewModel)this.DataContext).Items.Add(tab);
}

Answer 1

你误解了 MVVM 原则。

在视图模型中，您有一个Tab对象的集合，每个对象都包含UserControl的集合。这样，您的视图模型包含一些视图元素（UserControl）。在 MVVM 中，你不应该这样做。

相反，您可以为每个选项卡项创建视图模型，这些

选项卡项描述表示的模型（因此是视图模型）;在 XAML 中，您可以使用 DataTemplate 描述这些视图模型的外观。

但是，仅当您的视图必须是动态的时，才需要所有这些。 例如，您不知道哪些数据可用，因为您是从数据库中获取它们的。

如果你的TabItem显示一组不会更改的UserControl，则只需在 XAML 中完全描述你的视图，而不用任何DataTemplate。

Answer 2

首先，删除Visibility="Hidden"形成TabControl。然后将ControlControl更改为可以容纳Tab.Content的ItemsControl，这是一个集合。但是，您应该注意@dymanoid回答中提到的问题。

<TabControl.ContentTemplate>
    <DataTemplate >
        <ItemsControl ItemsSource="{Binding Content}" />
    </DataTemplate>
</TabControl.ContentTemplate>