Partager via


VisualStateManager.GoToState(Control, String, Boolean) Méthode

Définition

Effectue la transition d’un contrôle entre deux états, en demandant un nouveau VisualState par son nom.

public:
 static bool GoToState(Control ^ control, Platform::String ^ stateName, bool useTransitions);
 static bool GoToState(Control const& control, winrt::hstring const& stateName, bool const& useTransitions);
public static bool GoToState(Control control, string stateName, bool useTransitions);
function goToState(control, stateName, useTransitions)
Public Shared Function GoToState (control As Control, stateName As String, useTransitions As Boolean) As Boolean

Paramètres

control
Control

Contrôle à passer d'un état à l'autre.

stateName
String

Platform::String

winrt::hstring

État vers lequel effectuer la transition.

useTransitions
Boolean

bool

true pour utiliser un VisualTransition pour passer d’un état à l’autre. false pour ignorer l’utilisation des transitions et accéder directement à l’état demandé. La valeur par défaut est false.

Retours

Boolean

bool

true si le contrôle passe correctement au nouvel état ou s’il utilise déjà cet état ; sinon, false.

Exemples

Cet exemple illustre la logique de contrôle qui utilise la méthode GoToState pour passer d’un état à l’autre.

private void UpdateStates(bool useTransitions)
{
    if (Value >= 0)
    {
        VisualStateManager.GoToState(this, "Positive", useTransitions);
    }
    else
    {
        VisualStateManager.GoToState(this, "Negative", useTransitions);
    }

    if (isFocused)
    {
        VisualStateManager.GoToState(this, "Focused", useTransitions);
    }
    else
    {
        VisualStateManager.GoToState(this, "Unfocused", useTransitions);
    }

}
Private Sub UpdateStates(ByVal useTransitions As Boolean)
    If Value >= 0 Then
        VisualStateManager.GoToState(Me, "Positive", useTransitions)
    Else
        VisualStateManager.GoToState(Me, "Negative", useTransitions)
    End If

    If isFocused Then
        VisualStateManager.GoToState(Me, "Focused", useTransitions)
    Else
        VisualStateManager.GoToState(Me, "Unfocused", useTransitions)
    End If

End Sub
<ResourceDictionary 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:NumericUpDownCustomControl"
    >
    <Style TargetType="local:NumericUpDown">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:NumericUpDown">
                    <Grid  Margin="3" 
                Background="{TemplateBinding Background}">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="ValueStates">
                                
                                <!--Make the Value property red when it is negative.-->
                                <VisualState x:Name="Negative">
                                    <Storyboard>
                                        <ColorAnimation To="Red"
                                    Storyboard.TargetName="TextBlock" 
                                    Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)"/>
                                    </Storyboard>
                                </VisualState>
                                <!--Return the control to its initial state by
                    return the TextBlock Foreground to its 
                    original color.-->
                                <VisualState x:Name="Positive" />
                            </VisualStateGroup>

                            <VisualStateGroup x:Name="FocusStates">
                                <!--Add a focus rectangle to highlight the entire control
                    when it has focus.-->
                                <VisualState x:Name="Focused">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusVisual" 
                                                   Storyboard.TargetProperty="Visibility" Duration="0">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <!--Return the control to its initial state by
                    hiding the focus rectangle.-->
                                <VisualState x:Name="Unfocused"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>

                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>

                            <Border BorderThickness="1" BorderBrush="Gray" 
                    Margin="7,2,2,2" Grid.RowSpan="2" 
                    Background="#E0FFFFFF"
                    VerticalAlignment="Center" 
                    HorizontalAlignment="Stretch">
                                <TextBlock x:Name="TextBlock" TextAlignment="Center" Padding="5"
                           Foreground="{TemplateBinding Foreground}"/>

                            </Border>

                            <RepeatButton Content="Up" Margin="2,5,5,0" 
                          x:Name="UpButton"
                          Grid.Column="1" Grid.Row="0"
                          Foreground="Green"/>
                            <RepeatButton Content="Down" Margin="2,0,5,5" 
                          x:Name="DownButton"
                          Grid.Column="1" Grid.Row="1" 
                          Foreground="Green"/>

                            <Rectangle Name="FocusVisual" Grid.ColumnSpan="2" Grid.RowSpan="2" 
                       Stroke="Red" StrokeThickness="1"  
                       Visibility="Collapsed"/>
                        </Grid>

                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    
