Partilhar via


Como: Aplicar um FocusVisualStyle a um controle

Este exemplo mostra como criar um estilo visual de foco em recursos e aplicar o estilo a um controle, usando a propriedade FocusVisualStyle.

Exemplo

O exemplo a seguir define um estilo que cria composição de controle adicional que só se aplica quando esse controle é focado no teclado na interface do usuário (UI). Isso é feito definindo um estilo com um ControlTemplatee, em seguida, fazendo referência a esse estilo como um recurso ao definir a propriedade FocusVisualStyle.

Um retângulo externo semelhante a uma borda é colocado fora da área retangular. A menos que seja modificado de outra forma, o tamanho do estilo usa os ActualHeight e ActualWidth do controlo retangular onde o estilo visual de foco é aplicado. Este exemplo define valores negativos para o Margin, de modo que a borda apareça ligeiramente fora do controlo focalizado.

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
>
  <Page.Resources>
    <Style x:Key="MyFocusVisual">
      <Setter Property="Control.Template">
        <Setter.Value>
          <ControlTemplate>
            <Rectangle Margin="-2" StrokeThickness="1" Stroke="Red" StrokeDashArray="1 2"/>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>
  </Page.Resources>
  <StackPanel Background="Ivory" Orientation="Horizontal">
    <Canvas Width="10"/>
    <Button Width="100" Height="30" FocusVisualStyle="{DynamicResource MyFocusVisual}">
      Focus Here</Button>
    <Canvas Width="100"/>
    <Button Width="100" Height="30" FocusVisualStyle="{DynamicResource MyFocusVisual}">
      Focus Here</Button>
  </StackPanel>
</Page>

Um FocusVisualStyle é aditivo a qualquer estilo de modelo de controle que vem de um estilo explícito ou de um estilo de tema; O estilo principal de um controle ainda pode ser criado usando um ControlTemplate e definindo esse estilo para a propriedade Style.

Os estilos visuais de foco devem ser usados consistentemente em um tema ou uma interface do usuário, em vez de usar um diferente para cada elemento focalizável. Para obter detalhes, consulte Styling for Focus in Controls e FocusVisualStyle.

Ver também