Compartilhar via


Estilo de foco em controles e FocusVisualStyle

Windows Presentation Foundation (WPF) fornece dois mecanismos paralelos para alterar a aparência visual de um controle quando ele recebe o foco do teclado. O primeiro mecanismo é usar definidores de propriedades como IsKeyboardFocused dentro do estilo ou modelo que é aplicado ao controle. O segundo mecanismo é fornecer um estilo separado como o valor da propriedade FocusVisualStyle; o "focus visual style" cria uma árvore visual separada para um adorno que desenha na parte superior do controle, ao invés de alterando a árvore visual do controle ou outro elemento de interface do usuário por substituí-lo. Este tópico aborda os cenários em que cada um desses mecanismos é apropriado.

Este tópico contém as seguintes seções.

  • O Objetivo de Estilo Visual de Foco
  • Comportamento padrão de Estilo Visual de Foco
  • Quando usar estilos visuais de foco
  • Como criar um estilo visual de foco
  • Alternativas ao uso de um estilo visual de foco
  • Tópicos relacionados

O Objetivo de Estilo Visual de Foco

O recurso de estilo visual de foco fornece um "modelo de objeto" comum para introduzir feedback visual do usuário com base em navegação de teclado para qualquer elemento de interface do usuário. Isso é possível sem aplicar um novo modelo para o controle, ou conhecer a composição de modelo específica.

No entanto, com precisão porque o recurso de estilo visual de foco funciona sem conhecer os modelos de controle, o feedback visual que pode ser exibido para um controle usando um estilo visual de foco é necessariamente limitado. O que o recurso realmente faz é sobrepor uma árvore de visual (um adorno) diferente no topo da árvore visual conforme criado por uma renderização de um controle através do seu modelo. Você define esta árvore visual separada usando um estilo que preenche a propriedade FocusVisualStyle.

Comportamento padrão de Estilo Visual de Foco

Estilos Visuais de Foco funcionam apenas quando a ação do foco foi iniciada pelo teclado. Qualquer ação do mouse ou alteração de foco através de programação desativa o modo de estilos visuais de foco. Para obter mais informações sobre as distinções entre os modos de foco, consulte Visão geral sobre Foco.

Os temas dos controles incluem um comportamento de estilo visual de foco padrão que se torna o estilo visual de foco para todos os controles no tema. Esse estilo de tema é identificado pelo valor da chave estática FocusVisualStyleKey. Quando você declarar seu próprio estilo visual de foco no nível do aplicativo, você substitui esse comportamento de estilo padrão a partir de temas. Como alternativa, se você definir o tema inteiro, então você deve usar essa mesma chave para definir o estilo para o comportamento padrão para o tema inteiro.

Nos temas, o estilo visual padrão de foco é geralmente muito simples. A seguir está uma aproximação bruta:

<Style x:Key="{x:Static SystemParameters.FocusVisualStyleKey}">
  <Setter Property="Control.Template">
    <Setter.Value>
      <ControlTemplate>
        <Rectangle StrokeThickness="1"
          Stroke="Black"
          StrokeDashArray="1 2"
          SnapsToDevicePixels="true"/>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

Quando usar estilos visuais de foco

Conceitualmente, a aparência dos estilos visuais de foco aplicados aos controles deve ser coerente de controle para controle. Uma maneira de garantir coerência é alterar o estilo visual de foco somente se você estiver compondo um tema inteiro, onde cada controle que está definido no tema obtém o mesmo estilo visual de foco, ou alguma variação de um estilo que está relacionado visualmente de controle para controle. Como alternativa, você pode usar o mesmo estilo (ou estilos semelhantes) para estilizar cada elemento de teclado possível de entrar em foco em uma página ou em uma interface do usuário.

