WinRTXamlToolkit.Controls TreeView - Удалить выделение Mouseover

Question

Я использую WinRTXamlToolkit, и в настоящее время я пытаюсь использовать элемент управления TreeView. Он отлично работает, но всякий раз, когда я нажимаю на него курсор или выбираю его, элемент выделяется. Он охватывает весь текст, и я хотел бы изменить цвет переднего плана/фона или, в идеале, полностью удалить цвет выделения. Любая идея, как я могу начать?

Answer 1

Мы можем редактировать Template из TreeViewItem для достижения этой цели. И мы можем найти style and template of TreeViewItem в GitHub.

Mouseover действие элемента в TreeView устанавливается Rectangle под названием "Hover":

<Rectangle x:Name="Hover" 
      Fill="#FFBADDE9" 
      IsHitTestVisible="False" 
      Opacity="0" 
      RadiusX="2" 
      RadiusY="2" 
      Stroke="#FF6DBDD1" 
      StrokeThickness="1" /> 

И "прессованная" VisualState в Button «s VisualStateGroup:

<VisualState x:Name="Pressed"> 
    <Storyboard> 
     <DoubleAnimation Duration="0" 
         Storyboard.TargetName="Hover" 
         Storyboard.TargetProperty="Opacity" 
         To=".5" /> 
    </Storyboard> 
</VisualState> 

Мы можем измените его цвет, установив Fill свойство и непрозрачность, установив DoubleAnimation.To.

Эффект выбор как эффект наведения мыши и устанавливается Rectangle под названием "Выбор":

<Rectangle x:Name="Selection" 
      Grid.Column="1" 
      IsHitTestVisible="False" 
      Opacity="0" 
      RadiusX="2" 
      RadiusY="2" 
      StrokeThickness="1"> 
    <Rectangle.Fill> 
     <SolidColorBrush x:Name="SelectionFill" Color="#FFBADDE9" /> 
    </Rectangle.Fill> 
    <Rectangle.Stroke> 
     <SolidColorBrush x:Name="SelectionStroke" Color="#FF6DBDD1" /> 
    </Rectangle.Stroke> 
</Rectangle> 

и "Selected" VisualState в TreeViewItem «s "SelectionStates" VisualStateGroup:

<VisualState x:Name="Selected"> 
    <Storyboard> 
     <DoubleAnimation Duration="0" 
         Storyboard.TargetName="Selection" 
         Storyboard.TargetProperty="Opacity" 
         To=".75" /> 
    </Storyboard> 
</VisualState> 

Мы можем удалить эффект выбора, удалив анимацию в этом VisualState, как:

<VisualState x:Name="Selected"> 
    <!--<Storyboard> 
     <DoubleAnimation Duration="0" 
         Storyboard.TargetName="Selection" 
         Storyboard.TargetProperty="Opacity" 
         To=".75" /> 
    </Storyboard>--> 
</VisualState> 

Таким образом, вы можете редактировать стиль и шаблон TreeViewItem «s в соответствии с вашими требованиями и дать новый Stylex:Key как

<Style x:Key="MyTreeViewItemStyle" TargetType="controls:TreeViewItem"> 

Затем используйте новый стиль в вашем TreeView, установив ItemContainerStyle как следующее:

<controls:TreeView x:Name="treeView" ItemContainerStyle="{StaticResource MyTreeViewItemStyle}"> 
    <controls:TreeView.ItemTemplate> 
     <DataTemplate> 
      <data:DataTemplateExtensions.Hierarchy> 
       <data:HierarchicalDataTemplate ItemsSource="{Binding Children}" /> 
      </data:DataTemplateExtensions.Hierarchy> 
      <TextBlock Text="{Binding Text}" TextTrimming="CharacterEllipsis" /> 
     </DataTemplate> 
    </controls:TreeView.ItemTemplate> 
</controls:TreeView>