Отключить изменение границы и фона на выбранном TabItem wpf

В моем документе WPF у меня есть это:

<Window.Resources>
    <Style x:Key="SidebarTab" TargetType="TabItem">

        <Setter Property="Foreground"  Value="#303030"></Setter>
        <Setter Property="BorderBrush"  Value="Transparent"></Setter>
        <Setter Property="BorderThickness"  Value="0"></Setter>
        <Setter Property="Background"  Value="#151515"></Setter>

        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Foreground" Value="{StaticResource PrimaryHueMidBrush}"></Setter>
                <Setter Property="BorderBrush"  Value="Transparent"></Setter>
                <Setter Property="BorderThickness"  Value="0"></Setter>
                <Setter Property="Background"  Value="#151515"></Setter>
            </Trigger>
        </Style.Triggers>

    </Style>
</Window.Resources>

<Border Background="#151515" CornerRadius="20">
    <Grid Margin="23,47,0,0">
        <TabControl TabStripPlacement="Left" Style="{DynamicResource SidebarTabControl}">
            <TabItem Style="{DynamicResource SidebarTab}">
                <TabItem.Header>
                    <materialDesign:PackIcon Kind="EmoticonLol" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                </TabItem.Header>
            </TabItem>
            <TabItem Style="{DynamicResource SidebarTab}">
                <TabItem.Header>
                    <materialDesign:PackIcon Kind="EmoticonLol" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                </TabItem.Header>
            </TabItem>
            <TabItem Style="{DynamicResource SidebarTab}">
                <TabItem.Header>
                    <materialDesign:PackIcon Kind="EmoticonLol" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                </TabItem.Header>
            </TabItem>
            <TabItem Style="{DynamicResource SidebarTab}">
                <TabItem.Header>
                    <materialDesign:PackIcon Kind="EmoticonLol" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                </TabItem.Header>
            </TabItem>
            <TabItem Style="{DynamicResource SidebarTab}">
                <TabItem.Header>
                    <materialDesign:PackIcon Kind="EmoticonLol" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                </TabItem.Header>
            </TabItem>
        </TabControl>
    </Grid>
</Border>

И это выглядит так:

введите здесь описание изображения

Я получаю желаемый эффект изменения цвета значка на TabItem, но Background и BorderBrush (а также BorderThickness) все еще изменяются, чтобы как бы «связать» с содержимым внутри заголовка, и это то, что я хочу удалить :

введите здесь описание изображения

Я добавил вещи внутри стиля следующим образом:

 <Style.Triggers>
    <Trigger Property="IsSelected" Value="True">
        <Setter Property="Foreground" Value="{StaticResource PrimaryHueMidBrush}"></Setter>
        <Setter Property="BorderBrush"  Value="Transparent"></Setter>
        <Setter Property="BorderThickness"  Value="0"></Setter>
        <Setter Property="Background"  Value="#151515"></Setter>
    </Trigger>
</Style.Triggers>

Но это все еще не работает. Есть ли у кого-нибудь предложения о том, как это сделать?


person HelloKiddy987    schedule 16.05.2020    source источник


Ответы (1)


Я пробовал с вашими стилями, и я также могу получить границу. Причина этого в том, что шаблон TabItem по умолчанию имеет цвет и толщину границы, которые ваши свойства, когда вы определяете свои цвета, все еще не применяются к ним.

Итак, что вам нужно сделать, так это переопределить шаблон элемента управления для элемента вкладки.

Я внес основные изменения, переопределив свойство Template объекта TabItem, добавил кое-что и привязал BorderThickness, BorderBrush и Background.

<Style x:Key="SidebarTab" TargetType="TabItem">

        <Setter Property="Foreground"  Value="#303030"></Setter>
        <Setter Property="BorderBrush"  Value="Red"></Setter>
        <Setter Property="BorderThickness"  Value="1"></Setter>
        <Setter Property="Background"  Value="White"></Setter>

        <!--I have added this START-->
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="TabItem">
                    <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}"
                            Background="{TemplateBinding Background}">
                        <ContentPresenter ContentSource="Header" />
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
       <!--I have added this END-->

        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Foreground" Value="Blue"></Setter>
                <Setter Property="BorderBrush"  Value="Transparent"></Setter>
                <Setter Property="BorderThickness"  Value="0"></Setter>
                <Setter Property="Background"  Value="Yellow"></Setter>
            </Trigger>
        </Style.Triggers>

    </Style>

Примечание. Я изменил значения свойств Передний план, Фон и Толщина границы в приведенном выше коде для целей тестирования, но не смог найти статические ресурсы. Вы должны вернуться к своим ключам.

Надеюсь, я дал вам понять, что вы можете двигаться дальше. Попробуйте, и если вы обнаружите какие-либо проблемы, дайте мне знать.

person G K    schedule 16.05.2020
comment
Если я правильно понял, что есть шаблон свойств с определенным стилем по умолчанию, где я могу найти этот стиль? не могли бы вы дать ссылку, если можно? Я искал систему . windows.controls.controltemplate, но это скорее переопределение стиля. - person Cfun; 16.05.2020
comment
Да вы правы. Каждый элемент управления определяет свой собственный шаблон по умолчанию. Если вы хотите увидеть шаблон по умолчанию для любого данного элемента управления, вы можете перейти по этой ссылке stackoverflow.com/questions/8825030/ . Надеюсь, я ответил на ваш вопрос. - person G K; 16.05.2020