从聚焦的 TabItem 中删除边框底部

问题描述 投票:0回答:1

单击选项卡项后,我想删除底部的边框。 目前我有这个:

现在我想删除标记的边框部分。

我搜索了很多,发现了这个:

选项卡项和选项卡控件边框样式

去掉选项卡控件的该选项卡下的线条

这两种方法我都尝试了很长时间..但没有成功。

我的代码:

<Style x:Key="MainMenu" TargetType="{x:Type TabControl}">
        <Setter Property="HorizontalAlignment" Value="Stretch"/>
        <Setter Property="SnapsToDevicePixels" Value="True"/>
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="Padding" Value="0"/>

        <Setter Property="Template">
            <Setter.Value>

                <ControlTemplate TargetType="{x:Type TabControl}">
                    <Grid KeyboardNavigation.TabNavigation="Local">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>

                        <TabPanel x:Name="HeaderPanel" 
                                  Grid.Row="0" 
                                  Panel.ZIndex="1" 
                                  IsItemsHost="True" 
                                  KeyboardNavigation.TabIndex="1" 
                                  Background="Transparent" />

                        <Border x:Name="Border"
                                Grid.Row="1"
                                BorderThickness="0 1 0 0"
                                BorderBrush="Red"
                                Background="LightGray"
                                KeyboardNavigation.TabNavigation="Local"
                                KeyboardNavigation.DirectionalNavigation="Contained"
                                KeyboardNavigation.TabIndex="2">

                            <ContentPresenter x:Name="PART_SelectedContentHost"
                                          ContentSource="SelectedContent" />
                        </Border>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="MainMenuItem" TargetType="{x:Type TabItem}">
        <Setter Property="Foreground" Value="Black"/>
        <Setter Property="FontSize" Value="13px"/>
        <Setter Property="Cursor" Value="Hand"/>

        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Grid>
                        <Border 
                            Name="Border"
                            Background="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"
                            BorderBrush="Black" 
                            Padding="10px"
                            Margin="10 10 10 0"
                            BorderThickness="1,1,1,0">
                            
                            <ContentPresenter x:Name="ContentSite"
                                        VerticalAlignment="Center"
                                        HorizontalAlignment="Center"
                                        ContentSource="Header"/>
                        </Border>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsFocused" Value="True" >
                            <Setter Property="Background" TargetName="Border" Value="{DynamicResource {x:Static SystemColors.ControlLightBrushKey}}" />
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True" >
                            <Setter Property="Background" TargetName="Border" Value="{DynamicResource {x:Static SystemColors.ControlLightBrushKey}}" />
                        </Trigger>
                        <Trigger Property="IsSelected" Value="True" >
                            <Setter Property="Background" TargetName="Border" Value="{DynamicResource {x:Static SystemColors.ControlLightBrushKey}}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
c# wpf styles tabcontrol
1个回答
0
投票

要从仅选定的 TabItem 中删除红线,请将样式更新为:

    <Style x:Key="MainMenuItem" TargetType="{x:Type TabItem}">
        <Setter Property="Foreground" Value="Black"/>
        <Setter Property="FontSize" Value="13px"/>
        <Setter Property="Cursor" Value="Hand"/>

        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Grid>
                        <Border 
                    Name="Border"
                    Background="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"
                    BorderBrush="Black" 
                    Padding="10px"
                    Margin="10 10 10 0"
                    BorderThickness="1,1,1,0">

                            <ContentPresenter x:Name="ContentSite"
                                VerticalAlignment="Center"
                                HorizontalAlignment="Center"
                                ContentSource="Header"/>
                        </Border>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsFocused" Value="True" >
                            <Setter Property="Background" TargetName="Border" Value="{DynamicResource {x:Static SystemColors.ControlLightBrushKey}}" />
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True" >
                            <Setter Property="Background" TargetName="Border" Value="{DynamicResource {x:Static SystemColors.ControlLightBrushKey}}" />
                        </Trigger>
                        <Trigger Property="IsSelected" Value="True" >
                            <Setter Property="Background" TargetName="Border" Value="{DynamicResource {x:Static SystemColors.ControlLightBrushKey}}" />
                            <Setter Property="Margin" TargetName="Border" Value="10,10,10,-1" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

我所做的是在选择选项卡时添加一个设置器,并仅修改该选项卡项目的边距

© www.soinside.com 2019 - 2024. All rights reserved.