Conseil éducatif

  • Article

Un conseil d’apprentissage est un menu volant semi-persistant riche en contenu qui fournit des informations contextuelles. Il est souvent utilisé pour fournir à l’utilisateur des informations, des rappels et des enseignements concernant des fonctionnalités nouvelles ou importantes susceptibles d’améliorer son expérience.

La fermeture d’un conseil d’apprentissage peut résulter d’un abandon interactif ou d’une action explicite. Un conseil d’apprentissage peut cibler un élément d’interface utilisateur spécifique avec son extension ou être utilisé sans extension ou cible.

Est-ce le contrôle approprié ?

Un contrôle TeachingTip permet d’attirer l’attention sur des mises à jour et fonctionnalités nouvelles ou importantes, de rappeler l’existence d’options non essentielles susceptibles d’améliorer l’expérience ou d’enseigner la manière d’accomplir une tâche.

Le conseil d’apprentissage s’affichant de façon temporaire, son utilisation n’est pas recommandée pour informer l’utilisateur d’erreurs ou de changements d’état importants.

Recommandations

  • Les conseils sont impermanents et ne doivent pas contenir d’informations ou d’options critiques pour l’expérience d’une application.
  • Essayez d’éviter l’affichage trop fréquent de conseils d’apprentissage. Les conseils d’apprentissage ont plus de chance d’attirer l’attention quand ils sont espacés sur de longues sessions, voire sur plusieurs sessions.
  • Veillez à ce qu’ils restent concis et à ce que leur thème soit clairement identifiable. La recherche a montré que les utilisateurs ne lisent en moyenne que de 3 à 5 mots et n’en comprennent que 2 ou 3 avant de décider d’interagir avec un conseil.
  • L’accessibilité à la manette de jeu d’un conseil d’apprentissage n’est pas garantie. Pour les applications qui prévoient l’utilisation d’une manette de jeu, voir Interactions avec manette de jeu et télécommande. Nous vous conseillons de tester l’accessibilité à la manette de jeu de chaque conseil d’apprentissage en utilisant toutes les configurations possibles de l’interface utilisateur d’une application.
  • Lorsque vous activez un conseil d’apprentissage pour échapper la racine XAML, il est conseillé d’activer la propriété IsLightDismissEnabled et de définir le mode PreferredPlacement le plus proche du centre de la racine XAML.

Reconfiguration d’un conseil d’apprentissage ouvert

Il est possible de reconfigurer certains contenus et propriétés lorsque le conseil d’apprentissage est ouvert, avec effet immédiat. D’autres contenus et propriétés, tels que la propriété icon, les boutons Action et Fermer, ainsi que la reconfiguration d’abandon interactif en abandon explicite, nécessitent que le conseil d’apprentissage soit fermé, puis rouvert pour que les modifications apportées prennent effet. Notez que la modification du comportement d’abandon manuel en abandon interactif quand un conseil d’apprentissage est ouvert a pour effet que le bouton de fermeture est supprimé avant que le mode d’abandon interactif soit activé, et que le conseil peut rester bloqué à l’écran.

Exemples

Un conseil d’apprentissage peut avoir plusieurs configurations, dont les plus remarquables sont présentées ci-après :

Un conseil d’apprentissage peut cibler un élément d’interface utilisateur spécifique avec son extension pour améliorer la clarté contextuelle des informations qu’il présente.

Exemple d’application avec un conseil d’enseignement ciblant le bouton Enregistrer. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. » Un bouton fermer se trouve dans le coin supérieur droit du conseil d’enseignement.

Lorsque les informations présentées n’ont pas trait à un élément d’interface utilisateur particulier, il est possible de créer un conseil d’apprentissage non ciblé en supprimant l’extension.

Exemple d’application avec un conseil d’enseignement dans le coin inférieur droit. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. » Un bouton fermer se trouve dans le coin supérieur droit du conseil d’enseignement.

