Applicazione di stili per lo stato attivo nei controlli e FocusVisualStyleStyling for Focus in Controls, and FocusVisualStyle

Windows Presentation Foundation (WPF)Windows Presentation Foundation (WPF) offre due meccanismi paralleli per modificare l'aspetto visivo di un controllo che riceve lo stato attivo della tastiera. provides two parallel mechanisms for changing the visual appearance of a control when it receives keyboard focus. Il primo meccanismo consiste nell'utilizzare setter di proprietà per proprietà, ad esempio IsKeyboardFocused all'interno di stile o il modello che viene applicato al controllo.The first mechanism is to use property setters for properties such as IsKeyboardFocused within the style or template that is applied to the control. Il secondo meccanismo consiste nel fornire uno stile separato come valore della FocusVisualStyle proprietà; la "dello stile di visualizzazione dello stato attivo" Crea un struttura ad albero visuale separato per uno strumento decorativo creato nella parte superiore del controllo, anziché modificare la struttura ad albero visuale del controllo o altra interfaccia utente elemento mediante la sostituzione.The second mechanism is to provide a separate style as the value of the FocusVisualStyle property; the "focus visual style" creates a separate visual tree for an adorner that draws on top of the control, rather than changing the visual tree of the control or other UI element by replacing it. Questo argomento descrive gli scenari appropriati a ogni meccanismo.This topic discusses the scenarios where each of these mechanisms is appropriate.

Scopo dello stile di visualizzazione dello stato attivoThe Purpose of Focus Visual Style

La funzionalità dello stile di visualizzazione dello stato attivo offre un "modello a oggetti" comune per introdurre un feedback utente visivo, basato sul passaggio tramite tastiera a un qualsiasi elemento dell'interfaccia utente.The focus visual style feature provides a common "object model" for introducing visual user feedback based on keyboard navigation to any UI element. Questo è possibile senza bisogno di applicare un nuovo modello al controllo, né di conoscere la composizione specifica del modello.This is possible without applying a new template to the control, or knowing the specific template composition.

Dal momento però che la funzionalità dello stile di visualizzazione dello stato attivo funziona a prescindere dai modelli di controllo, il feedback visivo che è possibile visualizzare per un controllo usando uno stile di visualizzazione dello stato attivo è necessariamente limitato.However, precisely because the focus visual style feature works without knowing the control templates, the visual feedback that can be displayed for a control using a focus visual style is necessarily limited. La funzionalità sovrappone una struttura ad albero visuale diversa (uno strumento decorativo visuale) sulla struttura ad albero visuale creata dal rendering di un controllo tramite il relativo modello.What the feature actually does is to overlay a different visual tree (an adorner) on top of the visual tree as created by a control's rendering through its template. Definire lo struttura ad albero separato utilizzando uno stile che riempie la FocusVisualStyle proprietà.You define this separate visual tree using a style that fills the FocusVisualStyle property.

Comportamento predefinito dello stile di visualizzazione dello stato attivoDefault Focus Visual Style Behavior

Gli stili di visualizzazione dello stato attivo funzionano solo quando l'azione di impostazione dello stato attivo è stata iniziata dalla tastiera.Focus visual styles act only when the focus action was initiated by the keyboard. Qualsiasi azione del mouse o modifica dello stato attivo a livello di codice disabilita la modalità degli stili di visualizzazione dello stato attivo.Any mouse action or programmatic focus change disables the mode for focus visual styles. Per altre informazioni sulle differenze tra le modalità dello stato attivo, vedere Cenni preliminari sullo stato attivo.For more information about the distinctions between focus modes, see Focus Overview.

I temi dei controlli includono un comportamento predefinito dello stile di visualizzazione dello stato attivo che diventa lo stile di visualizzazione dello stato attivo per tutti i controlli del tema.The themes for controls include a default focus visual style behavior that becomes the focus visual style for all controls in the theme. Questo stile del tema viene identificato dal valore della chiave statica FocusVisualStyleKey.This theme style is identified by the value of the static key FocusVisualStyleKey. Quando si dichiara uno stile di visualizzazione dello stato attivo personalizzato a livello di applicazione, questo sostituisce il comportamento dello stile predefinito dei temi.When you declare your own focus visual style at the application level, you replace this default style behavior from the themes. In alternativa, se si definisce l'intero tema, è necessario usare questa stessa chiave per definire lo stile del comportamento predefinito per tutto il tema.Alternatively, if you define the entire theme, then you should use this same key to define the style for the default behavior for your entire theme.

