在 xaml 中创建选项卡模板

Question

我正在尝试创建一个 WPF 选项卡式窗口，该窗口将包含动态数量的选项卡。但是，每个选项卡的格式相同并包含相同的控件（不是相同的实例，而是相同的控件类）。每个选项卡将具有以下形式：

    <TabItem>
        <TabItem.Header>
            <TextBlock>C1</TextBlock>
        </TabItem.Header>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition Height="Auto"></RowDefinition>
            </Grid.RowDefinitions>

            <Grid Grid.Row="1" Grid.Column="0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"></ColumnDefinition>
                    <ColumnDefinition Width="Auto"></ColumnDefinition>
                    <ColumnDefinition></ColumnDefinition>
                    <ColumnDefinition Width="Auto"></ColumnDefinition>
                    <ColumnDefinition Width="Auto"></ColumnDefinition>
                </Grid.ColumnDefinitions>
                <Label Grid.Column="0">Ancorage</Label>
                <ComboBox Grid.Column="1" Width="65" SelectedIndex="1">
                    <ComboBoxItem>Active</ComboBoxItem>
                    <ComboBoxItem>Passive</ComboBoxItem>
                </ComboBox>

                <Label Grid.Column="3" HorizontalAlignment="Right">Ancorage</Label>
                <ComboBox Grid.Column="4" Width="65" HorizontalAlignment="Right">
                    <ComboBoxItem>Active</ComboBoxItem>
                    <ComboBoxItem>Passive</ComboBoxItem>
                </ComboBox>
            </Grid>
            <Grid Grid.Row="2">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"></ColumnDefinition>
                    <ColumnDefinition Width="Auto"></ColumnDefinition>
                </Grid.ColumnDefinitions>
                <Label Grid.Column="0"># Sections</Label>
                <xctk:IntegerUpDown Grid.Column="1" Minimum="3" Value="3" ></xctk:IntegerUpDown>
            </Grid>
        </Grid>
    </TabItem>

如何保存此模板，以便在我想创建新选项卡时简单地调用它？

如果我要通过代码创建布局，我会创建一个函数 NewTabItem()，它会为每个控件创建一个新实例，将它们添加到新的 TabItem，然后将此 TabItem 添加到 TabControl，例如（伪-代码）：

void NewTabItem()
{
    Combobox box1 = new Combobox();
    Combobox box2 = new Combobox();
    //... etc
    TabItem tab = new TabItem();
    tab.Add(box1);
    tab.Add(box2);
    tabControl.Add(tab);
}

这样每个控件都是一个新实例，将其中的任何一个添加到 tabControl 应该没有问题。我怎样才能使用 XAML 做这样的事情？

通过ControlTemplate?从我所见，这更多是为了控制单个控件的美观，而不是控件的集合。

通过ItemsControl?这个我根本不知道如何在 XAML 中定义以及如何调用它的新实例以添加到 tabControl（或者我如何将它添加到 tabControl，就此而言）。

通过其他方法？这甚至可以完成还是应该以编程方式构建此布局？

Answer 1

在单独的 .xaml 中将您的选项卡布局定义为 UserControl：

<UserControl x:Class="MyProject.MyTab"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"></ColumnDefinition>
        </Grid.ColumnDefinitions>
        ...
    </Grid>
</UserControl>

这样您仍然可以轻松设计它。添加新标签很容易。

<TabControl Name="Tabs">
    <TabItem>
        <TabItem.Header>
            <TextBlock>C1</TextBlock>
        </TabItem.Header>
        <local:MyTab/>
    </TabItem>
    <TabItem>
        <TabItem.Header>
            <TextBlock>C2</TextBlock>
        </TabItem.Header>
        <local:MyTab/>
    </TabItem>
</TabControl>

如果您选择以编程方式添加新标签，只需：

var item = new TabItem
{
    Header = "C",
    Content = new MyTab()
};
Tabs.Items.Add(item);