Un conseil d’apprentissage peut nécessiter que l’utilisateur le ferme à l’aide d’un bouton « X » dans un angle supérieur ou d’un bouton « Fermer » en bas. Un conseil d’apprentissage peut également disparaître par abandon interactif, auquel cas il est dépourvu de bouton de fermeture, mais disparaît quand un utilisateur interagit avec d’autres éléments de l’application. Compte tenu de ce comportement, le mode d’abandon interactif constitue la meilleure solution quand le conseil doit figurer dans une zone avec défilement.

Exemple d’application avec un conseil d’enseignement clair-ignorer dans le coin inférieur droit. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. »

UWP et WinUI 2

Important

Les informations et les exemples de cet article sont optimisés pour les applications qui utilisent le SDK d'application Windows et WinUI 3, mais qui s’appliquent généralement aux applications UWP qui utilisent WinUI 2. Consultez la référence API de la plateforme Windows universelle pour obtenir des informations et des exemples spécifiques à la plateforme.

Cette section contient les informations dont vous avez besoin pour utiliser le contrôle dans une application de la plateforme Windows universelle ou de WinUI 2.

L’info-bulle d’enseignement pour les applications UWP nécessite la bibliothèque d’interface utilisateur Windows 2. Pour plus d’informations, notamment des instructions d’installation, consultez la bibliothèque d’interface utilisateur Windows. Les API de ce contrôle existent dans l’espace de noms Microsoft.UI.Xaml.Controls .

Pour utiliser le code de cet article avec WinUI 2, utilisez un alias en XAML (nous utilisons muxc) pour représenter les API de bibliothèque d’interface utilisateur Windows incluses dans votre projet. Consultez Bien démarrer avec WinUI 2 pour plus d’informations.

xmlns:muxc="using:Microsoft.UI.Xaml.Controls"

<muxc:TeachingTip />

Créer un conseil d’apprentissage

Ouvrez l’application WinUI 3 Gallery et voyez l’info-bulle d’enseignement en action.

L’application WinUI 3 Gallery comprend des exemples interactifs de la plupart des contrôles et des fonctionnalités WinUI 3. Procurez-vous l’application sur le Microsoft Store ou le code source sur GitHub.

Voici le code XAML d’un conseil d’apprentissage ciblé qui montre l’apparence par défaut du conseil d’apprentissage avec un titre et un sous-titre. Notez que le conseil d’apprentissage peut apparaître n’importe où dans l’arborescence d’éléments ou le code-behind. Dans l’exemple ci-dessous, il se trouve dans un ResourceDictionary.

<Button x:Name="SaveButton" Content="Save">
    <Button.Resources>
        <TeachingTip x:Name="AutoSaveTip"
            Target="{x:Bind SaveButton}"
            Title="Save automatically"
            Subtitle="When you save your file to OneDrive, we save your changes as you go - so you never have to.">
        </TeachingTip>
    </Button.Resources>
</Button>

public MainPage()
{
    this.InitializeComponent();

    if(!HaveExplainedAutoSave())
    {
        AutoSaveTip.IsOpen = true;
        SetHaveExplainedAutoSave();
    }
}

Voici le résultat lorsque la page contenant le bouton et le conseil d’apprentissage s’affiche :

Exemple d’application avec un conseil d’enseignement ciblant le bouton Enregistrer. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. » Un bouton fermer se trouve dans le coin supérieur droit du conseil d’enseignement.

Dans l’exemple ci-dessus, les propriétés Title et Subtitle sont utilisées pour définir le titre et le sous-titre du conseil d’apprentissage. La propriété Target a pour valeur le « SaveButton » afin d’établir la connexion visuelle entre elle-même et le bouton. Pour afficher le conseil d’apprentissage, sa propriété IsOpen est définie sur true.

Conseils non ciblés

Certains conseils ne sont pas liés à un élément affiché à l’écran. Dans ces scénarios, ne définissez pas de cible ; le conseil d’apprentissage apparaîtra plutôt dans un positionnement relatif par rapport aux bords de la racine XAML. Il est également possible de supprimer l’extension d’un conseil d’apprentissage tout en conservant le positionnement par rapport à un élément d’interface utilisateur en affectant la valeur « Collapsed » à la propriété TailVisibility. L’exemple suivant présente un conseil d’apprentissage non ciblé.

