Windows Dev Center

Langage: HTML | XAML

Réponse aux interactions de la souris (XAML)

Répondez à l’entrée de souris dans vos applications en gérant les mêmes événements de pointeur de base que ceux utilisés pour l’entrée tactile et du stylo.

Ces événements UIElement courants vous permettent d’implémenter une fonctionnalité de base sans avoir à rédiger de code pour chaque périphérique d’entrée. Toutefois, vous pouvez toujours tirer parti des caractéristiques spéciales de chaque périphérique (telles que les événements de roulette de souris) si vous le souhaitez. Ces événements sont répartis en trois catégories : pointeur , mouvement et manipulation.

Astuce  Les informations fournies dans cette rubrique sont spécifiques au développement d’applications en C++, C# ou Visual Basic.

Pour les applications en JavaScript, voir Réponse aux interactions de la souris (HTML).

Pour les applications utilisant DirectX avec C++, voir Développement de contrôles basés sur la souris (DirectX et C++).

Conditions préalables:  Si vous débutez dans le développement d’applications en C++, C# ou Visual Basic, consultez les rubriques ci-dessous pour vous familiariser avec les technologies décrites ici.

Créer votre première application du Windows Store en C# ou Visual Basic

Créer votre première application du Windows Store en C++

Feuille de route pour les applications Windows Runtime en C# ou Visual Basic

Feuille de route pour les applications du Windows Store en C++

Découvrir les événements avec Vue d’ensemble des événements et des événements routés.

Fonctionnalités d’application de A à Z:  Étudier cette fonctionnalité de façon plus approfondie dans le cadre de notre série Fonctionnalités d’application de A à Z

Interaction utilisateur de A à Z (XAML)

Personnalisation de l’interaction utilisateur de A à Z (XAML)

Recommandations en matière d’expérience utilisateur:  

Les bibliothèques de contrôles de plateforme (HTML et XAML) fournissent l’intégralité de l’expérience d’interaction utilisateur, y compris les interactions standard, les effets physiques animés et le retour visuel. Utilisez ces contrôles intégrés si vous n’avez pas besoin d’une prise en charge d’interaction personnalisée.

Si les contrôles de plateforme ne suffisent pas, les présentes recommandations peuvent vous aider à fournir une expérience d’interaction utilisateur à la fois immersive et cohérente entre les divers modes d’entrée. Ces recommandations sont axées principalement sur l’entrée tactile, mais elles s’appliquent également à l’entrée de pavé tactile, de souris, de clavier et de stylet.

Exemples:  Découvrez cette fonctionnalité en action dans nos exemples d’applications.

Entrée : exemple de fonctionnalités de périphériques

Exemple d’entrée

Entrée : mouvements et manipulations avec GestureRecognizer

Recommandations en matière de prise en charge des interactions de la souris

Voici quelques recommandations pour la prise en charge des interactions avec la souris :

Langage de souris

L’application uniforme du langage suivant confère un aspect familier à votre application pour vos utilisateurs. Votre application sera plus facile à appréhender et utiliser, et l’utilisateur n’en sera que plus confiant.

TermeDescription

Pointer pour apprendre

Pointez sur un élément pour afficher des informations détaillées ou des éléments visuels didactiques (tels qu’une info-bulle) ne requérant aucune action. Pour plus d’informations sur les info-bulles, voir Ajout d’info-bulles.

Cliquer avec le bouton gauche pour effectuer l’action principale

Cliquez avec le bouton gauche sur un élément pour appeler son action principale (par exemple, le lancement d’une application ou l’exécution d’une commande).

Faire défiler l’affichage pour changer de vue

Affichez des barres de défilement pour monter, descendre, aller à gauche et à droite dans une zone de contenu. Les utilisateurs peuvent faire défiler l’affichage en cliquant sur les barres de défilement ou en actionnant la roulette de la souris. Les barres de défilement peuvent indiquer l’emplacement de la vue actuelle dans la zone de contenu (un mouvement panoramique avec interaction tactile affiche une interface utilisateur similaire).

Cliquer avec le bouton droit pour sélectionner une commande

Effectuez un clic droit pour afficher les barres d’application avec des commandes globales. Cliquez avec le bouton droit sur un élément pour le sélectionner et afficher la barre de l’application avec des commandes contextuelles pour l’élément sélectionné.

Remarque  Effectuez un clic droit pour afficher un menu contextuel si les commandes de la sélection ou de la barre de l’application ne correspondent pas à des comportements d’interface utilisateur appropriés. Toutefois, nous vous recommandons vivement d’utiliser la barre de l’application pour tous les comportements des commandes.

Commandes d’interface utilisateur pour le zoom

Affichez des commandes d’interface utilisateur dans la barre de l’application (telles que + et -) ou appuyez sur Ctrl et actionnez la roulette de la souris pour émuler des mouvements de pincement et d’étirement pour le zoom.

Commandes d’interface utilisateur pour la rotation

Affichez des commandes d’interface utilisateur dans la barre de l’application ou appuyez sur Ctrl+Maj et actionnez la roulette de la souris pour émuler un mouvement de rotation. Faites pivoter l’appareil lui-même pour faire pivoter l’écran tout entier.

Cliquer avec le bouton gauche et faire glisser pour réorganiser

Cliquez avec le bouton gauche sur un élément et faites-le glisser pour le déplacer.

Cliquer avec le bouton gauche et faire glisser pour sélectionner du texte

Cliquez avec le bouton gauche dans du texte sélectionnable et faites glisser le curseur pour sélectionner du texte. Double-cliquez pour sélectionner un mot.

Coins et bords où placer la souris pour accéder à des commandes système