Configurando FocusVisualStyle nos estilos de controle individuais que não fazem parte de um tema não é o uso pretendido para estilos visuais de foco. Isso ocorre porque um comportamento visual inconsistente entre controles pode levar a uma experiência confusa do usuário sobre o foco do teclado. Se você estiver com intenção de fazer comportamentos de controle específicos para o foco do teclado que são deliberadamente não coerente em um tema, uma abordagem muito melhor é usar disparadores em estilos para propriedades de estado de entrada individual, como IsFocused ou IsKeyboardFocused.

Estilos visuais de foco agem exclusivamente para foco do teclado. Dessa forma, estilos visuais de foco são um tipo de recurso de acessibilidade. Se você quiser que a interface do usuário altere para qualquer tipo de foco, seja por meio do mouse, teclado, ou por meio de programação, então, você não deve usar estilos visuais de foco, e em vez disso, deve usar definidores e disparadores no estilos ou modelo que estão funcionando no valor das propriedades de foco gerais, comoIsFocused ou IsFocusWithin.

Como criar um estilo visual de foco

O estilo que você criar para um estilo visual de foco sempre deve ter o TargetType de Control. O estilo deve consistir principalmente de um ControlTemplate. Você não especificar o tipo de destino para ser do tipo onde o estilo visual de foco é atribuído ao FocusVisualStyle.

Porque o tipo de destino é sempre Control, você deve estilizar usando as propriedades que são comuns a todos os controles (usando propriedades das classes Control e de suas classes base). Você deve criar um modelo que funcionará corretamente como uma sobreposição para um elemento de interface do usuário e que não irá ocultar áreas funcionais de controle. Geralmente, isso significa que o feedback visual deve aparecer fora das margens do controle, ou como efeitos temporários ou que não pode ser obstruído que não bloquearão o teste de clique no controle onde o estilo visual de foco é aplicado. As propriedades que podem ser usadas em vinculação de modelo que são úteis para determinar dimensionamento e posicionamento do seu modelo de sobreposição incluem ActualHeight, ActualWidth, Margin e Padding.

Alternativas ao uso de um estilo visual de foco

Para situações em que usar um estilo visual de foco não for apropriado, porque você só está estilizando alguns controles ou porque deseja maior controle sobre o modelo de controle, existem muitas outras propriedades e técnicas acessíveis que podem criar comportamento visual em resposta a alterações no foco.

Disparadores, definidores, e definidores de evento são todos discutidos em detalhes no Styling and Templating. Manipulação de eventos roteados é discutida no Visão geral sobre eventos roteados.

IsKeyboardFocused

Se você estiver interessado especificamente em foco do teclado, a propriedade de dependência IsKeyboardFocused pode ser usada para uma propriedade Trigger. Um disparador de propriedade em um estilo ou modelo é uma técnica mais apropriada para definir um comportamento de foco do teclado que é muito específico de um único controle, e que podem não corresponder visualmente o comportamento de foco do teclado para outros controles.

Outra propriedade de dependência semelhante é IsKeyboardFocusWithin,que pode ser apropriada para ser usada se você deseja chamar a atenção visualmente de que o foco do teclado está em algum lugar dentro de composição ou dentro da área funcional do controle. Por exemplo, você pode colocar um disparador IsKeyboardFocusWithin, de forma que um painel que agrupa vários controles apareça de maneira diferente, mesmo que o foco do teclado possa com mais precisão estar em um elemento individual dentro desse painel.

Você também pode usar os eventos GotKeyboardFocus e LostKeyboardFocus (bem como seus equivalentes de visualização). Você pode usar esses eventos como a base para um EventSetter, ou pode criar manipuladores para os eventos no código de apoio.

Outras propriedades de foco

Se você desejar todas as possíveis causas de alteração de foco para produzir um comportamento visual, você deve basear um definidor ou disparador na propriedade de dependência do IsFocused, ou como alternativa nos eventos GotFocus ou LostFocus usados para um EventSetter.

Consulte também

Conceitos

Styling and Templating

Visão geral sobre Foco

Input Overview

Referência

FocusVisualStyle

Outros recursos

Acessibilidade