WPF TreeView DataTemplate 트리거

Question

저는 C#으로 WPF 애플리케이션을 개발 중입니다.

DataTemplate이있는 창에 TreeView를 추가했습니다. 그러나 MouseOver, IsFocused 등과 같이이 DataTemplates에 대한 스타일 트리거가 필요합니다.

도와 줄 수 있습니까? 도움 주셔서 감사합니다.

<TreeView 
    x:Name="twLayer" 
    Background="{x:Null}" 
    HorizontalContentAlignment="Stretch" 
    VerticalContentAlignment="Top" 
    Padding="0" 
    SnapsToDevicePixels="True" 
    ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
    ScrollViewer.VerticalScrollBarVisibility="Auto" 
    BorderThickness="0" 
    Cursor="Hand"> 
    <TreeView.Resources> 
     <HierarchicalDataTemplate DataType="{x:Type loc:LayerItems}"> 
     <Border Width="250" Height="38" BorderBrush="#FF383838" Background="#FF535353" BorderThickness="1,0,1,1" Padding="2" OverridesDefaultStyle="True" > 
      <StackPanel Orientation="Horizontal" SnapsToDevicePixels="True"> 
       <Border BorderBrush="Black" BorderThickness="1" SnapsToDevicePixels="True"> 
        <Border BorderBrush="White" BorderThickness="1" SnapsToDevicePixels="True"> 
        <Image Width="30" Height="30" VerticalAlignment="Top" HorizontalAlignment="Left" Source="silinecek/layerThumb.png" SnapsToDevicePixels="True" /> 
        </Border> 
       </Border> 
       <TextBlock Text="{Binding Path=Name}" Margin="5,10,0,0" Foreground="White" SnapsToDevicePixels="True"/> 
      </StackPanel> 
     </Border> 
     </HierarchicalDataTemplate> 
     <DataTemplate DataType="{x:Type loc:ChannelItem}"> 
     <Border Width="250" BorderBrush="#FF383838" Background="#FF535353" BorderThickness="1,0,1,1" Padding="2" OverridesDefaultStyle="True" > 
      <StackPanel Orientation="Horizontal" SnapsToDevicePixels="True"> 
       <Border BorderThickness="1" BorderBrush="Black" VerticalAlignment="Center" SnapsToDevicePixels="True"> 
        <Border BorderThickness="1" BorderBrush="White" SnapsToDevicePixels="True"> 
        <Grid Width="16" Height="16" Background="{Binding Path=ChannelColor}" SnapsToDevicePixels="True"/> 
        </Border> 
       </Border> 
       <TextBlock Margin="5,3,0,0" Text="{Binding Path=Name}" Foreground="White" FontFamily="Calibri" SnapsToDevicePixels="True"/> 
      </StackPanel> 
     </Border> 
     </DataTemplate> 
     <DataTemplate DataType="{x:Type loc:EffectItem}"> 
     <Border Width="250" Height="18" BorderBrush="#FF383838" Background="#FF535353" BorderThickness="1,0,1,1" Padding="2" OverridesDefaultStyle="True"> 
      <StackPanel Orientation="Horizontal" SnapsToDevicePixels="True"> 
       <Image Width="10" Height="10" VerticalAlignment="Center" HorizontalAlignment="Left" Source="icons/iconFX.png" SnapsToDevicePixels="True"/> 
       <TextBlock Margin="6,0,0,0" Text="{Binding Path=Name}" Foreground="White" FontSize="10" FontFamily="Calibri" SnapsToDevicePixels="True"/> 
      </StackPanel> 
     </Border> 
     </DataTemplate> 
    </TreeView.Resources> 
</TreeView> 

Answer 1

처럼 VisualState를 사용할 수 있습니다 : 당신은 루트에 비슷한 뭔가를 할 수

<HierarchicalDataTemplate DataType="{x:Type loc:LayerItems}"> 
    <Border Width="250" Height="38" BorderBrush="#FF383838" Background="#FF535353" BorderThickness="1,0,1,1" Padding="2" OverridesDefaultStyle="True" > 
     <StackPanel Orientation="Horizontal" SnapsToDevicePixels="True"> 
      <Border BorderBrush="Black" BorderThickness="1" SnapsToDevicePixels="True"> 
       <Border BorderBrush="White" BorderThickness="1" SnapsToDevicePixels="True"> 
        <Image Width="30" Height="30" VerticalAlignment="Top" HorizontalAlignment="Left" Source="silinecek/layerThumb.png" SnapsToDevicePixels="True" /> 
       </Border> 
      </Border> 
      <TextBlock Text="{Binding Path=Name}" Margin="5,10,0,0" Foreground="White" SnapsToDevicePixels="True"/> 
     </StackPanel> 
     <Border.Style> 
      <Style TargetType="{x:Type Border}"> 
       <Style.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <Setter Property="BorderBrush" Value="LightGreen" /> 
        </Trigger> 
        <Trigger Property="IsFocused" Value="False"> 
         <Setter Property="BorderBrush" Value="Gray" /> 
        </Trigger> 
       </Style.Triggers> 
      </Style> 
     </Border.Style> 
    </Border> 
</HierarchicalDataTemplate> 

Border 다른 DataTemplate의 요소도 있습니다. MSDN의 Trigger Class 페이지에서 자세한 내용을 확인할 수 있습니다.

Answer 2

당신은 당신이 같은 Style의 TriggersCollection로 Trigger의를 추가 할 수 있습니다

<VisualStateManager.VisualStateGroups> 
    <VisualState x:Name="MouseOver"> 
             <Storyboard> 
              <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" 
             Storyboard.TargetName="Border"> 
               <EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlMouseOverColor}" /> 
              </ColorAnimationUsingKeyFrames> 
              <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" 
             Storyboard.TargetName="Border"> 
               <EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlNormalColor}" /> 
              </ColorAnimationUsingKeyFrames> 
             </Storyboard> 
            </VisualState> 
</VisualStateManager.VisualStateGroups>