</ResourceDictionary>

Remarques

Cette méthode est utilisée par la logique de contrôle. Vous en avez généralement besoin uniquement si vous écrivez un contrôle personnalisé ou si vous utilisez une logique au niveau de l’application pour les états d’affichage (par exemple, l’actualisation du contenu de votre application pour les modifications de la taille ou de l’orientation de la fenêtre d’application).

Lorsque vous appelez cette méthode, il est attendu qu’il y ait un VisualState avec une valeur x:Name qui correspond à votre valeur stateName , quelque part dans le modèle de contrôle pour le contrôle identifié par le contrôle, ou en tant que ressource pour votre application. Si ce n’est pas le cas, vous n’obtenez pas d’exceptions, mais la valeur de retour sera false. L’état nommé par stateName peut se trouver dans l’un des éléments VisualStateGroup du modèle pour le contrôle spécifié. Il vous appartient de suivre les états dans lesquels VisualStateGroup et de savoir quel état est déchargé lorsque vous spécifiez un nouvel état à partir de ce groupe.

En règle générale, le ControlTemplate qui contient les états visuels référencés par nom lors de l’utilisation de GoToState n’est pas spécifiquement défini pour ce contrôle instance. Au lieu de cela, les états visuels proviennent du style de contrôle par défaut chargé en tant que style implicite pour toutes les instances de ce contrôle. Pour plus d’informations sur le concept de style implicite, consultez Démarrage rapide : Modèles de contrôle.

VisualStateManager prend en charge deux fonctionnalités importantes pour les auteurs de contrôles et pour les développeurs d’applications qui appliquent un modèle personnalisé à un contrôle :

  • Les auteurs de contrôles ou les développeurs d’applications ajoutent des éléments objet VisualStateGroup à l’élément racine d’une définition de modèle de contrôle en XAML, à l’aide de la propriété jointe VisualStateManager.VisualStateGroups . Dans un élément VisualStateGroup , chaque VisualState représente un état visuel discret d’un contrôle. Chaque VisualState a un nom représentatif d’un état d’interface utilisateur qui peut être modifié par l’utilisateur ou modifié par la logique de contrôle. Un VisualState se compose principalement d’un Storyboard. Ce storyboard cible des valeurs de propriétés de dépendance individuelles qui doivent être appliquées chaque fois que le contrôle se trouve dans cet état visuel.
  • Les auteurs de contrôle ou les développeurs d’applications passent d’un état à l’autre en appelant la méthode GoToState statique de VisualStateManager. Les auteurs de contrôles effectuent cette opération chaque fois que la logique de contrôle gère des événements qui indiquent un changement d’état, ou que la logique de contrôle lance elle-même un changement d’état. Il est plus courant pour le code de définition de contrôle d’effectuer cette opération que le code d’application, de sorte que tous les états visuels possibles et leurs transitions et conditions de déclencheur sont présents par défaut pour le code d’application. Ou bien, c’est le code de l’application qui change les états visuels pour gérer les états d’affichage au niveau de l’application en réponse aux modifications apportées par l’utilisateur à la taille ou à l’orientation de la fenêtre d’application main.

Lorsque vous appelez GoToState pour modifier l’état visuel d’un contrôle, VisualStateManager effectue les actions suivantes :

  • Tout d’abord, il est déterminé si un état qui correspond à stateName existe. Si ce n’est pas le cas, rien ne se produit et la méthode retourne false.
  • Si le VisualState nommé par stateName existe et a un storyboard, le storyboard commence.
  • Si le VisualState que le contrôle utilisait à partir de ce même VisualStateGroup avant l’état nouvellement demandé a un storyboard, ce storyboard s’arrête. Outre les propriétés spécifiques auxquelles le nouveau VisualState applique une animation, le contrôle rétablit les états initialement chargés à partir du modèle de contrôle et de sa composition.

