Question

我想创建一个TabControl，其中所有TabItem具有相同的一般外观但内部具有不同的图标。我的所有样式都在外部资源字典中。在主窗口中，我声明了我的控制：

<TabControl Grid.Row="2" TabStripPlacement="Left" >
        <TabItem Style="{StaticResource IconDev}">
            <Label Content="Content 1" />
        </TabItem>
        <TabItem Style="{StaticResource IconTab}">
            <Label Content="Content 2" />
        </TabItem>
    </TabControl

然后我创造了两种风格。首先是Tab项的一般外观，然后专门用于图标：

<Style x:Key="IconTab" TargetType="{x:Type TabItem}">
    <Setter Property="MinHeight" Value="70"/>
    <Setter Property="MaxHeight" Value="70"/>
    <Setter Property="MinWidth" Value="70"/>
    <Setter Property="MaxWidth" Value="70"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TabItem}">
                <Grid>
                    <Border 
                        Name="Border"
                        Margin="0,0,-4,0" 
                        Background="#FFF"
                        BorderBrush="#FFF" 
                        BorderThickness="0" 
                        CornerRadius="0" >
                        <ContentPresenter x:Name="ContentSite"
                              VerticalAlignment="Center"
                              HorizontalAlignment="Center"
                              ContentSource="Header"
                              Margin="0"
                              RecognizesAccessKey="True"/>
                    </Border>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsSelected" Value="True">
                        <Setter Property="Panel.ZIndex" Value="100" />
                        <Setter TargetName="Border" Property="Background" Value="#000" />
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter TargetName="Border" Property="Background" Value="#000" />
                        <Setter TargetName="Border" Property="BorderBrush" Value="#000"/>
                        <Setter Property="Foreground" Value="#000"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<Style x:Key="IconDev" TargetType="{x:Type TabItem}" BasedOn="{StaticResource IconTab}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate>
                <TabItem>
                    <TabItem.Header>
                        <StackPanel>
                            <Viewbox Width="50" Height="50">
                                <Frame Source="icon-dev.xaml" />
                            </Viewbox>
                        </StackPanel>
                    </TabItem.Header>
                </TabItem>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

然而，某些内容与继承无关，因为Style="{StaticResource IconDev}"仅插入图标，但它不会应用Style="{StaticResource IconTab}"中声明的一般布局。我做错了什么？

Answer 1

IconDev应该应用最小/最大尺寸设置（从基本样式继承）。它还重置（覆盖，擦除）TabItem的模板。新模板没有触发器。大小设置器独立于模板设置器，它们可以工作

单个标签的标题页内容可以从外部更改，而不是在模板

中更改

E.g。 TabItem都使用IconTab样式，第一个标签具有复杂的标题内容

<TabControl TabStripPlacement="Left" >
    <TabItem Style="{StaticResource IconTab}">
        <!--Label is a tab content-->
        <Label Content="Content 1" />

        <TabItem.Header>
            <StackPanel>
                <Viewbox Width="50" Height="50">
                    <Frame Source="icon-dev.xaml" />
                </Viewbox>
            </StackPanel>
        </TabItem.Header>
    </TabItem>

    <TabItem Style="{StaticResource IconTab}" Header="Text">
        <Label Content="Content 2" />
    </TabItem>
</TabControl>

更新：派生样式只能更改标题而不会覆盖模板

<Style x:Key="IconDev" TargetType="{x:Type TabItem}" BasedOn="{StaticResource IconTab}">
    <Setter Property="Header">
        <Setter.Value>
                <StackPanel>
                    <Viewbox Width="50" Height="50">
                        <Frame Source="icon-dev.xaml" />
                    </Viewbox>
                </StackPanel>
        </Setter.Value>
    </Setter>
</Style>

<TabControl  TabStripPlacement="Left" >
    <TabItem Style="{StaticResource IconDev}">
        <Label Content="Content 1" />                
    </TabItem>
    <TabItem Style="{StaticResource IconTab}" Header="Text">
        <Label Content="Content 2" />
    </TabItem>
</TabControl>

风格不会从另一个继承

1 个答案: