启用 ViewModel 的 WPF TabControl 创建 TabItem 内容

Question

我想创建一个 TabControl，其中 TabItem 将在运行时动态创建。 TabItem 应该与 ViewModel 相关联。这个视图模型支持一个知道如何在 TabItem 内创建内容的接口。所以基本上 TabItems 可以在运行时接受视图模型决定的任何内容控制。我尝试了使用 TabControl.ContentTemplate 或 ControlTemplate 和 ItemTemplate 的不同方法，但它们都不起作用。似乎模板方法需要在设计时知道 TabItem 内内容的类型才能呈现自己。与关联数据上下文中的属性的绑定工作正常，但不显示内容控件。 我们能否只派生一个新类 MyTabItem:TabItem 并创建自定义内容并将其与 MyTabItem 的内容相关联。 需要任何可以允许视图模型创建 TabItems 内容的通用方法。

Answer 1

您能否为可能动态添加到您的TabControl 的每种类型指定一个DataTemplate？如果是这样，这样的东西对你有用吗？

（请注意，TabControl 为ItemTemplate（选项卡标题的模板）和ContentTemplate（显示在所选选项卡内容内的模板）找到相同的DataTemplate。这个是因为我们都没有指定，所以 WPF 只是简单地向上遍历树并从我们的Grid.Resources 中找到相同的模板。如果您想为每个模板使用不同的模板，您可以显式指定要用于@987654328 的模板@ 如果这对您有用，或者使用 DataTemplateSelector 或类似名称。）

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <Grid.Resources>
        <DataTemplate DataType="{x:Type local:DescribableOne}">
            <Grid Background="Red">
                <TextBlock Text="{Binding Description}" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center"/>
            </Grid>
        </DataTemplate>
        <DataTemplate DataType="{x:Type local:DescribableTwo}">
            <Grid Background="Blue">
                <TextBlock Text="{Binding Description}" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center"/>
            </Grid>
        </DataTemplate>
        <DataTemplate DataType="{x:Type local:DescribableThree}">
            <Grid Background="Green">
                <TextBlock Text="{Binding Description}" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center"/>
            </Grid>
        </DataTemplate>
    </Grid.Resources>

    <StackPanel Orientation="Horizontal">
        <Button Command="{Binding AddOne}">Add One</Button>
        <Button Command="{Binding AddTwo}">Add Two</Button>
        <Button Command="{Binding AddThree}">Add Three</Button>
    </StackPanel>

    <TabControl Grid.Row="1" ItemsSource="{Binding DynamicallyGeneratedTabs}"/>

</Grid>

还有视图模型：

public class TabControlViewModel
{
    public TabControlViewModel()
    {
        AddOne = new RelayCommand(DoAddOne);
        AddTwo = new RelayCommand(DoAddTwo);
        AddThree = new RelayCommand(DoAddThree);
        DynamicallyGeneratedTabs = new ObservableCollection<IDescribable>();
    }

    public ICommand AddOne { get; }
    public ICommand AddTwo { get; }
    public ICommand AddThree { get; }

    public ObservableCollection<IDescribable> DynamicallyGeneratedTabs { get; }

    private void DoAddOne()
    {
        DynamicallyGeneratedTabs.Add(new DescribableOne());
    }

    private void DoAddTwo()
    {
        DynamicallyGeneratedTabs.Add(new DescribableTwo());
    }

    private void DoAddThree()
    {
        DynamicallyGeneratedTabs.Add(new DescribableThree());
    }
}

public interface IDescribable
{
    string Description { get; }
}

public class DescribableOne : IDescribable
{
    public DescribableOne()
    {
        Description = "One";
    }

    public string Description { get; }
}

public class DescribableTwo : IDescribable
{
    public DescribableTwo()
    {
        Description = "Two";
    }

    public string Description { get; }
}

public class DescribableThree : IDescribable
{
    public DescribableThree()
    {
        Description = "Three";
    }

    public string Description { get; }
}