<Button x:Name="SaveButton" Content="Save" />

<TeachingTip x:Name="AutoSaveTip"
    Title="Saving automatically"
    Subtitle="We save your changes as you go - so you never have to.">
</TeachingTip>

Notez que, dans cet exemple, le conseil d’apprentissage figure dans l’arborescence d’éléments plutôt que dans un ResourceDictionary ou un code-behind. Cela n’a pas d’incidence sur le comportement car le conseil d’apprentissage s’affiche uniquement à l’ouverture et n’occupe aucun espace dans la disposition.

Exemple d’application avec un conseil d’enseignement dans le coin inférieur droit. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. » Un bouton fermer se trouve dans le coin supérieur droit du conseil d’enseignement.

Positionnement par défaut

Le conseil d’apprentissage reproduit le comportement de positionnement FlyoutPlacementMode du menu volant avec la propriété PreferredPlacement. Le mode de positionnement par défaut tente de placer un conseil d’apprentissage ciblé au-dessus de sa cible, et un conseil d’apprentissage non ciblés centré en bas de la racine XAML. Comme avec un menu volant, si le mode de positionnement par défaut n’offre pas suffisamment d’espace pour l’affichage du conseil d’apprentissage, un autre mode de positionnement est automatiquement sélectionné.

Pour les applications qui prévoient l’utilisation d’une manette de jeu, voir Interactions avec manette de jeu et télécommande. Nous vous conseillons de tester l’accessibilité à la manette de jeu de chaque conseil d’apprentissage en utilisant toutes les configurations possibles de l’interface utilisateur d’une application.

Un conseil d’apprentissage ciblé avec le mode PreferredPlacement défini sur « BottomLeft » s’affiche avec l’extension centrée au bas de sa cible et le corps décalé vers la gauche.

<Button x:Name="SaveButton" Content="Save">
    <Button.Resources>
        <TeachingTip x:Name="AutoSaveTip"
            Target="{x:Bind SaveButton}"
            Title="Saving automatically"
            Subtitle="We save your changes as you go - so you never have to."
            PreferredPlacement="BottomLeft">
        </TeachingTip>
    </Button.Resources>
</Button>

Exemple d’application avec un bouton « Enregistrer » ciblé par un conseil d’enseignement sous son coin gauche. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. » Un bouton fermer se trouve dans le coin supérieur droit du conseil d’enseignement.

Un conseil d’apprentissage non ciblé avec son mode PreferredPlacement défini sur « BottomLeft » s’affiche dans l’angle inférieur gauche de la racine XAML.

<Button x:Name="SaveButton" Content="Save" />

<TeachingTip x:Name="AutoSaveTip"
    Title="Saving automatically"
    Subtitle="We save your changes as you go - so you never have to."
    PreferredPlacement="BottomLeft">
</TeachingTip>

Exemple d’application avec un conseil d’enseignement dans le coin inférieur gauche. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. » Un bouton fermer se trouve dans le coin supérieur droit du conseil d’enseignement.

Le diagramme ci-dessous illustre le résultat des 13 définitions possibles du mode PreferredPlacement pour les conseils d’apprentissage ciblés. Illustration contenant 13 conseils d’enseignement, chacun illustrant un mode de placement ciblé différent. Chaque conseil d’enseignement est étiqueté avec le mode qu’il représente. Le premier mot d’un mode de placement indique le côté de la cible sur lequel le conseil d’enseignement apparaîtra centré. La queue du conseil d’enseignement se trouve toujours au centre de ce côté de la cible et pointe vers la cible. S’il existe un deuxième mot dans le mode de placement, le corps du conseil d’enseignement n’est pas centré, mais est déplacé dans la direction spécifiée. Par exemple, le mode de placement « TopRight » fait apparaître le conseil d’enseignement au-dessus de la cible et déplacé vers la droite, sa queue pointant vers le bas au centre du bord supérieur de la cible. Comme le corps est déplacé vers la droite, la queue se trouve presque sur le bord le plus à gauche du corps du conseil d’enseignement, et le conseil d’enseignement s’étend au-delà du bord droit de la cible. Le mode de placement « Centrer » en unique et placera le point de fin de la pointe d’enseignement au centre de la cible et le conseil d’enseignement sera centré sur la moitié supérieure de la cible.

