如何在WPF中更改单个标签项标题的背景?

时间:2012-04-11 10:13:53

标签: c# .net wpf tabcontrol tabitem

我一直在WPF XAML(.NET 4)中对TabControl进行样式化,我所能做的就是根据触发器设置一个选项卡,或者将它们设置为相同的样式。是否有任何方式只有第一个选项卡风格化不同,而其他选项卡的风格化不同于第一个选项卡但彼此相同(使用选项卡索引来设置TabItem的风格)。

谢谢。

2 个答案:

答案 0 :(得分:5)

您可以使用AlternationCount和AlternationIndex:

<TabControl AlternationCount="{Binding Path=Items.Count,RelativeSource={RelativeSource Self}}">
    <TabControl.ItemContainerStyle>
        <Style TargetType="TabItem">
            <Style.Triggers>
                <Trigger Property="ItemsControl.AlternationIndex"
                            Value="0"> <!-- First item -->
                    <Setter Property="FontWeight"
                            Value="Bold"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </TabControl.ItemContainerStyle>
    <TabItem Header="First"/>
    <TabItem Header="Second"/>
    <TabItem Header="Third"/>
    <TabItem Header="Fourth"/>
</TabControl>

答案 1 :(得分:3)

如果您想更改所选标签项的背景颜色,请使用该样式并将该样式应用于标签项。

<Style TargetType="{x:Type TabItem}" x:Key="TabItemStyle">
    <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Grid>
                        <Border Name="Border" Background="Red" BorderBrush="#FF1467AF"
                                    BorderThickness="1" 
                                    Margin="0,0,5,0" CornerRadius="8,8,0,0" SnapsToDevicePixels="True">
                            <TextBlock FontFamily="Arial" FontWeight="Bold" FontSize="16" HorizontalAlignment="Center" VerticalAlignment="Center" Name="TextBlock" Foreground="White">
                      <ContentPresenter VerticalAlignment="Center"  HorizontalAlignment="Center" ContentSource="Header" Margin="12,2,12,2"/>
                            </TextBlock>
                        </Border>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter TargetName="Border" Property="Background" Value="Yellow"/>

                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
 </Style>

但是,如果您只想更改第一个标签项的背景颜色,请定义两个样式并将一个应用于第一个标签项,将第二个应用于其他

标签项目1的样式:

<Style TargetType="{x:Type TabItem}" x:Key="TabItemStyleForFirst">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Grid>
                        <Border Name="Border" Background="Red" BorderBrush="#FF1467AF"
                                    BorderThickness="1" 
                                    Margin="0,0,5,0" CornerRadius="8,8,0,0" SnapsToDevicePixels="True">
                            <TextBlock FontFamily="Arial" FontWeight="Bold" FontSize="16" HorizontalAlignment="Center" VerticalAlignment="Center" Name="TextBlock" Foreground="White">
                      <ContentPresenter VerticalAlignment="Center"  HorizontalAlignment="Center" ContentSource="Header" Margin="12,2,12,2"/>
                            </TextBlock>
                        </Border>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
 </Style>

其他标签项的样式:

<Style TargetType="{x:Type TabItem}" x:Key="TabItemStyleForOther">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Grid>
                        <Border Name="Border" Background="Yellow" BorderBrush="#FF1467AF"
                                    BorderThickness="1" 
                                    Margin="0,0,5,0" CornerRadius="8,8,0,0" SnapsToDevicePixels="True">
                            <TextBlock FontFamily="Arial" FontWeight="Bold" FontSize="16" HorizontalAlignment="Center" VerticalAlignment="Center" Name="TextBlock" Foreground="White">
                      <ContentPresenter VerticalAlignment="Center"  HorizontalAlignment="Center" ContentSource="Header" Margin="12,2,12,2"/>
                            </TextBlock>
                        </Border>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
 </Style>