Nei temi, lo stile di visualizzazione dello stato attivo predefinito in genere è molto semplice.In the themes, the default focus visual style is generally very simple. Di seguito è riportata un'approssimazione generica:The following is a rough approximation:

<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 usare gli stili di visualizzazione dello stato attivoWhen to Use Focus Visual Styles

Dal punto di vista concettuale, l'aspetto degli stili di visualizzazione dello stato attivo applicati ai controlli deve essere coerente da un controllo all'altro.Conceptually, the appearance of focus visual styles applied to controls should be coherent from control to control. Un modo per garantire la coerenza consiste nel modificare lo stile di visualizzazione dello stato attivo solo se si sta componendo un tema completo, in cui ogni controllo definito nel tema ottiene lo stesso stile di visualizzazione dello stato attivo o una variazione di uno stile visivamente coerente tra i vari controlli.One way to ensure coherence is to change the focus visual style only if you are composing an entire theme, where each control that is defined in the theme gets either the very same focus visual style, or some variation of a style that is visually related from control to control. In alternativa, si può usare lo stesso stile (o stili simili) per assegnare uno stile a ogni elemento della pagina o di un'interfaccia utente in grado di ricevere lo stato attivo tramite tastiera.Alternatively, you might use the same style (or similar styles) to style every keyboard-focusable element on a page or in a UI.

Impostazione FocusVisualStyle sugli stili singolo controllo che non fanno parte di un tema è non l'utilizzo previsto di concentrazione gli stili di visualizzazione.Setting FocusVisualStyle on individual control styles that are not part of a theme is not the intended usage of focus visual styles. Un comportamento visivo incoerente tra controlli può infatti creare confusione nell'esperienza utente relativamente allo stato attivo.This is because an inconsistent visual behavior between controls can lead to a confusing user experience regarding keyboard focus. Se si siano prendendo in considerazione i comportamenti di specifica del controllo per lo stato attivo della tastiera che sono intenzionalmente non coerenti all'interno di un tema, un approccio migliore consiste nell'utilizzare i trigger negli stili per le proprietà di singoli dello stato di input, ad esempio IsFocused o IsKeyboardFocused.If you are intending control-specific behaviors for keyboard focus that are deliberately not coherent across a theme, a much better approach is to use triggers in styles for individual input state properties, such as IsFocused or IsKeyboardFocused.

Gli stili di visualizzazione dello stato attivo funzionano esclusivamente per lo stato attivo da tastiera.Focus visual styles act exclusively for keyboard focus. Come tali, costituiscono un tipo di funzionalità di accessibilità.As such, focus visual styles are a type of accessibility feature. Se si vogliono apportare modifiche all'interfaccia utente per qualsiasi tipo di stato attivo, tramite mouse, tastiera o a livello di codice, è preferibile usare non gli stili di visualizzazione dello stato attivo, bensì setter e trigger all'interno degli stili oppure modelli che funzionino in base al valore delle proprietà generali dello stato attivo, ad esempio IsFocused o IsFocusWithin.If you want UI changes for any type of focus, whether via mouse, keyboard, or programmatically, then you should not use focus visual styles, and should instead use setters and triggers in styles or templates that are working from the value of general focus properties such as IsFocused or IsFocusWithin.

Come creare uno stile di visualizzazione dello stato attivoHow to Create a Focus Visual Style

Lo stile creato per uno stile di visualizzazione dello stato attivo deve sempre disporre di TargetType di Control.The style you create for a focus visual style should always have the TargetType of Control. Lo stile deve essere costituito principalmente un ControlTemplate.The style should consist mainly of a ControlTemplate. Non si specifica il tipo di destinazione in cui lo stile di visualizzazione dello stato attivo viene assegnato a per il tipo di FocusVisualStyle.You do not specify the target type to be the type where the focus visual style is assigned to the FocusVisualStyle.

