将样式应用于第一个子项

本文关键字：第一个 应用于 样式 | 更新日期: 2023-09-27 18:25:42

有没有办法将样式应用于容器的第一个子（或最后一个子或第n个子）（任何包含子的东西）？我正在尝试自定义选项卡项的外观，以便第一个选项卡项与其他选项卡项具有不同的边界半径。

这就是我现在拥有的：

<ControlTemplate TargetType="{x:Type TabItem}">
    <Grid>
        <Border Name="Border" BorderBrush="#666" BorderThickness="1,1,1,0" CornerRadius="8,8,0,0" Margin="0,0,0,-1">
            <TextBlock x:Name="TabItemText" Foreground="#444" Padding="6 2" TextOptions.TextFormattingMode="Display">
                <ContentPresenter x:Name="ContentSite" VerticalAlignment="Center" HorizontalAlignment="Center" ContentSource="Header" Margin="12,2,12,2"/>
            </TextBlock>
        </Border>
    </Grid>
</ControlTemplate>

将样式应用于第一个子项

对于ItemsControl派生类（如TabControl），可以使用ItemContainerStyle Selector依赖属性。设置此依赖属性后，ItemsControl将为控件中的每个项调用StyleSelect.SelectStyle（）。这将允许您对不同的项目使用不同的样式。

以下示例更改TabControl中的最后一个选项卡项，使其文本为粗体，并且比其他选项卡稍大。

首先，新的StyleSelector类：

class LastItemStyleSelector : StyleSelector
{
    public override Style SelectStyle(object item, DependencyObject container)
    {
        var itemsControl = ItemsControl.ItemsControlFromItemContainer(container);
        var index = itemsControl.ItemContainerGenerator.IndexFromContainer(container);
        if (index == itemsControl.Items.Count - 1)
        {
            return (Style)itemsControl.FindResource("LastItemStyle");
        }
        return base.SelectStyle(item, container);
    }
}

此样式选择器将返回带有键"LastItemStyle"的样式，但仅用于控件中的最后一项。其他项目将使用默认样式。（请注意，此函数只使用ItemsControl中的成员。它也可以用于其他ItemsControl派生类。）接下来，在XAML中，您首先需要创建两个资源。第一个资源将用于此LastItemStyleSelector，第二个资源是样式。

<Window.Resources>
    <local:LastItemStyleSelector x:Key="LastItemStyleSelector" />
    <Style x:Key="LastItemStyle" TargetType="TabItem">
        <Setter Property="FontWeight" Value="Bold" />
        <Setter Property="FontSize" Value="16" />
    </Style>
</Window.Resources>

最后是你的TabControl:

    <TabControl ItemContainerStyleSelector="{StaticResource LastItemStyleSelector}">
        <TabItem Header="First" />
        <TabItem Header="Second" />
        <TabItem Header="Third" />
    </TabControl>

有关更多信息，请参阅MSDN文档：

  • ItemsControl.ItemContainerStyle Selector属性
  • 样式选择器类

与HTML和CSS不同，没有一种简单的方法可以确定和触发这种类型的更改。

你可以写一个触发器，并使用一个值转换器来做类似的事情，使用这个论坛帖子作为潜在的灵感。

更简单的方法是将自定义样式应用于您希望看起来不同的选项卡项。你试过了吗？

<TabItem Header="TabItem" Style="{DynamicResource FirstTabStyle}">
    <Grid Background="#FFE5E5E5"/>
</TabItem>
相关文章：