Zoom optique et redimensionnement

Cet article décrit les éléments de zoom et de redimensionnement Windows et fournit des instructions d’expérience utilisateur pour l’utilisation de ces mécanismes d’interaction dans vos applications.

API importantes : Windows.UI.Input, Input (XAML)

Le zoom optique permet aux utilisateurs d’agrandir leur vue du contenu au sein d’une zone de contenu (elle est effectuée sur la zone de contenu elle-même), tandis que le redimensionnement permet aux utilisateurs de modifier la taille relative d’un ou plusieurs objets sans modifier la vue de la zone de contenu (elle est effectuée sur les objets de la zone de contenu dans la zone de contenu).

Les interactions de zoom optique et de redimensionnement sont effectuées par le biais des gestes de pincement et d’étirement (éloigner les doigts zoom avant et rapprocher les doigts zoom arrière), ou en maintenant la touche Ctrl enfoncée tout en faisant défiler la molette de la souris, ou en maintenant la touche Ctrl enfoncée (avec la touche Maj, si aucun pavé numérique n’est disponible) et en appuyant sur la touche plus (+) ou moins (-).

Les diagrammes suivants illustrent les différences entre le redimensionnement et le zoom optique.

Zoom optique : l’utilisateur sélectionne une zone, puis effectue un zoom dans l’ensemble de la zone.

Redimensionner : l’utilisateur sélectionne un objet dans une zone et redimensionne cet objet.

Note Le zoom optique ne doit pas être confondu avec le zoom sémantique. Bien que les mêmes mouvements soient utilisés pour les deux interactions, le zoom sémantique fait référence à la présentation et à la navigation du contenu organisés dans un affichage unique (par exemple, la structure de dossiers d’un ordinateur, une bibliothèque de documents ou un album photo).

Pratiques conseillées et déconseillées

Utilisez les instructions suivantes pour les applications qui prennent en charge le redimensionnement ou le zoom optique :

• Si des contraintes ou limites de taille maximale et minimale sont définies, utilisez des commentaires visuels pour illustrer quand l’utilisateur atteint ou dépasse ces limites.

• Utilisez des points d’ancrage pour influencer le comportement de zoom et de redimensionnement en fournissant des points logiques pour arrêter la manipulation et vérifier qu’un sous-ensemble spécifique de contenu est affiché dans la fenêtre d’affichage. Fournissez des points d’ancrage pour les niveaux de zoom courants ou les vues logiques pour faciliter la sélection de ces niveaux par un utilisateur. Par exemple, les applications photo peuvent fournir un point d’ancrage de redimensionnement à 100 % ou, dans le cas des applications de cartographie, les points d’ancrage peuvent être utiles aux vues de la ville, de l’état et du pays ou de la région.

  Les points d’ancrage permettent aux utilisateurs d’être imprécis et d’atteindre leurs objectifs. Si vous utilisez XAML, consultez les propriétés des points d’ancrage de ScrollViewer.

  Il existe deux types de points d’ancrage :

  • Proximité : une fois le contact levé, un point d’ancrage est sélectionné si l’inertie s’arrête dans un seuil de distance du point d’ancrage. Les points de capture de proximité permettent toujours un zoom ou un redimensionnement entre les points de capture.
  • Obligatoire : le point d’ancrage sélectionné est celui qui précède immédiatement ou réussit le dernier point d’ancrage franchi avant que le contact ne soit levé (selon la direction et la vitesse du mouvement). Une manipulation doit se terminer sur un point d’ancrage obligatoire.

• Utilisez la physique de l’inertie. Ces options en question sont les suivantes :

  • Décélération : se produit lorsque l’utilisateur cesse de pincer ou d’étirer. Cela revient à glisser pour s'arrêter sur une surface glissante.
  • Rebond : un léger effet de rebond se produit lorsqu’une contrainte de taille ou une limite est passée.

• Contrôles d’espace en fonction des instructions pour le ciblage.

• Proposez des poignées de redimensionnement pour le redimensionnement contraint. Le redimensionnement isométrique ou proportionnel est utilisé par défaut si les poignées ne sont pas spécifiées.

• N’utilisez pas de zoom pour parcourir l’interface utilisateur ou exposer des contrôles supplémentaires au sein de votre application, utilisez plutôt une région de panoramique. Pour plus d’informations sur le panoramique, consultez Instructions pour le panoramique.

• Ne placez pas d’objets redimensionnables dans une zone de contenu redimensionnable. Voici les exceptions :

  • Applications de dessin où les éléments redimensionnables peuvent apparaître sur une zone de dessin ou un plan de travail redimensionnable.
  • Pages web avec un objet incorporé tel qu’une carte.

  Note Dans tous les cas, la zone de contenu est redimensionnée, sauf si tous les points tactiles se trouvent dans l’objet redimensionnable.

Articles connexes

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