WPF TreeViewItem神秘鼠标悬停风格

时间:2017-12-08 05:37:32

标签: wpf treeviewitem

我的智慧结束了这一点,我在过去两天的大部分时间里一直在玩它并使用谷歌搜索。当我将鼠标悬停在我的TreeView上时,它会按预期工作,直到您在此时越过Expander /文本时,会应用不同的背景和边框画笔。我已经愚蠢地试图消除这一点,似乎没有任何东西可行。我下面的最后一次过度杀戮仍然让我不知道发生了什么。

我认为这是一件简单的事情,只是飞过我的头脑,而且我知道这种愚蠢的触发器不是必需的。

根据要求,这里有截屏Issue

所需要的是您看到文本为蓝色且背景透明的效果。不希望在扩展器上方的背景和边框画笔

<TreeView x:Name="textureTreeView" ItemsSource="{Binding Category}"  Margin="0" SelectedItemChanged="textureTreeView_SelectedItemChanged" Background="#00000000" BorderBrush="{x:Null}" Foreground="#00000000" IsTextSearchEnabled="True">

    <TreeView.Resources>
        <HierarchicalDataTemplate DataType="{x:Type local1:CategoryViewModel}" ItemsSource="{Binding Children}">
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding Name}" IsHitTestVisible="False"/> <!-- This eliminated the text from causing the issue -->
            </StackPanel>
        </HierarchicalDataTemplate>

    </TreeView.Resources>

    <TreeView.ItemContainerStyle>
        <Style TargetType="{x:Type TreeViewItem}">
            <Setter Property="Foreground" Value="#FFA1A1A1"/>
            <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}"/>
            <Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}"/>
            <Setter Property="FontWeight" Value="Normal"/>
                <Style.Triggers>
                    <Trigger Property="IsFocused" Value="True">
                        <Setter Property="FontWeight" Value="Bold"/>
                        <Setter Property="Foreground" Value="#FFFFFFFF"/>
                    </Trigger>

                    <Trigger Property="Expander.IsMouseOver" Value="true">
                        <Setter Property="Background"  Value="#00000000"/>
                        <Setter Property="BorderBrush" Value="#00000000"/>
                        <Setter Property="Foreground" Value="#FF58A6C3"/>
                    </Trigger>

                    <Trigger Property="Grid.IsMouseOver" Value="true">
                        <Setter Property="Background"  Value="#00000000"/>
                        <Setter Property="BorderBrush" Value="#00000000"/>
                        <Setter Property="Foreground" Value="#FF58A6C3"/>
                    </Trigger>
                    <Trigger Property="StackPanel.IsMouseOver" Value="true">
                        <Setter Property="Background"  Value="#00000000"/>
                        <Setter Property="BorderBrush" Value="#00000000"/>
                        <Setter Property="Foreground" Value="#FF58A6C3"/>
                    </Trigger>
                    <Trigger Property="TextBlock.IsMouseOver" Value="true">
                        <Setter Property="Background"  Value="#00000000"/>
                        <Setter Property="BorderBrush" Value="#00000000"/>
                        <Setter Property="Foreground" Value="#FF58A6C3"/>
                    </Trigger>
                    <Trigger Property="ItemsPresenter.IsMouseOver" Value="true">
                        <Setter Property="Background"  Value="#00000000"/>
                        <Setter Property="BorderBrush" Value="#00000000"/>
                        <Setter Property="Foreground" Value="#FF58A6C3"/>
                    </Trigger>
                    <Trigger Property="Path.IsMouseOver" Value="true">
                        <Setter Property="Background"  Value="#00000000"/>
                        <Setter Property="BorderBrush" Value="#00000000"/>
                        <Setter Property="Foreground" Value="#FF58A6C3"/>
                    </Trigger>
                    <Trigger Property="ToggleButton.IsMouseOver" Value="true">
                        <Setter Property="Background"  Value="#00000000"/>
                        <Setter Property="BorderBrush" Value="#00000000"/>
                        <Setter Property="Foreground" Value="#FF58A6C3"/>
                    </Trigger>
                    <Trigger Property="ToggleButton.IsChecked" Value="true">
                        <Setter Property="Background"  Value="#00000000"/>
                        <Setter Property="BorderBrush" Value="#00000000"/>
                        <Setter Property="Foreground" Value="#FF58A6C3"/>
                    </Trigger>

                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition   Property="IsMouseOver" Value="True"/>
                        </MultiTrigger.Conditions>
                        <Setter Property="Background"  Value="#00000000"/>
                        <Setter Property="BorderBrush" Value="#00000000"/>
                        <Setter Property="Foreground" Value="#FF58A6C3"/>
                    </MultiTrigger>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition   Property="ToggleButton.IsMouseOver" Value="true"/>
                            <Condition Property="ToggleButton.IsChecked" Value="true"/>
                        </MultiTrigger.Conditions>
                        <Setter Property="Background"  Value="#00000000"/>
                        <Setter Property="BorderBrush" Value="#00000000"/>
                        <Setter Property="Foreground" Value="#FF58A6C3"/>
                    </MultiTrigger>
                    <MultiTrigger>
                         <MultiTrigger.Conditions>
                             <Condition   Property="ToggleButton.IsMouseOver" Value="true"/>
                             <Condition Property="ToggleButton.IsChecked" Value="false"/>
                         </MultiTrigger.Conditions>
                         <Setter Property="Background"  Value="#00000000"/>
                         <Setter Property="BorderBrush" Value="#00000000"/>
                         <Setter Property="Foreground" Value="#FF58A6C3"/>
                     </MultiTrigger>

                 </Style.Triggers>

             </Style>
         </TreeView.ItemContainerStyle>
     </TreeView>

