WPFタブコントロール個々のタブコンテンツのテンプレートをオーバーライドします

Question

いくつかの静的タブを持つタブコントロールがあります。しかし、私はまたいくつかの追加のタブを動的に追加したいと思います。したがって、（TabControl.ItemTemplateを使用して）ヘッダーテンプレートと（TabControl.ContentTemplateを使用して）コンテンツテンプレートを定義しました。しかし、静的タブは異なるコンテンツを表示するので、個々のタブアイテムのコンテンツテンプレートを設定します。ただし、何らかの理由で、タブのコンテンツを設定するために作成したアイテムのコンテンツテンプレートもヘッダーに適用されます。

添付のスクリーンショットとコードから、タブヘッダーが「電子メール」に設定されている間、ヘッダーとコンテンツセクションの両方にタブのコンテンツが表示されていることがわかります。

さらに詳しい説明が必要な場合は教えてください。

<TabControl Name="ResultsTabControl" SelectionChanged="Selector_OnSelectionChanged" Margin="-2,2" SelectedIndex="{Binding SelectedResultsTab, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"> 

<TabControl.Resources> 
    <Style TargetType="TabItem" BasedOn="{StaticResource AccentedMetroTabItemStyle}"></Style> 
</TabControl.Resources> 

<TabControl.ItemTemplate> 
    <DataTemplate> 
     <TextBlock Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type TabItem}}, Path=Header}" /> 
    </DataTemplate> 
</TabControl.ItemTemplate> 

<TabControl.ContentTemplate> 
    <DataTemplate> 
     <TextBlock Text="Testing"/> 
    </DataTemplate> 
</TabControl.ContentTemplate> 

<TabItem Name="EmailListTab" Header="Emails" Style="{StaticResource AccentedMetroTabItemStyle}"> 
    <TabItem.ContentTemplate> 
     <DataTemplate> 
       <TextBlock Text="My Emails Tab"/> 
     </DataTemplate> 
    </TabItem.ContentTemplate> 
</TabItem> 

<Style x:Key="AccentedMetroTabItemStyle" TargetType="{x:Type TabItem}"> 
    <Setter Property="Padding" Value="2 1 2 1" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type TabItem}"> 
       <Border x:Name="Border" 
         HorizontalAlignment="Stretch" 
         Background="{TemplateBinding Background}" 
         BorderBrush="{TemplateBinding BorderBrush}" 
         BorderThickness="{TemplateBinding BorderThickness}" 
         SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"> 
        <StackPanel HorizontalAlignment="Stretch" Orientation="Vertical"> 
         <StackPanel Margin="{TemplateBinding Padding}" Orientation="Horizontal"> 
          <controls1:ContentControlEx x:Name="ContentSite" 
                 Margin="0 2 2 0" 
                 Padding="{TemplateBinding Padding}" 
                 Foreground="{TemplateBinding Foreground}" 
                 FontSize="15" 
                 FontWeight="{TemplateBinding controls1:ControlsHelper.HeaderFontWeight}" 
                 FontStretch="{TemplateBinding controls1:ControlsHelper.HeaderFontStretch}" 
                 Content="{TemplateBinding Header}" 
                 ContentCharacterCasing="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(controls1:ControlsHelper.ContentCharacterCasing)}" 
                 ContentStringFormat="{TemplateBinding ContentStringFormat}" 
                 ContentTemplate="{TemplateBinding ContentTemplate}" 
                 ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}" 
                 RecognizesAccessKey="True" 
                 SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" /> 
         </StackPanel> 
         <Rectangle x:Name="Underline" 
            Height="2" 
            Margin="0 1 0 0" 
            HorizontalAlignment="Stretch" 
            Visibility="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type TabControl}}, Path=(controls1:TabControlHelper.IsUnderlined), Converter={StaticResource BooleanToVisibilityConverter}}" /> 
        </StackPanel> 
       </Border> 
       <ControlTemplate.Triggers> 

        <Trigger Property="IsSelected" Value="true"> 
         <Setter TargetName="ContentSite" Property="TextElement.Foreground" Value="{DynamicResource AccentColorBrush}" /> 
         <Setter TargetName="Underline" Property="Fill" Value="{DynamicResource AccentColorBrush}" /> 
        </Trigger> 
        <Trigger Property="IsSelected" Value="false"> 
         <Setter TargetName="ContentSite" Property="TextElement.Foreground" Value="{DynamicResource GrayNormalBrush}" /> 
         <Setter TargetName="Underline" Property="Fill" Value="{DynamicResource GrayNormalBrush}" /> 
        </Trigger> 
        <Trigger SourceName="ContentSite" Property="IsMouseOver" Value="True"> 
         <Setter TargetName="ContentSite" Property="TextElement.Foreground" Value="{DynamicResource GrayHoverBrush}" /> 
         <Setter TargetName="Underline" Property="Fill" Value="{DynamicResource GrayHoverBrush}" /> 
        </Trigger> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition SourceName="ContentSite" Property="IsMouseOver" Value="True" /> 
          <Condition Property="IsSelected" Value="True" /> 
         </MultiTrigger.Conditions> 
         <Setter TargetName="ContentSite" Property="TextElement.Foreground" Value="{DynamicResource HighlightBrush}" /> 
         <Setter TargetName="Underline" Property="Fill" Value="{DynamicResource HighlightBrush}" /> 
        </MultiTrigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Answer 1

事は、我々がcontrols1:ContentControlExに何が起こるか分からないということです。

そして、基本的に、あなたのスタイルでヘッダのContentPresenterが欠落しています

<ContentPresenter x:Name="contentPresenter" ContentSource="Header" Focusable="False" HorizontalAlignment="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/> 

それはcontrols1:ContentControlExの一部である可能性がありますが、その後、あなたは同様にそれを表示する必要があります。