[WPF] 포커스 이펙트 없애기

focuseVisualEffect1

WPF에서 UI를 만지다 보면 위와 같이 컨트롤에 포커스가 잡힐 때 회색 점선으로 비주얼 이펙트가 발생하는 상황을 자주 만나게 됩니다.

이전에는 얕은 지식으로 FocusableFalse로 설정하면 된다는 걸 알고 있어서 컨트롤마다 Focusable을 False로 줬는데, ListBoxItemFocusable을 False로 설정하니 포커스가 안되면서 SelectedItem이 변경되지 않는 것은 물론, SelectionChanged 이벤트 역시 발생하지 않는 상황을 마주하면서 단순히 비주얼 이펙트를 숨기기 위해 FocusableFalse로 설정하는 건 잘못된 처리라는 걸 깨달았습니다.

포커스 처리가 필요한 컨트롤의 경우 비주얼 이펙트를 없애고 싶다면 아래와 같은 방식으로 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를 잘 모르는 분들께 혹여 참고가 될까싶어 올립니다.

13개의 좋아요

@루나시아 좋은 내용 감사합니다. :smile:

할때마다 검색했는데 이제 여기로 오면 되겠네요!

2개의 좋아요

좋은 내용 감사드립니다. ㅎㅎ 언젠가 유용하게 써먹을 일이 있을 것 같습니다~!

3개의 좋아요