Le diagramme ci-dessous illustre le résultat des 13 modes PreferredPlacement qui peuvent être définis pour des conseils d’apprentissage non ciblés. Illustration contenant neuf conseils pédagogiques, chacun illustrant un mode de placement non ciblé différent. Chaque conseil d’enseignement est étiqueté avec le mode qu’il représente. Le premier mot d’un mode de placement indique le côté de la racine xaml sur lequel le conseil d’enseignement apparaîtra centré. S’il existe un deuxième mot en mode placement, le conseil d’enseignement se positionne vers l’angle spécifié de la racine xaml. Par exemple, le mode de placement « TopRight » fait apparaître le conseil d’enseignement dans le coin supérieur droit de la racine xaml. Pour les modes de placement non ciblés, l’ordre des deux mots n’affecte pas le placement. TopRight équivaut à RightTop. Le mode de placement « Centrer » en unique et fera apparaître le conseil d’enseignement dans le centre vertical et horizontal de la racine xaml.

Ajouter une marge de positionnement

Vous pouvez contrôler l’écart séparant un conseil d’apprentissage ciblé de sa cible, et séparant un conseil d’apprentissage non ciblé des bords de la racine XAML à l’aide de la propriété PlacementMargin. Comme la propriété Margin, la propriété PlacementMargin peut prendre quatre valeurs : left, right, top et bottom. Seules les valeurs pertinentes sont donc utilisées. Par exemple, la propriété PlacementMargin.Left s’applique lorsque le conseil se trouve à gauche de la cible ou sur le bord gauche de la racine XAML.

L’exemple suivant présente un conseil non ciblé avec les valeurs Left/Top/Right/Bottom de la propriété PlacementMargin définies sur 80.

<Button x:Name="SaveButton" Content="Save" />

<TeachingTip x:Name="AutoSaveTip"
    Title="Saving automatically"
    Subtitle="We save your changes as you go - so you never have to."
    PreferredPlacement="BottomLeft"
    PlacementMargin="80">
</TeachingTip>

Exemple d’application avec un conseil d’enseignement positionné vers le coin inférieur droit, mais pas entièrement par rapport. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. » Un bouton fermer se trouve dans le coin supérieur droit du conseil d’enseignement.

Ajouter du contenu

Vous pouvez ajouter du contenu à un conseil d’apprentissage à l’aide de la propriété Content. S’il y a plus de contenu à afficher que ce que la taille d’un conseil d’apprentissage permet, une barre de défilement est automatiquement activée pour permettre à un utilisateur de faire défiler la zone de contenu.

<Button x:Name="SaveButton" Content="Save">
    <Button.Resources>
        <TeachingTip x:Name="AutoSaveTip"
            Target="{x:Bind SaveButton}"
            Title="Saving automatically"
            Subtitle="We save your changes as you go - so you never have to.">
                <StackPanel>
                    <CheckBox x:Name="HideTipsCheckBox" Content="Don't show tips at start up" IsChecked="{x:Bind HidingTips, Mode=TwoWay}" />
                    <TextBlock>You can change your tip preferences in <Hyperlink NavigateUri="app:/item/SettingsPage">Settings</Hyperlink> if you change your mind.</TextBlock>
                </StackPanel>
        </TeachingTip>
    </Button.Resources>
</Button>

Exemple d’application avec un conseil d’enseignement ciblant le bouton Enregistrer. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. » Dans la zone de contenu du conseil d’enseignement se trouve une Case CheckBox intitulée « Ne pas afficher les conseils au démarrage » et en dessous se trouve un texte qui indique « Vous pouvez modifier vos préférences de pourboire dans Paramètres si vous changez d’avis » où « Paramètres » est un lien vers la page des paramètres de l’application. Un bouton fermer se trouve dans le coin supérieur droit du conseil d’enseignement.

Ajouter des boutons