更新:感谢@ Gui的建议,我已经设法深入了解正在发生的事情。应用该样式的There is an unnamed Border pulling template properties

我已经尝试删除所有的样式模板,我不知道这是从哪里取出的,而我现在正在处理它,我很难解决边界本身设置了不同的风格。

更新:对于我的生活,我无法使用这个边框进行造型,它似乎不是我下载的任何控件模板的一部分。

1 个答案:

答案 0 :(得分:0)

我搞定了! 我尝试了一百万件事,没有模板或镶嵌器会坚持下去。最后,我使用覆盖设置器将控件模板直接放入treeviewitem的样式中,并且它可以工作。我有一个小问题,在treeviewitem的鼠标悬停上设置扩展器填充颜色,但这对我来说不是一个大问题。

在资源中:

<SolidColorBrush x:Key="GlyphBrush" Color="#FFA1A1A1" />
<Style x:Key="ExpandCollapseToggleStyle" TargetType="ToggleButton">
    <Setter Property="Foreground" Value="#FFFFFF"/>
    <Setter Property="Focusable" Value="False"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ToggleButton">
                <Grid Width="15" Height="13" Background="Transparent">
                    <Path x:Name="ExpandPath" HorizontalAlignment="Left"  VerticalAlignment="Center"  Margin="1,1,1,1" Fill="{StaticResource GlyphBrush}" Data="M 4 0 L 8 4 L 4 8 Z"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="Data" TargetName="ExpandPath" Value="M 0 4 L 8 4 L 4 8 Z"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>

</Style>
<Style x:Key="TreeViewItemFocusVisual">
    <Setter Property="Control.Template">
        <Setter.Value>
            <ControlTemplate>
                <Border>
                    <Rectangle Margin="0,0,0,0" StrokeThickness="5" Stroke="#FF717171" StrokeDashArray="1 2" Opacity="0"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

