Vous pouvez définir un point de fuite afin de vous assurer qu'une partie essentielle d'une image ne sera pas recadrée. Les points de fuite sont particulièrement utiles pour les formats responsifs, lorsque la même image peut être affichée dans différentes tailles.
Points de fuite pour les images de fond
Limites concernant la disponibilité des points de fuite :
- Type de mise à l'échelle de l'image : la propriété "Échelle" doit être définie sur Recadrer l'image pour remplir l'espace ou Aucune.
- Type de source de l'image : la source doit être locale et non une URL externe.
- Annonces dynamiques : les points de fuite ne sont pas acceptés dans les annonces dynamiques.
- Animation : il n'est pas possible d'animer les points de fuite. Si la taille de l'image change durant l'animation, le point de fuite que vous définissez pour cette image s'applique à sa taille initiale.
L'activation d'un point de fuite remplace les options d'alignement.
Définir un point de fuite
- Ouvrez la boîte de dialogue Modifier le point de fuite de l'image de l'une des façons suivantes :
- Sélectionnez l'image dans l'espace de création, puis cochez la case Activer le point de fuite dans le panneau Propriétés.
- Faites un clic droit sur l'image, puis sélectionnez Définir le point de fuite dans le menu contextuel.
- Faites glisser le point de fuite à l'emplacement qui vous convient.
- Par défaut, le point de fuite est au centre de l'image.
- La commande du point de fuite se présente sous la forme d'un cercle blanc, ce qui permet de le voir et de cliquer dessus facilement. Toutefois, le réticule présent au centre indique le point de fuite réel.
- Les touches fléchées du clavier permettent de déplacer le point de fuite d'un pixel à la fois.
- Vous pouvez réinitialiser le point de fuite au centre en faisant un clic droit sur l'image, puis en sélectionnant Réinitialiser dans le menu contextuel, ou en appuyant sur Ctrl+R (Windows) ou ⌘+R (Mac).
- Accédez à l'onglet Aperçu pour voir comment le point de fuite affecte le recadrage de l'image pour différentes proportions d'image.
- Cliquez sur OK.
Si vous modifiez la source de l'image, Google Web Designer vous invite à conserver, modifier ou supprimer le point de fuite.
Modifier un point de fuite
Vous pouvez modifier la position d'un point de fuite existant :
- Ouvrez la boîte de dialogue Modifier le point de fuite de l'image de l'une des façons suivantes :
- Faites un clic droit sur l'image, puis sélectionnez Modifier le point de fuite dans le menu contextuel.
- Sélectionnez l'image, puis cliquez sur le bouton Définir la position du point de fuite
à côté de la case Activer le point de fuite dans le panneau "Propriétés".
- Faites glisser le point de fuite vers son nouvel emplacement.
- Cliquez sur OK.
Activer/Désactiver un point de fuite
Vous pouvez désactiver un point de fuite pour visualiser la façon dont votre image s'affichera en utilisant plutôt les options d'alignement. Si vous réactivez le point de fuite, Google Web Designer mémorise la position du point de fuite défini précédemment.
Pour activer/désactiver le point de fuite de l'image sélectionnée, procédez de l'une des manières suivantes :
- Cochez la case Activer le point de fuite dans le panneau "Propriétés".
- Faites un clic droit sur l'image, puis sélectionnez Activer le point de fuite ou Désactiver le point de fuite dans le menu contextuel.
Supprimer un point de fuite
- Faites un clic droit sur l'image.
- Sélectionnez Supprimer le point de fuite dans le menu contextuel.
Remplacer une image comportant un point de fuite
Lorsque vous utilisez l'option Remplacer l'image ou modifiez la source d'une image dont le point de fuite est activé, vous pouvez décider de conserver le même point de fuite, de le modifier ou de le remplacer par la nouvelle image.
Points de fuite et réglages multimédias
Les réglages multimédias ne permettent pas de modifier la position d'un point de fuite. Si vous souhaitez afficher des images différentes en fonction de la taille de la fenêtre d'affichage, mais que les images ne peuvent pas utiliser le même point de fuite, vous pouvez inclure les deux images dans votre document, puis utiliser des réglages multimédias pour définir l'opacité de chaque image sur 0 pour les tailles de fenêtre d'affichage auxquelles elles ne doivent pas être visibles.
Points de fuite dans la vue Code
Dans la vue Code, les coordonnées du point de fuite sont définies dans l'attribut focalpoint de l'élément gwd-image. Exemple :
<gwd-image class="gwd-image-1t0s" id="gwd-image_1" scaling="none" source="assets/moon_landscape.jpg" focalpoint="540 295"></gwd-image>