Par défaut, un bouton standard de fermeture « X » est affiché en regard du titre d’un conseil d’apprentissage. Vous pouvez personnaliser ce bouton avec la propriété CloseButtonContent, auquel cas il est déplacé vers le bas du conseil d’apprentissage.

Remarque : aucun bouton de fermeture ne s’affiche sur les conseils pour lesquels le mode d’abandon interactif est activé

Vous pouvez ajouter une bouton d’action personnalisé en définissant la propriété ActionButtonContent (et éventuellement les propriétés ActionButtonCommand et ActionButtonCommandParameter).

<Button x:Name="SaveButton" Content="Save">
    <Button.Resources>
        <TeachingTip x:Name="AutoSaveTip"
            Target="{x:Bind SaveButton}"
            Title="Saving automatically"
            Subtitle="We save your changes as you go - so you never have to."
            ActionButtonContent="Disable"
            ActionButtonCommand="{x:Bind DisableAutoSaveCommand}"
            CloseButtonContent="Got it!">
                <StackPanel>
                    <CheckBox x:Name="HideTipsCheckBox" Content="Don't show tips at start up" IsChecked="{x:Bind HidingTips, Mode=TwoWay}" />
                    <TextBlock>You can change your tip preferences in <Hyperlink NavigateUri="app:/item/SettingsPage">Settings</Hyperlink> if you change your mind.</TextBlock>
                </StackPanel>
        </TeachingTip>
    </Button.Resources>
</Button>

Exemple d’application avec un conseil d’enseignement ciblant le bouton Enregistrer. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. » Dans la zone de contenu du conseil d’enseignement se trouve une Case CheckBox intitulée « Ne pas afficher les conseils au démarrage » et en dessous se trouve un texte qui indique « Vous pouvez modifier vos préférences de pourboire dans Paramètres si vous changez d’avis » où « Paramètres » est un lien vers la page des paramètres de l’application. Au bas de l’enseignement se trouvent deux boutons, un gris à gauche qui indique « Désactiver » et un bleu à droite qui indique « J’ai ! »

Contenu de bannière

Vous pouvez ajouter du contenu de bord à bord à un conseil d’apprentissage en définissant la propriété HeroContent. Vous pouvez définir l’emplacement du contenu de bannière en haut ou en bas d’un conseil d’apprentissage en définissant la propriété HeroContentPlacement.

<Button x:Name="SaveButton" Content="Save">
    <Button.Resources>
        <TeachingTip x:Name="AutoSaveTip"
            Target="{x:Bind SaveButton}"
            Title="Saving automatically"
            Subtitle="We save your changes as you go - so you never have to.">
            <TeachingTip.HeroContent>
                <Image Source="Assets/cloud.png" />
            </TeachingTip.HeroContent>
        </TeachingTip>
    </Button.Resources>
</Button>

Exemple d’application avec un conseil d’enseignement ciblant le bouton Enregistrer. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. » Au bas du conseil d’enseignement se trouve une image de bordure à frontière d’un homme de dessin animé qui met des fichiers dans le cloud. Un bouton fermer se trouve dans le coin supérieur droit du conseil d’enseignement.

Ajouter une icône

Vous pouvez ajouter une icône en regard du titre et du sous-titre à l’aide de la propriété IconSource. Les tailles d’icônes suggérées sont 16px, 24 px et 32 px.

<Button x:Name="SaveButton" Content="Save">
    <Button.Resources>
        <TeachingTip x:Name="AutoSaveTip"
            Target="{x:Bind SaveButton}"
            Title="Saving automatically"
            Subtitle="We save your changes as you go - so you never have to."
            <TeachingTip.IconSource>
                <SymbolIconSource Symbol="Save" />
            </TeachingTip.IconSource>
        </TeachingTip>
    </Button.Resources>
</Button>

Exemple d’application avec un conseil d’enseignement ciblant le bouton Enregistrer. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. » À gauche du titre et du sous-titre se trouve une icône de disquette. Un bouton fermer se trouve dans le coin supérieur droit du conseil d’enseignement.

Activer l’abandon interactif

