WPF ItemTab Style

Question

我在我的应用程序中使用tabcontrol作为菜单。我想样式它和项目标题现在看起来很棒。问题是，这会在"content"区域产生效果，但这不是我想要的。

这是我的窗口

中的代码

<TabControl Name="Tab_Content" Grid.Row="1" TabStripPlacement="Left" >
        <TabControl.Resources>
            <Style TargetType="TabItem">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="TabItem">
                            <Grid Name="Panel">
                                <ContentPresenter x:Name="ContentSite"
                                    VerticalAlignment="Center"
                                    HorizontalAlignment="Left"
                                    ContentSource="Header"
                                    Height="25"
                                    Margin="5,10,0,0"  Width="150" />
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsSelected" Value="True">
                                    <Setter Property="Foreground" Value="Blue" />
                                    <Setter Property="FontWeight" Value="Bold" />
                                    <Setter TargetName="Panel" Property="Background" Value="White" />
                                </Trigger>
                                <Trigger Property="IsSelected" Value="False">
                                    <Setter Property="Foreground" Value="Black" />
                                    <Setter TargetName="Panel" Property="Background" Value="White" />
                                </Trigger>
                                <Trigger Property="IsMouseOver" Value="True">
                                    <Setter Property="Foreground" Value="White" />
                                    <Setter TargetName="Panel" Property="Background" Value="Blue" />
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </TabControl.Resources> 
        <TabItem Name="item_Home"  Header="Home" >
            <Grid>
                <Label Name="Test" Content="hello" />
            </Grid>
        </TabItem>

这是它的样子:

当前视图

是否有一种方法可以单独设置内容区域的样式?

Answer 1

尝试为header textblock设置样式并引用祖先TabItem。

XAML:

<Style TargetType="{x:Type TextBlock}" x:Key="toggleTabStyle">
    <Setter Property="Foreground" Value="Black" />
    <Setter  Property="Background" Value="White" />
    <Style.Triggers>
        <DataTrigger Binding="{Binding Path=IsSelected, RelativeSource={RelativeSource AncestorType=TabItem}}" Value="True">
            <Setter Property="Foreground" Value="Blue" />
            <Setter Property="FontWeight" Value="Bold" />
            <Setter Property="Background" Value="White" />
        </DataTrigger>
        <DataTrigger Binding="{Binding Path=IsSelected, RelativeSource={RelativeSource AncestorType=TabItem}}" Value="False">
            <Setter Property="Foreground" Value="Black" />
            <Setter Property="Background" Value="White" />
        </DataTrigger>
        <DataTrigger Binding="{Binding Path=IsMouseOver, RelativeSource={RelativeSource AncestorType=TabItem}}" Value="True">
            <Setter Property="Foreground" Value="White" />
            <Setter Property="Background" Value="Blue" />
        </DataTrigger>
    </Style.Triggers>
</Style>

和每个TabItem中的引用:

    <TabItem>
        <TabItem.Header>
            <TextBlock Text="Header Text Here" Style="{StaticResource toggleTabStyle}"/>
        </TabItem.Header>                        
        ...
    </TabItem>