VisualState Classe
Définition
Important
Certaines informations portent sur la préversion du produit qui est susceptible d’être en grande partie modifiée avant sa publication. Microsoft exclut toute garantie, expresse ou implicite, concernant les informations fournies ici.
Représente l’apparence visuelle d’un élément d’interface utilisateur lorsqu’il est dans un état spécifique. Les états visuels utilisent Setters ou un Storyboard pour définir les propriétés de l’interface utilisateur dans des pages ou des modèles de contrôle où l’objet VisualState est défini.
public ref class VisualState sealed : DependencyObject/// [Microsoft.UI.Xaml.Markup.ContentProperty(Name="Storyboard")]
/// [Windows.Foundation.Metadata.Activatable(65536, "Microsoft.UI.Xaml.WinUIContract")]
/// [Windows.Foundation.Metadata.ContractVersion(Microsoft.UI.Xaml.WinUIContract, 65536)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
class VisualState final : DependencyObject[Microsoft.UI.Xaml.Markup.ContentProperty(Name="Storyboard")]
[Windows.Foundation.Metadata.Activatable(65536, "Microsoft.UI.Xaml.WinUIContract")]
[Windows.Foundation.Metadata.ContractVersion(typeof(Microsoft.UI.Xaml.WinUIContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
public sealed class VisualState : DependencyObjectPublic NotInheritable Class VisualState
Inherits DependencyObject<VisualState x:Name="stateName" />
-or-
<VisualState x:Name="stateName">
singleStoryboard
</VisualState>
-or-
<VisualState x:Name="stateName">
<VisualState.Setters>
oneOrMoreSetters
</VisualState.Setters>
[optional]singleStoryboard
</VisualState>
-or-
<VisualState x:Name="stateName">
<VisualState.StateTriggers>
oneOrMoreTriggers
</VisualState.StateTriggers>
<VisualState.Setters>
oneOrMoreSetters
</VisualState.Setters>
[optional]singleStoryboard
</VisualState>
- Héritage
- Attributs
Exemples
Cet exemple crée un VisualStateGroup dans le ControlTemplate d’un bouton appelé « CommonStates » et ajoute des VisualState objets pour les états, « Normal », « Pressed » et « PointerOver ». Définit Button également un état appelé « Disabled » qui se trouve dans les « CommonStates » nommés VisualStateGroup, mais l’exemple l’omet pour la concision.
<ControlTemplate TargetType="Button">
<Border x:Name="RootElement">
<VisualStateManager.VisualStateGroups>
<!--Define the states for the common states.
The states in the VisualStateGroup are mutually exclusive to
each other.-->
<VisualStateGroup x:Name="CommonStates">
<!--The Normal state is the state the button is in
when it is not in another state from this VisualStateGroup.-->
<VisualState x:Name="Normal" />
<!--Change the SolidColorBrush, BorderBrush, to red when the
Pointer is over the button.-->
<VisualState x:Name="PointerOver">
<Storyboard>
<ColorAnimation Storyboard.TargetName="BorderBrush"
Storyboard.TargetProperty="Color" To="Red" />
</Storyboard>
</VisualState>
<!--Change the SolidColorBrush, BorderBrush, to Transparent when the
button is pressed.-->
<VisualState x:Name="Pressed">
<Storyboard >
<ColorAnimation Storyboard.TargetName="BorderBrush"
Storyboard.TargetProperty="Color" To="Transparent"/>
</Storyboard>
</VisualState>
<!--The Disabled state is omitted for brevity.-->
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Border.Background>
<SolidColorBrush x:Name="BorderBrush" Color="Black"/>
</Border.Background>
<Grid Background="{TemplateBinding Background}" Margin="4">
<ContentPresenter
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Margin="4,5,4,4" />
</Grid>
</Border>
</ControlTemplate>
<Page>
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup>
<VisualState>
<VisualState.StateTriggers>
<!-- VisualState to be triggered when window width is >=720 effective pixels -->
<AdaptiveTrigger MinWindowWidth="720"/>
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="myPanel.Orientation" Value="Horizontal"/>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<StackPanel x:Name="myPanel" Orientation="Vertical">
<TextBlock x:Name="myTextBlock" MaxLines="5" Style="{ThemeResource BodyTextBlockStyle}"/>
</StackPanel>
</Grid>
</Page>
Remarques
Un VisualState élément doit toujours être contenu dans un parent VisualStateGroup dans le balisage XAML. Il VisualStateGroup a une propriété de collection implicite States. Vous pouvez donc placer chacun VisualState en tant qu’élément enfant immédiat du VisualStateGroup parent. Par exemple:
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="PointerOver">...</VisualState>
<!-- do not need explicit VisualStateGroups.States property element, States is the XAML content property-->
</VisualStateGroup>
Lorsque vous utilisez StateTriggers, vérifiez que VisualStateGroup est déclaré sous le premier enfant de la racine afin que les déclencheurs prennent effet automatiquement.
État par défaut
Il est légal et courant de définir un VisualStateattribut x :Name , mais ne spécifie rien dans le Storyboard. Cela est utile, car une VisualState telle méthode utilise les valeurs présentes dans le modèle par défaut. Vous pouvez ensuite demander spécifiquement l’état vide à partir d’un appel GoToState . Lorsqu’un état vide devient l’état actuel, qui annule toutes les modifications apportées aux propriétés du modèle effectuées par un état visuel précédent à partir du même VisualStateGroup.
Lorsque vous utilisez StateTriggers, vous n’êtes plus obligé de créer un objet vide VisualState pour appeler GoToState . Lorsque les conditions d’un StateTrigger ne sont plus remplies, toutes les modifications apportées aux propriétés effectuées par le correspondant VisualState sont automatiquement supprimées et les valeurs fournies dans le balisage par défaut prennent effet.
VisualState et x :Name
La méthode GoToState (qui est généralement appelée à partir du code de contrôle) nécessite un stateName paramètre pour informer visualStateManager quel état doit être utilisé comme état actuel. Spécifiez un attribut x :Name pour chacun VisualState qui doit être appliqué manuellement à l’aide d’un GoToState appel à partir du code. Si vous utilisez StateTriggers pour déclencher automatiquement un VisualState balisage, vous n’avez pas besoin de spécifier un attribut x :Name sur ce VisualState.
Si vous utilisez des transitions visuelles, la valeur d’attribut x :Name d’un VisualState est également référencée par les valeurs From ou To d’un VisualTransition. Dans ce cas, le nom identifie l’état ou les états entre VisualTransition utilisant les valeurs intermédiaires.
La valeur d’attribut x :Name que vous spécifiez pour un VisualState doit être unique dans le code XAML du modèle de contrôle où il VisualState existe. L’étendue des noms d’état n’est pas seulement étendue pour chaque VisualStateGroup, elle est étendue à tous les états visuels du modèle. Par exemple, vous ne pouvez pas définir deux états différents nommés « Focus » dans le même modèle XAML, même s’ils se trouvent dans des groupes différents.
Vous devez utiliser l’attribut x :Name pour nommer un état visuel ou un groupe d’états visuels ; l’attribut non préfixé « Name » ne fonctionnera pas.
VisualState et VisualStateGroup ont chacune une Name propriété, mais elles sont en lecture seule. Cette Name propriété existe pour les scénarios avancés qui utilisent du code pour examiner le contenu d’un modèle de contrôle au moment de l’exécution, et non pour la définition à partir de XAML.
Remplacement du modèle de contrôle d’un contrôle existant
Si vous êtes développeur d’applications à l’aide d’un contrôle dans l’interface utilisateur de votre application, vous pouvez remplacer le modèle de contrôle en définissant la propriété Control.Template sur une autre valeur. Vous pouvez également remplacer le modèle en déclarant un nouveau style qui utilise la clé de style implicite pour ce contrôle. Pour plus d’informations sur ces concepts, consultez les modèles de contrôle XAML.
Lorsque vous remplacez un modèle de contrôle, il est important de reproduire tous les éléments nommés VisualState existants à partir du contenu du modèle de VisualStateManager.VisualStateGroups contrôle d’origine en XAML. Le code de contrôle (que vous ne modifiez pas) appelle GoToState. Les états avec ces noms doivent exister dans le modèle de contrôle. Une demande d’absence VisualState ne lève pas d’exceptions, mais elle laisse souvent le contrôle dans un état visuel qui sera déroutant pour l’utilisateur. Par exemple, si vous ne fournissez pas de VisualState contrôle « Activé » pour un contrôle CheckBox , aucun retour visuel n’apparaît lorsque l’utilisateur sélectionne le contrôle. L’utilisateur s’attend à ce qu’il y ait quelque chose de visuellement différent pour distinguer une vérification d’une case CheckBox à cocher CheckBox. Par conséquent, un échec de reproduction des états visuels dans la partie développeur de l’application rend le contrôle rompu à l’utilisateur.
Lorsque vous utilisez un IDE tel que Microsoft Visual Studio, les actions que vous utilisez pour remplacer un modèle de contrôle offrent la possibilité de commencer par une copie du modèle XAML du modèle d’origine. Vous pouvez donc voir tous les éléments nommés VisualState d’origine et toute autre composition de contrôle que vous remplacez. Il est préférable de commencer par des copies de modèle, puis de les modifier, afin que vous n’omettez pas accidentellement un état visuel attendu de votre nouveau modèle.
Attribution d’é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 stateName valeur qu’un consommateur de contrôle passe dans un appel GoToState pour utiliser cet état visuel. Si la VisualState partie fait partie d’un VisualStateGroup, elle doit également être indiquée dans vos valeurs d’attribut.
Constructeurs
| Nom | Description |
|---|---|
| VisualState() |
Initialise une nouvelle instance de la classe VisualState . |
Propriétés
| Nom | Description |
|---|---|
| Dispatcher |
Retourne |
| DispatcherQueue |
Obtient le |
| Name |
Obtient le nom de VisualState. |
| Setters |
Obtient une collection d’objets Setter qui définissent des valeurs de propriété discrètes qui contrôlent l’apparence d’UIElements quand cet objet VisualState est appliqué. |
| StateTriggers |
Obtient une collection d’objets StateTriggerBase qui indiquent quand cet Objet VisualState doit être appliqué. Si aucun des déclencheurs n’est actif, il |
| Storyboard |
Obtient ou définit un Storyboard qui définit des valeurs de propriété spécifiques à l’état et l’apparence du contrôle lorsqu’il utilise cet état visuel. |
Méthodes
| Nom | Description |
|---|---|
| ClearValue(DependencyProperty) |
Efface la valeur locale d’une propriété de dépendance. (Hérité de DependencyObject) |
| GetAnimationBaseValue(DependencyProperty) |
Retourne toute valeur de base établie pour une propriété de dépendance, qui s’applique dans les cas où une animation n’est pas active. (Hérité de DependencyObject) |
| GetValue(DependencyProperty) |
Retourne la valeur effective actuelle d’une propriété de dépendance à partir d’un DependencyObject. (Hérité de DependencyObject) |
| ReadLocalValue(DependencyProperty) |
Retourne la valeur locale d’une propriété de dépendance, si une valeur locale est définie. (Hérité de DependencyObject) |
| RegisterPropertyChangedCallback(DependencyProperty, DependencyPropertyChangedCallback) |
Inscrit une fonction de notification pour écouter les modifications apportées à une dependencyProperty spécifique sur cette instance DependencyObject . (Hérité de DependencyObject) |
| SetValue(DependencyProperty, Object) |
Définit la valeur locale d’une propriété de dépendance sur un DependencyObject. (Hérité de DependencyObject) |
| UnregisterPropertyChangedCallback(DependencyProperty, Int64) |
Annule une notification de modification qui a été précédemment inscrite en appelant RegisterPropertyChangedCallback. (Hérité de DependencyObject) |