然后在页面中:

   <TreeView x:Name="textureTreeView" ItemsSource="{Binding Category}"   SelectedItemChanged="textureTreeView_SelectedItemChanged" Background="#00000000" BorderBrush="{x:Null}" Foreground="#00000000" IsTextSearchEnabled="True">
        <TreeView.Resources>
            <HierarchicalDataTemplate DataType="{x:Type local1:CategoryViewModel}" ItemsSource="{Binding Children}">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding Name}" IsHitTestVisible="False"/>
                </StackPanel>
            </HierarchicalDataTemplate>
        </TreeView.Resources>
        <TreeView.ItemContainerStyle>
            <Style TargetType="{x:Type TreeViewItem}">
                                        <Setter Property="Background" Value="Transparent"/>
                    <Setter Property="HorizontalContentAlignment" Value="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
                    <Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
                    <Setter Property="Padding" Value="1,0,0,0"/>
                    <Setter Property="Foreground" Value="#FFA1A1A1"/>
                    <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}"/>
                    <Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}"/>
                    <Setter Property="FontWeight" Value="Normal"/>
                    <Setter Property="FocusVisualStyle" Value="{StaticResource TreeViewItemFocusVisual}"/>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type TreeViewItem}">
                                <Grid>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition MinWidth="19" Width="Auto"/>
                                        <ColumnDefinition Width="Auto"/>
                                        <ColumnDefinition Width="*"/>
                                    </Grid.ColumnDefinitions>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto"/>
                                        <RowDefinition/>
                                    </Grid.RowDefinitions>
                                    <ToggleButton x:Name="Expander" Style="{StaticResource ExpandCollapseToggleStyle}" IsChecked="{Binding Path=IsExpanded, RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press"/>
                                    <Border Name="Bd" Grid.Column="1" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
                                        <ContentPresenter x:Name="PART_Header" ContentSource="Header" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"/>
                                    </Border>
                                    <ItemsPresenter x:Name="ItemsHost" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2"/>
                                </Grid>
                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsFocused" Value="True">
                                        <Setter Property="FontWeight" Value="Bold"/>
                                        <Setter Property="Foreground" Value="#FFFFFFFF"/>
                                    </Trigger>

                                    <Trigger Property="IsMouseOver" Value="true">
                                        <Setter Property="Border.Background"  Value="#00000000"/>
                                        <Setter Property="Background"  Value="#00000000"/>
                                        <Setter Property="BorderBrush" Value="#00000000"/>
                                        <Setter Property="Foreground" Value="#FF58A6C3"/>
                                    </Trigger>
                                    <Trigger Property="IsExpanded" Value="false">
                                        <Setter TargetName="ItemsHost" Property="Visibility" Value="Collapsed"/>
                                    </Trigger>
                                    <Trigger Property="HasItems" Value="false">
                                        <Setter TargetName="Expander" Property="Visibility" Value="Hidden"/>
                                    </Trigger>
                                    <MultiTrigger>
                                        <MultiTrigger.Conditions>
                                            <Condition Property="HasHeader" Value="false"/>
                                            <Condition Property="Width" Value="Auto"/>
                                        </MultiTrigger.Conditions>
                                        <Setter TargetName="PART_Header" Property="MinWidth" Value="75"/>
                                    </MultiTrigger>
                                    <MultiTrigger>
                                        <MultiTrigger.Conditions>
                                            <Condition Property="HasHeader" Value="false"/>
                                            <Condition Property="Height" Value="Auto"/>
                                        </MultiTrigger.Conditions>
                                        <Setter TargetName="PART_Header" Property="MinHeight" Value="19"/>
                                    </MultiTrigger>
                                    <Trigger Property="IsSelected" Value="true">
                                        <Setter Property="FontWeight" Value="Bold"/>
                                        <Setter Property="Foreground" Value="#ffffffff"/>
                                    </Trigger>
                                    <MultiTrigger>
                                        <MultiTrigger.Conditions>
                                            <Condition Property="IsSelected" Value="true"/>
                                            <Condition Property="IsSelectionActive" Value="false"/>
                                        </MultiTrigger.Conditions>
                                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
                                    </MultiTrigger>
                                    <Trigger Property="IsEnabled" Value="false">
                                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                                    </Trigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
        </TreeView.ItemContainerStyle>
    </TreeView>