WPF の FocusVisualStyle に関するメモ

最近調べ直したのでメモを。

以下の MSDN のページを参考に。
コントロールのフォーカスのスタイルと FocusVisualStyle

FocusVisualStyle は、フォーカスの移動がキーボードによって行われたときのみ有効になる表示スタイルです。デフォルトだと黒い点線になる、これ。

テンプレートでコントロールの外観を弄っていると、デフォルトの FocusVisualStyle が鬱陶しく感じることがあります (ありました)。

とりあえず消す

消す方法は簡単です。コントロールの FocusVisualStyle プロパティに null を入れてやります。

スタイルで定義する場合も同様です。

ただし、これで本当に消してしまうと、(キーボードでフォーカスを移動したときに) どのコントロールにフォーカスがあるのかを外観で判断できなくなってしまうので、あまりお勧めしません。

独自の FocusVisualStyle を設定する

コントロールの外観を作り込んでいるなら (そして既定の FocusVisualStyle が気に入らないなら)、同じように FocusVisualStyle も自分で作りましょう。
ただし、前述の MSDN のページにも書いてありますが、すべてのコントロール間で一貫した FocusVisualStyle を設定するべきです。キーボード フォーカスが移ったとき、それぞれのコントロールの外観がバラバラではユーザーも混乱してしまいます。

そこで、App.xaml にリソースとして定義し、すべてのコントロールがそれを使用するようにします。

赤い点線が引かれるようにしました。
で、各コントロールのスタイルに以下のように指定します。

と、このように。
キーボードでフォーカスを移すと赤い枠が出るようになります (あくまで例です、本当ならもうちょっと目立たない何かを作ります)。

ちなみに、FocusVisualStyle はコントロールのビジュアル ツリーとは別の装飾用ビジュアル ツリー上にオーバーレイ表示されます。そのため、Style の TargetType は必ず Control クラスです。
ActualHeight、ActualWidth、Margin、Paddin などのプロパティを使用して、コントロール本体を隠したりしないよううまく作りましょう。

また、フォーカスの変更に伴って視覚効果を追加したい場合、FocusVisualStyle だけでなく、スタイルかテンプレートで IsKeyboardFocus プロパティをトリガーにした実装も可能です。他のコントロールのキーボード フォーカスと異なる外観を持たせたい場合などでは、FocusVisualStyle ではなくトリガーを使用して外観を変更する方法が推奨されているようですね (MSDN ではトリガーが推奨されているようですが、VisualStateManager の方がいいかも)。


コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です