Files
docs-desktop/dotnet-desktop-guide/framework/wpf/advanced/how-to-apply-a-focusvisualstyle-to-a-control.md
T
Andy De George da363692ff Initial WPF content migrated (#17)
* Reset branch for WPF changes

* Convert BMP to PNG; fix link-out-of-scope err

* Add snippets for WPF... 6794 files!!!!

* Add missing snippets

* update file updated between migration

* Fix paths to include

* update breadcrumb and toc

* fix index links

* fix index links

* fix index links

* fix markdown
2020-09-04 09:46:28 -07:00

28 lines
2.4 KiB
Markdown

---
title: "How to: Apply a FocusVisualStyle to a Control"
ms.date: "03/30/2017"
helpviewer_keywords:
- "properties [WPF], FocusVisualStyle"
- "FocusVisualStyle property [WPF]"
ms.assetid: 363de99e-8ecc-438c-ac4a-f9147432ebd6
---
# How to: Apply a FocusVisualStyle to a Control
This example shows you how to create a focus visual style in resources and apply the style to a control, using the <xref:System.Windows.FrameworkElement.FocusVisualStyle%2A> property.
## Example
The following example defines a style that creates additional control compositing that only applies when that control is keyboard focused in the [!INCLUDE[TLA#tla_ui](../../../includes/tlasharptla-ui-md.md)]. This is accomplished by defining a style with a <xref:System.Windows.Controls.ControlTemplate>, then referencing that style as a resource when setting the <xref:System.Windows.FrameworkElement.FocusVisualStyle%2A> property.
An external rectangle resembling a border is placed outside of the rectangular area. Unless otherwise modified, the sizing of the style uses the <xref:System.Windows.FrameworkElement.ActualHeight%2A> and <xref:System.Windows.FrameworkElement.ActualWidth%2A> of the rectangular control where the focus visual style is applied. This example sets negative values for the <xref:System.Windows.FrameworkElement.Margin%2A> to make the border appear slightly outside the focused control.
[!code-xaml[FEFocusVisualStyle#XAML](~/samples/snippets/csharp/VS_Snippets_Wpf/FEFocusVisualStyle/CS/page1.xaml#xaml)]
A <xref:System.Windows.FrameworkElement.FocusVisualStyle%2A> is additive to any control template style that comes either from an explicit style or a theme style; the primary style for a control can still be created by using a <xref:System.Windows.Controls.ControlTemplate> and setting that style to the <xref:System.Windows.FrameworkElement.Style%2A> property.
Focus visual styles should be used consistently across a theme or a UI, rather than using a different one for each focusable element. For details, see [Styling for Focus in Controls, and FocusVisualStyle](styling-for-focus-in-controls-and-focusvisualstyle.md).
## See also
- <xref:System.Windows.FrameworkElement.FocusVisualStyle%2A>
- [Styling and Templating](/dotnet/desktop-wpf/fundamentals/styles-templates-overview)
- [Styling for Focus in Controls, and FocusVisualStyle](styling-for-focus-in-controls-and-focusvisualstyle.md)