Ajout de contrôles SemanticZoom (HTML)

[ Cet article est destiné aux développeurs Windows 8.x et Windows Phone 8.x qui créent des applications Windows Runtime. Si vous développez une application pour Windows 10, voir la Documentation ]

Le contrôle SemanticZoom permet à l’utilisateur d’effectuer un zoom entre deux affichages différents du même contenu. Cette rubrique montre comment utiliser le contrôle SemanticZoom.

Regardez cette courte vidéo pour avoir une vue d’ensemble du zoom sémantique et de son implémentation avec JavaScript et HTML.

L’utilisateur peut effectuer un zoom sémantique de deux façons : en effectuant un geste de pincement (en rapprochant les doigts pour réaliser un zoom arrière et en les écartant pour un zoom avant), ou en maintenant la touche Ctrl appuyée tout en faisant rouler la molette de défilement de la souris ou encore en maintenant la touche Ctrl appuyée et en appuyant sur les touches + ou -. L’objet SemanticZoom fournit également un bouton de zoom arrière lors de l’affichage en zoom avant.

Agrandir des contenus

Le zoom sémantique est utile pour rapidement agrandir des contenus. En appuyant sur du contenu dans une vue générale, l’utilisateur peut effectuer un zoom et faire défiler la vue en panoramique vers le point appuyé, comme illustré ici.

Dans la vue plus générale, l’intégralité du contenu peut représenter une cible tactile :

Pression sur une section du contenu :

Vue zoomée et recentrée sur la zone appuyée :

Une animation en fondu enchaîné permet de passer d’un zoom sémantique à un autre. Vous ne pouvez pas modifier ce comportement tactile par défaut.

Dans cette section