Si le contrôle est déjà dans le VisualState demandé en tant que stateName, GoToState retourne true, mais il n’y a pas d’action dans le cas contraire (le storyboard ne sera pas redémarré).

Un modèle d’implémentation de contrôle courant consiste à définir une méthode privée unique de la classe de contrôle qui prend en charge toutes les modifications VisualState possibles pour le contrôle. L’état visuel à utiliser est déterminé en vérifiant les propriétés du contrôle. Ces propriétés peuvent être publiques ou privées. Les valeurs des propriétés sont ajustées par les gestionnaires dans la logique de contrôle pour des événements tels que OnGotFocus, et sont vérifiées juste-à-temps immédiatement avant de définir l’état visuel. L’exemple de code de cette rubrique utilise ce modèle d’implémentation. Vous pouvez également appeler GoToState pour des états individuels à partir de gestionnaires d’événements, à partir de remplacements de gestionnaires d’événements de contrôle (méthodes OnEvent ) ou à partir de méthodes d’assistance appelées par toutes les impulsions possibles pour changer d’état (événements pilotés par l’utilisateur, événements d’automatisation, logique d’initialisation).

Vous pouvez également appeler GoToState à partir de l’implémentation PropertyChangedCallback pour une propriété de dépendance personnalisée.

États visuels et transitions

En plus des états visuels, le modèle d’état visuel inclut également des transitions. Les transitions sont des actions d’animation contrôlées par un Storyboard qui se produisent entre chaque état visuel lorsque l’état est modifié. La transition peut être définie différemment pour chaque combinaison d’état de début et d’état de fin, comme défini par l’ensemble d’états visuels de votre contrôle. Les transitions sont définies par la propriété Transitions de VisualStateGroup et sont généralement définies en XAML. La plupart des modèles de contrôle par défaut ne définissent pas de transitions et, dans ce cas, les transitions entre états se produisent instantanément. Pour plus d’informations, consultez VisualTransition.

Un VisualTransition peut également être défini de telle sorte qu’il produise une transition implicite. Toute propriété de dépendance qui est spécifiquement ciblée pour l’animation dans les états visuels From ouTo d’un VisualTransition et qui a des valeurs différentes dans le changement d’état peut être animée avec une animation de transition implicite. Cette animation générée effectue des transitions entre la valeur d’état From et la valeur d’état To d’une telle propriété à l’aide de l’interpolation. L’animation de transition implicite dure pendant la durée indiquée par la valeur GeneratedDuration d’un VisualTransition. Les transitions implicites s’appliquent uniquement aux propriétés qui sont une valeur Double, Color ou Point . En d’autres termes, la propriété doit être possible d’animer implicitement à l’aide d’un Objet DoubleAnimation, PointAnimation ou ColorAnimation. Pour plus d’informations, consultez GeneratedDuration.

Événements pour les changements d’état visuel

CurrentStateChanging se déclenche lorsque le contrôle commence à passer des états comme demandé par l’appel GoToState. Si un VisualTransition est appliqué au changement d’état, cet événement se produit lorsque la transition commence.

CurrentStateChanged se déclenche une fois que le contrôle est dans l’état demandé par l’appel GoToState, tout comme le nouveau Storyboard commence. Aucun événement n’est déclenché lors de l’achèvement du nouveau storyboard.

Si un VisualTransition n’est pas appliqué, CurrentStateChanging et CurrentStateChanged se déclenchent successivement rapidement, mais sont garantis dans cet ordre si les deux se produisent.

Toutefois, si une transition de changement d’état est interrompue par un nouvel appel GoToState, l’événement CurrentStateChanged n’est jamais déclenché pour la première transition d’état. Une nouvelle série d’événements est déclenchée pour le prochain changement d’état demandé.

OnApplyTemplate n’est pas appelé pour les changements d’état visuel. OnApplyTemplate est appelé uniquement pour la charge initiale d’un contrôle dans une interface utilisateur XAML.

