Sélection de texte et d’images

Cet article décrit la sélection et la manipulation de texte, d’images et de contrôles et fournit des instructions relatives à l’expérience utilisateur qui doivent être prises en compte lors de l’utilisation de ces mécanismes dans vos applications.

API importantes : Windows.UI.Xaml.Input, Windows.UI.Input

Pratiques conseillées et déconseillées

• Utilisez des glyphes de police lors de l’implémentation de votre propre interface utilisateur de gripper. Le gripper est une combinaison de deux polices d’interface utilisateur Segoe disponibles à l’échelle du système. L’utilisation de ressources de police simplifie le rendu à différentes résolutions et fonctionne correctement avec les différents seuils de mise à l’échelle de l’interface utilisateur. Lors de l’implémentation de vos propres grippeurs, ils doivent partager les caractéristiques d’interface utilisateur suivantes :

  • Forme circulaire
  • Visible sur n’importe quel arrière-plan
  • Taille cohérente

• Fournissez une marge autour du contenu sélectionnable pour prendre en charge l’interface utilisateur du gripper. Si votre application permet la sélection de texte dans une région qui ne défile ni ne peut être panoramique, prévoyez une marge de manipulation de 1/2 sur les côtés gauche et droit de la zone de texte et une hauteur de manipulation sur les côtés supérieur et inférieur de la zone de texte (comme illustré dans les images suivantes). Cela garantit que l’ensemble de l’interface utilisateur de gripper est exposé à l’utilisateur et réduit les interactions involontaires avec d’autres interfaces utilisateur basées sur la périphérie.

  

• Masquer l’interface utilisateur des grippers pendant l’interaction. Élimine l’occlusion par les préhengeurs pendant l’interaction. Cela est utile lorsqu'une poignée n'est pas complètement masquée par le doigt ou qu'il y a plusieurs poignées de sélection de texte. Cela élimine les artefacts visuels lors de l’affichage des fenêtres enfants.

• N’autorisez pas la sélection d’éléments d’interface utilisateur tels que les contrôles, les étiquettes, les images, le contenu propriétaire, etc. En règle générale, les applications Windows autorisent la sélection uniquement dans des contrôles spécifiques. Les contrôles tels que les boutons, les étiquettes et les logos ne sont pas sélectionnables. Déterminez si la sélection est un problème pour votre application et, le cas échéant, identifiez les zones de l’interface utilisateur où la sélection doit être interdite.

Indications d’utilisation supplémentaires

La sélection et la manipulation de texte sont particulièrement sensibles aux défis de l’expérience utilisateur introduits par les interactions tactiles. La souris, le stylo/tactile, et l'entrée du clavier sont très granulaires : un clic de souris ou un contact de stylet correspond généralement à un pixel unique, et une touche est enfoncée ou non. L’entrée tactile n'est pas granulaire ; il est difficile de mapper toute la surface d'un bout de doigt à un emplacement x-y spécifique sur l'écran pour placer le curseur de texte avec précision.

Considérations et recommandations

Utilisez les contrôles intégrés exposés via les frameworks de langage dans Windows pour créer des applications qui fournissent l’expérience d’interaction utilisateur complète de la plateforme, y compris les comportements de sélection et de manipulation. Vous trouverez les fonctionnalités d’interaction des contrôles intégrés suffisants pour la majorité des applications Windows.

Lorsque vous utilisez des contrôles de texte Windows standard, les comportements de sélection et les visuels décrits dans cette rubrique ne peuvent pas être personnalisés.

Sélection de texte

Si votre application nécessite une interface utilisateur personnalisée qui prend en charge la sélection de texte, nous vous recommandons de suivre les comportements de sélection Windows décrits ici.

Contenu modifiable et non modifiable

Avec l’interaction tactile, les interactions de sélection sont effectuées principalement au moyen de gestes tels qu’un toucher pour définir un curseur d’insertion ou sélectionner un mot, et un glissement pour modifier une sélection. Comme avec d’autres interactions tactiles Windows, les interactions chronométrées sont limitées au mouvement de pression et de suspension pour afficher l’interface utilisateur informationnelle. Pour plus d’informations, consultez Recommandations pour les commentaires visuels.

Windows reconnaît deux états possibles pour les interactions de sélection, modifiables et non modifiables, et ajuste l’interface utilisateur de sélection, les commentaires et les fonctionnalités en conséquence.

Contenu modifiable

Le fait d’appuyer dans la moitié gauche d’un mot place le curseur immédiatement à gauche du mot, tandis qu’appuyer dans la moitié droite place le curseur immédiatement à droite du mot.

L’image suivante montre comment placer un curseur d’insertion initial avec une poignée en tapotant près du début ou de la fin d’un mot.

L’image suivante montre comment ajuster une sélection en faisant glisser la pince.

Les images suivantes montrent comment appeler le menu contextuel en appuyant sur la sélection ou sur une poignée (appuyer et maintenir peut également être utilisé).

Note Ces interactions varient un peu dans le cas d’un mot mal orthographié. Le fait d’appuyer sur un mot marqué comme mal orthographié met le mot entier en surbrillance et fait apparaître le menu contextuel des suggestions orthographiques.

Contenu non modifiable

L’image suivante montre comment sélectionner un mot en appuyant dans le mot (aucun espace n’est inclus dans la sélection initiale).

Suivez les mêmes procédures que pour le texte modifiable pour ajuster la sélection et afficher le menu contextuel.

Manipulation d’objets

Dans la mesure du possible, utilisez les mêmes ressources de préhension (ou similaires) que la sélection de texte lors de l’implémentation d’une manipulation d'objet personnalisée dans une application Windows. Cela permet de fournir une expérience d’interaction cohérente au sein de la plateforme.

Par exemple, les grippeurs peuvent également être utilisés dans les applications de traitement d’images qui prennent en charge le redimensionnement et le rognage ou les applications de lecteur multimédia qui fournissent des barres de progression réglables, comme illustré dans les images suivantes.

Lecteur multimédia avec barre de progression réglable.

Éditeur d’images avec pinces de rognage.

Articles connexes

Pour les développeurs

• Interactions utilisateur personnalisées

Samples

• Exemple d’entrée de base
• Exemple d’entrée à faible latence
• Exemple de mode d’interaction utilisateur
• exemple de visuels de Focus

Exemples d’archivage

• Entrée : exemple d’événements d’entrée utilisateur XAML

• Entrée : exemple de fonctionnalités d’appareil

• Entrée : exemple de test de détection tactile

• Exemple de zoom, de mouvement panoramique et de défilement XAML

• Entrée : exemplaire d'encre simplifiée

• Entrée : Exemple de manipulations et de mouvements

• Exemple d’entrée tactile DirectX