La fonctionnalité d’abandon interactif est désactivée par défaut, mais vous pouvez l’activer en définissant la propriété IsLightDismissEnabled pour qu’un conseil d’apprentissage disparaisse, par exemple quand l’utilisateur interagit avec d’autres éléments de l’application. Compte tenu de ce comportement, le mode d’abandon interactif constitue la meilleure solution quand le conseil doit figurer dans une zone avec défilement.

Le bouton de fermeture est automatiquement supprimé d’un conseil d’apprentissage pour lequel le mode d’abandon interactif est activé afin précisément d’indiquer aux utilisateurs que ce mode est activé.

<Button x:Name="SaveButton" Content="Save" />

<TeachingTip x:Name="AutoSaveTip"
    Title="Saving automatically"
    Subtitle="We save your changes as you go - so you never have to."
    IsLightDismissEnabled="True">
</TeachingTip>

Exemple d’application avec un conseil d’enseignement clair-ignorer dans le coin inférieur droit. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. »

Échappement des limites de racine XAML

À compter de Windows 10, version 1903 (Build 18362), un conseil d’apprentissage peut échapper les limites de la racine XAML et de l’écran en définissant la propriété ShouldConstrainToRootBounds. Lorsque cette propriété est activée, le conseil d’apprentissage ne tente pas de rester dans les limites de la racine XAML ou de l’écran et reste positionné conformément au mode PreferredPlacement défini. Il est conseillé d’activer la propriété IsLightDismissEnabled et de définir le mode PreferredPlacement le plus proche du centre de la racine XAML afin de garantir une expérience optimale pour les utilisateurs.

Dans les versions antérieures de Windows, cette propriété est ignorée et le conseil d’apprentissage reste toujours dans les limites de la racine XAML.

<Button x:Name="SaveButton" Content="Save" />

<TeachingTip x:Name="AutoSaveTip"
    Title="Saving automatically"
    Subtitle="We save your changes as you go - so you never have to."
    PreferredPlacement="BottomRight"
    PlacementMargin="-80,-50,0,0"
    ShouldConstrainToRootBounds="False">
</TeachingTip>

Exemple d’application avec un conseil d’enseignement en dehors du coin inférieur droit de l’application. Le titre de l’astuce indique « Enregistrement automatique » et le sous-titre « Nous enregistrons vos modifications à mesure que vous le souhaitez. » Un bouton fermer se trouve dans le coin supérieur droit du conseil d’enseignement.

Annulation et retardement de fermeture

L’événement Closing permet d’annuler et/ou de retarder la fermeture d’un conseil d’apprentissage. Vous pouvez l’utiliser pour garder le conseil d’apprentissage ouvert ou laisser un peu de temps pour qu’une action ou une animation personnalisée se produise. En cas d’annulation de la fermeture d’un conseil d’apprentissage, la valeur de IsOpen redevient true, mais elle reste false en cas de retardement de l’annulation. Vous pouvez également annuler une fermeture par programmation.

Notes

Si aucune option de positionnement ne permet d’afficher entièrement un conseil d’apprentissage, celui-ci effectue une itération dans son cycle de vie d’événement pour forcer une fermeture au lieu de s’afficher sans bouton de fermeture accessible. Si l’application annule l’événement Closing, il se peut que le conseil d’apprentissage reste ouvert sans bouton de fermeture accessible.

<TeachingTip x:Name="EnableNewSettingsTip"
    Title="New ways to protect your privacy!"
    Subtitle="Please close this tip and review our updated privacy policy and privacy settings."
    Closing="OnTipClosing">
</TeachingTip>

private void OnTipClosing(muxc.TeachingTip sender, muxc.TeachingTipClosingEventArgs args)
{
    if (args.Reason == muxc.TeachingTipCloseReason.CloseButton)
    {
        using(args.GetDeferral())
        {
            bool success = UpdateUserSettings(User thisUsersID);
            if(!success)
            {
                // We were not able to update the settings!
                // Don't close the tip and display the reason why.
                args.Cancel = true;
                ShowLastErrorMessage();
            }
        }
    }
}