Placez la souris dans l’angle supérieur droit ou inférieur droit sur les dispositions de gauche à droite (ou du bord gauche sur les dispositions de droite à gauche) de l’écran pour révéler les icônes qui exposent les commandes système.

Placez la souris dans l’angle supérieur gauche dans les dispositions de gauche à droite (ou dans l’angle supérieur droit dans les dispositions de droite à gauche) pour afficher une miniature de l’application utilisée le plus récemment. Effectuez un clic gauche ou cliquez et faites glisser la souris pour faire défiler les applications en cours d’exécution et basculer vers l’une d’entre elles ou faites glisser la souris pour ancrer l’application (si la résolution de l’écran le permet).

Placez la souris dans l’angle inférieur gauche dans les dispositions de gauche à droite (ou dans l’angle inférieur droit dans les dispositions de droite à gauche) pour afficher une miniature de l’écran d’accueil.

Effectuez un clic gauche et faites glisser la souris du bord supérieur vers le bord inférieur de l’écran pour fermer l’application active.

Effectuez un clic gauche et faites glisser la souris du bord supérieur vers le bord inférieur gauche ou droit pour ancrer l’application active au côté correspondant de l’écran.

 

Matériel

Interrogez les fonctionnalités de la souris (MouseCapabilities) pour identifier les aspects de l’interface utilisateur de votre application auxquels la souris matérielle peut accéder directement. Pour plus d’informations sur l’interrogation des fonctionnalités du périphérique, voir Démarrage rapide : identification des périphériques de pointage.

Certaines souris possèdent 5 boutons. Les quatrième et cinquième boutons, nommés boutons X, permettent en général de naviguer vers l’arrière et vers l’avant dans les navigateurs Web tels que Windows Internet Explorer. Associez ces boutons aux éléments d’interface utilisateur appropriés (boutons Précédent et Suivant) dans votre application.

Si une souris possède une roulette, associez la rotation avant et la rotation arrière au défilement vertical (vers le haut et le bas) dans la zone de contenu. Activez le défilement horizontal (vers la gauche et la droite) si la zone de contenu ne défile pas verticalement. Si la roulette peut être inclinée, l’inclinaison doit activer uniquement le défilement horizontal.

La roulette de défilement doit activer le zoom (s’il est exposé) lorsque l’utilisateur appuie sur la touche de modification Ctrl.

Windows : retour visuel:  

  • Quand des événements de déplacement ou de pointage permettent de détecter une souris, affichez une interface utilisateur spécifique à la souris pour indiquer la fonctionnalité exposée par l’élément. Si la souris ne bouge pas pendant un certain temps ou si l’utilisateur commence une interaction tactile, estompez progressivement l’interface utilisateur de la souris. Cela maintient l’interface utilisateur propre et aérée.
  • N’utilisez pas le curseur pour le retour de pointage, car le retour fourni par l’élément est suffisant (voir la section Curseurs, ci-dessous).
  • N’affichez pas de retour visuel si un élément ne prend pas en charge l’interaction (tel que le texte statique).
  • N’utilisez pas de rectangles de sélection avec les interactions avec la souris. Réservez ceux-ci aux interactions avec le clavier.
  • Affichez un retour visuel simultanément pour tous les éléments qui représentent la même cible d’entrée.
  • Fournissez des boutons (tels que + et -) pour émuler des manipulations tactiles, telles que le mouvement panoramique, la rotation, le zoom, etc.

Pour obtenir des recommandations plus générales sur le retour visuel, voir Recommandations en matière de retour visuel.

Windows : curseurs:  

Un ensemble de curseurs standard est disponible pour servir de pointeurs de souris. Ces derniers sont utilisés pour indiquer l’action principale d’un élément.

Chaque curseur standard possède une image par défaut correspondante qui lui est associée. L’utilisateur ou une application peut remplacer à tout moment l’image par défaut associée à n’importe quel curseur standard. Les applications du Windows Store spécifient une image de curseur par le biais de la fonction PointerCursor.

Si vous avez besoin de personnaliser le curseur de la souris :

  • Utilisez toujours le curseur en forme de flèche (Curseur en forme de flèche) pour les éléments pouvant être activés par un clic. N’utilisez pas le curseur en forme de main (Curseur en forme de main) pour des liens ou d’autres éléments interactifs. À la place, utilisez les effets de pointage (décrits précédemment).
  • Utilisez le curseur texte (Curseur texte) pour du texte sélectionnable.
  • Utilisez le curseur de déplacement (Curseur de déplacement) lorsque l’action principale correspond à un déplacement (par exemple, un glisser-déplacer ou un rognage). N’utilisez pas le curseur de déplacement pour des éléments lorsque l’action principale correspond à une navigation (tels que les vignettes de l’écran d’accueil).
  • Utilisez les curseurs de redimensionnement horizontal, vertical et diagonal (Curseur de redimensionnement vertical, Curseur de redimensionnement horizontal, Curseur de redimensionnement diagonal (du coin inférieur gauche au coin supérieur droit), Curseur de redimensionnement diagonal (du coin supérieur gauche au coin inférieur droit)), lorsqu’un objet peut être redimensionné.
  • Utilisez les curseurs en forme de main de saisie (Curseur en forme de main de saisie (ouverte), Curseur en forme de main de saisie (fermée)) lors d’un mouvement panoramique de contenu au sein d’une zone de dessin fixe (telle qu’une carte).

Windows : commandes:  

Un clic sur le bouton droit de la souris doit activer la barre de l’application de votre application. Évitez les zones mortes dans l’interface utilisateur de votre application qui n’acceptent pas les clics droits. Pour plus d’informations sur les barres d’application, voir Ajout de barres d’application.

Rubriques associées

Réponse à l’interaction utilisateur

 

 

Afficher:
© 2015 Microsoft