I am designing a ListView and I want to change its border color when it is focused, IsFocused property dosen't seem to work for ListView. Is there any property similar to IsFocused for Listview?
<Style x:Key="{x:Type ListView}" TargetType="ListView">
<Setter Property="SnapsToDevicePixels" Value="True" />
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
<Setter Property="ScrollViewer.CanContentScroll" Value="True" />
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="BorderBrush" Value="{StaticResource EnabledListViewBorder}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListView}">
<Border x:Name="Border"
Background="Transparent"
Padding="{TemplateBinding Padding}"
BorderBrush="{StaticResource EnabledListViewBorder}"
BorderThickness="1">
<ScrollViewer Style="{DynamicResource ListViewColumnHeaderScrollViewer}">
<ItemsPresenter />
</ScrollViewer>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsGrouping" Value="True">
<Setter Property="ScrollViewer.CanContentScroll" Value="False" />
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DiabledListViewBorder}" />
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DiabledListViewBorder}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<EventTrigger RoutedEvent="GotFocus">
<BeginStoryboard>
<Storyboard Duration="0:0:0:1" AutoReverse="False">
<ColorAnimation
Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)"
FillBehavior="HoldEnd" From="Red" To="Red"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="LostFocus">
<BeginStoryboard>
<Storyboard AutoReverse="False" Duration="0:0:0:1">
<ColorAnimation
Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)"
FillBehavior="HoldEnd" From="Green" To="Green"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Style.Triggers>
</Style>
I have updated the question with my Sourcecode with the solution provided but the Border Color isn't changing. What am i missing here.
You can use Style.Triggers
to handle GotFocus
and LostFocus
events.
<ListView.Style>
<Style TargetType="ListView">
<Style.Triggers>
<EventTrigger RoutedEvent="GotFocus">
<BeginStoryboard>
<Storyboard Duration="0:0:0:1" AutoReverse="False">
<ColorAnimation
Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)"
FillBehavior="HoldEnd" From="Red" To="Red"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="LostFocus">
<BeginStoryboard>
<Storyboard AutoReverse="False" Duration="0:0:0:1">
<ColorAnimation
Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)"
FillBehavior="HoldEnd" From="Green" To="Green" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Style.Triggers>
</Style>
</ListView.Style>
Update:
If you have rewritten the ControlTemplate
, then delete Style.Triggers
part and move EventTriggers from it to the ControlTemplate.Triggers
. Additionally you have to set Storyboard.TargetName="Border".
<EventTrigger RoutedEvent="LostFocus">
<BeginStoryboard>
<Storyboard AutoReverse="False" Duration="0:0:0:1" Storyboard.TargetName="Border" >
<ColorAnimation
Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)"
FillBehavior="HoldEnd" From="Green" To="Green" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>