Attribution des états visuels nommés d’un contrôle personnalisé

Si vous définissez un contrôle personnalisé qui a des états visuels dans son modèle de contrôle XAML, il est recommandé d’attribuer la classe de contrôle pour indiquer aux consommateurs quels états visuels sont disponibles. Pour ce faire, appliquez un ou plusieurs attributs TemplateVisualState au niveau de la classe de votre code de définition de contrôle. Chaque attribut doit spécifier l’attribut x:Name de l’état, qui est la valeur stateName qu’un consommateur de contrôle passerait dans un appel GoToState pour utiliser cet état visuel. Si VisualState fait partie d’un VisualStateGroup, cela doit également être indiqué dans la définition d’attribut.

Un concept connexe est que les auteurs de contrôles doivent attribuer les noms des parties de contrôle clés à l’aide de TemplatePartAttribute. Cela est très utile si les consommateurs de contrôle souhaitent accéder aux parties nommées à partir de l’étendue du modèle après l’application du modèle. TemplateVisualStateAttribute et TemplatePartAttribute combinés permettent de définir le contrat de contrôle pour un contrôle.

VisualStateManager personnalisé

En tant que scénario avancé, il est possible de dériver de VisualStateManager et de modifier le comportement GoToState par défaut. La classe dérivée doit remplacer la méthode GoToStateCore protégée. Toute instance du VisualStateManager personnalisé utilise cette logique core lorsque sa méthode GoToState est appelée.

États visuels pour les états d’affichage d’application

Les états visuels ne sont pas nécessairement pour les contrôles personnalisés. Vous pouvez utiliser les états visuels des nouveaux modèles de contrôle que vous appliquez à n’importe quel instance de contrôle où vous remplacez le modèle par défaut en définissant la propriété Template. Pour configurer cela, vous devez définir le modèle de contrôle et les états visuels que vous envisagez d’utiliser comme ressource Style dans Page.Resources ou Application.Resources. Il est toujours préférable de commencer par une copie du modèle par défaut et de modifier uniquement certains aspects du modèle ou même de simplement modifier certains états visuels et de laisser la composition de base seule. Pour plus d’informations, voir Démarrage rapide : modèles de contrôles.

Les états visuels peuvent être utilisés pour modifier les propriétés d’une page ou de contrôles dans la page afin de tenir compte de l’orientation de la fenêtre de l’application. Les valeurs de propriété liées à la disposition de votre composition ou de votre contrôle peuvent changer selon que l’orientation globale est portrait ou paysage. Pour plus d’informations sur ce scénario pour GoToState, consultez Démarrage rapide : Conception d’applications pour différentes tailles de fenêtre.

États visuels pour les éléments qui ne sont pas des contrôles

Les états visuels sont parfois utiles pour les scénarios où vous souhaitez modifier l’état d’une zone d’interface utilisateur qui n’est pas immédiatement une sous-classe Control . Vous ne pouvez pas effectuer cette opération directement, car le paramètre de contrôle de la méthode GoToState nécessite une sous-classe Control , qui fait référence à l’objet sur lequel le VisualStateManager agit. Page est une sous-classe Control , et il est assez rare que vous affichiez l’interface utilisateur dans un contexte où vous n’avez pas de Page, ou où votre racine Window.Content n’est pas une sous-classe Control . Nous vous recommandons de définir un UserControl personnalisé pour qu’il s’agit de la racine Window.Content ou d’un conteneur pour un autre contenu auquel vous souhaitez appliquer des états (par exemple, un panneau). Vous pouvez ensuite appeler GoToState sur votre UserControl et appliquer des états, que le reste du contenu soit un contrôle ou non. Par exemple, vous pouvez appliquer des états visuels à l’interface utilisateur qui, sinon, se compose simplement d’un SwapChainPanel , à condition que vous l’ayez placé dans votre UserControl et déclaré des états nommés qui s’appliquent aux propriétés du UserControl parent ou de la partie SwapChainPanel nommée du modèle.

S’applique à

Voir aussi