Poiché il tipo di destinazione è sempre Control, è necessario definire lo stile utilizzando le proprietà comuni a tutti i controlli (mediante le proprietà della Control classe e le relative classi base).Because the target type is always Control, you must style by using properties that are common to all controls (using properties of the Control class and its base classes). È necessario creare un modello che funzioni correttamente come sovrapposizione a un elemento dell'interfaccia utente e che non nasconda le aree funzionali del controllo.You should create a template that will properly function as an overlay to a UI element and that will not obscure functional areas of the control. In generale, questo vuol dire che il feedback visivo deve essere visualizzato all'esterno dei margini del controllo o sotto forma di effetti temporanei o non intrusivi, che non blocchino l'hit testing sul controllo a cui viene applicato lo stile di visualizzazione dello stato attivo.Generally, this means that the visual feedback should appear outside the control margins, or as temporary or unobtrusive effects that will not block the hit testing on the control where the focus visual style is applied. Le proprietà che è possibile utilizzare nell'associazione di modelli sono utili per determinare il ridimensionamento e posizionamento del modello di sovrapposizione includono ActualHeight, ActualWidth, Margin, e Padding.Properties that you can use in template binding that are useful for determining sizing and positioning of your overlay template include ActualHeight, ActualWidth, Margin, and Padding.

Alternative all'uso di uno stile di visualizzazione dello stato attivoAlternatives to Using a Focus Visual Style

Per le situazioni in cui non è appropriato usare uno stile di visualizzazione dello stato attivo, perché si sta assegnando uno stile solo a singoli controlli o perché si vuole un controllo maggiore sul modello del controllo, sono disponibili molte altre proprietà e tecniche accessibili che creano un comportamento visivo in risposta alle modifiche apportate allo stato attivo.For situations where using a focus visual style is not appropriate, either because you are only styling single controls or because you want greater control over the control template, there are many other accessible properties and techniques that can create visual behavior in response to changes in focus.

Trigger, setter e setter di eventi sono illustrati in dettaglio in Applicazione di stili e modelli.Triggers, setters, and event setters are all discussed in detail in Styling and Templating. La gestione degli eventi indirizzati è illustrata in Cenni preliminari sugli eventi indirizzati.Routed event handling is discussed in Routed Events Overview.

IsKeyboardFocusedIsKeyboardFocused

Se è interessati in stato attivo della tastiera, il IsKeyboardFocused proprietà di dipendenza può essere utilizzata per una proprietà Trigger.If you are specifically interested in keyboard focus, the IsKeyboardFocused dependency property can be used for a property Trigger. Un trigger di proprietà in uno stile o in un modello rappresenta una tecnica più appropriata per la definizione di un comportamento dello stato attivo della tastiera specifico per un singolo controllo, che potrebbe non corrispondere visivamente al comportamento dello stato attivo della tastiera di altri controlli.A property trigger in either a style or template is a more appropriate technique for defining a keyboard focus behavior that is very specifically for a single control, and which might not visually match the keyboard focus behavior for other controls.

Un'altra proprietà di dipendenza simile è IsKeyboardFocusWithin, che potrebbe essere opportuno utilizzare se si desidera evidenziare visivamente che lo stato attivo è un punto qualsiasi all'interno di composizione o l'area funzionale del controllo.Another similar dependency property is IsKeyboardFocusWithin, which might be appropriate to use if you want to visually call out that keyboard focus is somewhere within compositing or within the functional area of the control. Ad esempio, si potrebbe inserire un IsKeyboardFocusWithin trigger in modo che un pannello che raggruppa diversi controlli viene visualizzato in modo diverso, anche se lo stato attivo della tastiera potrebbe essere più precisamente trovarsi in un singolo elemento all'interno di tale pannello.For example, you might place an IsKeyboardFocusWithin trigger such that a panel that groups several controls appears differently, even though keyboard focus might more precisely be on an individual element within that panel.

È inoltre possibile utilizzare gli eventi GotKeyboardFocus e LostKeyboardFocus (nonché i rispettivi equivalenti di anteprima).You can also use the events GotKeyboardFocus and LostKeyboardFocus (as well as their Preview equivalents). È possibile utilizzare questi eventi come base per un EventSetter, oppure è possibile scrivere gestori per gli eventi nel code-behind.You can use these events as the basis for an EventSetter, or you can write handlers for the events in code-behind.

Altre proprietà dello stato attivoOther Focus Properties

Se si desidera tutte le possibili cause di modifica dello stato attivo per produrre un comportamento visivo, è consigliabile basare un setter o trigger di IsFocused proprietà di dipendenza, o in alternativa nel GotFocus o LostFocus gli eventi utilizzati per un EventSetter.If you want all possible causes of changing focus to produce a visual behavior, you should base a setter or trigger on the IsFocused dependency property, or alternatively on the GotFocus or LostFocus events used for an EventSetter.

Vedere ancheSee Also

FocusVisualStyle
Applicazione di stili e modelliStyling and Templating
Panoramica sullo stato attivoFocus Overview
Cenni preliminari sull'inputInput Overview