WPF：如何在使用数据绑定时将 controlTemplate 应用于 TabControl tabItem Header？答案

【问题标题】：WPF: How to apply a controlTemplate to a TabControl's tabItem Header while using Databinding?WPF：如何在使用数据绑定时将 controlTemplate 应用于 TabControl tabItem Header？
【发布时间】：2014-06-01 02:20:14
【问题描述】：

我有一个 TabControl，它通过 DataBinding 获取选项卡和内容。而不是普通的选项卡，我希望所有选项卡的选项卡都具有自定义形状（例如，椭圆），所以我有一个 ControlTemplate，我想将其应用于所有选项卡。作为 WPF 的新手，我只是对如何应用感到困惑使用数据绑定时将 controlTemplate 转换为 TabControl 的 tabItem 标头？

<Window.Resources>
    <ControlTemplate x:Key="TabItemControlTemplate1" TargetType="{x:Type TabItem}">
        <Grid SnapsToDevicePixels="True">
            <Border CornerRadius="12" x:Name="Bd" BorderBrush="Red" BorderThickness="1" Padding="{TemplateBinding Padding}">
               <ContentPresenter x:Name="Content" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" ContentStringFormat="{TemplateBinding HeaderStringFormat}" ContentSource="Header" HorizontalAlignment="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{Binding VerticalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}"/>
            </Border>
        </Grid>

    </ControlTemplate>
</Window.Resources>

<Grid x:Name="LayoutRoot">
     <TabControl
    ItemsSource="{Binding CarCollection}">
                <TabControl.ItemTemplate>
                    <!-- this is the header template-->
                    <DataTemplate>
                        <TextBlock
                Text="{Binding DisplayName}" />
                    </DataTemplate>
                </TabControl.ItemTemplate>
                <TabControl.ContentTemplate>
                    <!-- this is the body of the TabItem template-->
                    <DataTemplate>
                        <ContentControl
                Content="{Binding Value}" />
                    </DataTemplate>
                </TabControl.ContentTemplate>
            </TabControl>
</Grid>

在不使用数据绑定的情况下，我知道如何应用它。问题是当使用数据绑定时，我可以通过下面的代码来实现。

<TabControl HorizontalAlignment="Left" Height="224" Margin="72,66,0,0" VerticalAlignment="Top" Width="412">
        <TabItem Header="TabItem" Template="{DynamicResource TabItemControlTemplate1}" Height="19.96" VerticalAlignment="Top">
            <Grid Background="#FFE5E5E5"/>
        </TabItem>
        <TabItem Header="TabItem">
            <Grid Background="#FFE5E5E5"/>
        </TabItem>
    </TabControl>

有什么帮助吗？

【问题讨论】：

标签： wpf xaml data-binding controltemplate tabitem

【解决方案1】：

您可以尝试使用Style 设置绑定生成的TabItem 的Template：

<TabControl ItemsSource="{Binding CarCollection}">
    <TabControl.Resources>
        <Style TargetType="TabItem">
            <Setter Property="Template" Value="{DynamicResource TabItemControlTemplate1}"/>
        </Style>
    </TabControl.Resources>
    <TabControl.ItemTemplate>
        <!-- this is the header template-->
        <DataTemplate>
            <TextBlock Text="{Binding DisplayName}" />
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <!-- this is the body of the TabItem template-->
        <DataTemplate>
            <ContentControl Content="{Binding Value}" />
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>

【讨论】：