WPF에서 UI를 만지다 보면 위와 같이 컨트롤에 포커스가 잡힐 때 회색 점선으로 비주얼 이펙트가 발생하는 상황을 자주 만나게 됩니다.
이전에는 얕은 지식으로 Focusable을 False로 설정하면 된다는 걸 알고 있어서 컨트롤마다 Focusable을 False로 줬는데, ListBoxItem에 Focusable을 False로 설정하니 포커스가 안되면서 SelectedItem이 변경되지 않는 것은 물론, SelectionChanged 이벤트 역시 발생하지 않는 상황을 마주하면서 단순히 비주얼 이펙트를 숨기기 위해 Focusable을 False로 설정하는 건 잘못된 처리라는 걸 깨달았습니다.
포커스 처리가 필요한 컨트롤의 경우 비주얼 이펙트를 없애고 싶다면 아래와 같은 방식으로 FocusVisualStyle을 덮어씌우면 됩니다.
1. 직접 재정의하는 방법
<Setter Property="ItemContainerStyle">
<Setter.Value>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="FocusVisualStyle">
<Setter.Value>
<Style>
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<ContentPresenter/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Setter.Value>
</Setter>
</Style>
</Setter.Value>
</Setter>
2. 리소스를 활용하는 방법
<Style.Resources>
<Style x:Key="xsNoFocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<ContentPresenter/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Style.Resources>
<Setter Property="ItemContainerStyle">
<Setter.Value>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="FocusVisualStyle" Value="{DynamicResource xsNoFocusVisual}"/>
</Style>
</Setter.Value>
</Setter>
아시는 분들은 다 아는 내용이겠지만 저처럼 WPF를 잘 모르는 분들께 혹여 참고가 될까싶어 올립니다.