Manuals
Manuals




This translation is community contributed and may not be up to date. We only maintain the English version of the documentation. Read this manual in English

Nœuds de boîte d’interface graphique

Un nœud de boîte est un rectangle rempli d’une couleur, d’une texture ou d’une animation.

Ajout de nœuds de boîte

Ajoutez de nouveaux nœuds de boîte en effectuant un clic droit dans l’Outline et en sélectionnant Add ▸ Box, ou appuyez sur A et sélectionnez Box.

Vous pouvez utiliser des images et des animations provenant d’atlas ou de sources de tuiles qui ont été ajoutés à l’interface graphique. Pour ajouter des textures, effectuez un clic droit sur l’icône du dossier Textures dans l’Outline et sélectionnez Add ▸ Textures.... Définissez ensuite la propriété Texture du nœud de boîte :

Textures

Notez que la couleur du nœud de boîte teinte les éléments graphiques. La couleur de teinte est multipliée par les données de l’image, ce qui signifie que si vous définissez la couleur sur blanc (la valeur par défaut), aucune teinte n’est appliquée.

Texture teintée

Les nœuds de boîte sont toujours rendus, même si aucune texture ne leur est attribuée, si leur alpha vaut 0 ou si leur taille vaut 0, 0, 0. Vous devriez toujours attribuer une texture aux nœuds de boîte afin que le moteur de rendu puisse les regrouper correctement et réduire le nombre d’appels de rendu.

Lecture d’animations

Les nœuds de boîte peuvent lire des animations provenant d’atlas ou de sources de tuiles. Consultez le manuel sur l’animation flipbook pour en savoir plus.

Texturage en neuf tranches

Les nœuds Box de l’interface graphique et les composants sprite (sprite components) comportent parfois des éléments dont la taille dépend du contexte : des panneaux et des boîtes de dialogue qui doivent être redimensionnés pour s’adapter à leur contenu, ou une barre de vie qui doit être redimensionnée pour indiquer les points de vie restants d’un ennemi. Cela peut entraîner des problèmes visuels lorsque vous appliquez une texture au nœud ou au sprite redimensionné.

Normalement, le moteur met la texture à l’échelle pour l’adapter aux limites du rectangle, mais la définition de zones de bordure pour le découpage en neuf tranches (slice-9) permet de limiter les parties de la texture qui doivent être mises à l’échelle :

Mise à l'échelle de l'interface graphique

Le paramètre Slice9 du nœud Box se compose de quatre nombres qui indiquent le nombre de pixels des marges gauche, supérieure, droite et inférieure qui ne doivent pas être mises à l’échelle de la manière habituelle :

Propriétés du découpage en neuf tranches

Les marges sont définies dans le sens des aiguilles d’une montre, en partant du bord gauche :

Sections du découpage en neuf tranches

  • Les segments des coins ne sont jamais mis à l’échelle.
  • Les segments des bords sont mis à l’échelle selon un seul axe. Les segments des bords gauche et droit sont mis à l’échelle verticalement. Les segments des bords supérieur et inférieur sont mis à l’échelle horizontalement.
  • La zone centrale de la texture est mise à l’échelle horizontalement et verticalement selon les besoins.

La mise à l’échelle de la texture avec Slice9 décrite ci-dessus s’applique uniquement lorsque vous modifiez la taille du nœud Box ou du sprite :

Taille du nœud Box de l'interface graphique

Taille du sprite

Si vous modifiez le paramètre d’échelle du nœud Box, du sprite ou de l’objet de jeu (game object), le nœud ou le sprite et la texture sont mis à l’échelle sans appliquer les paramètres Slice9.

Lorsque vous utilisez le texturage en neuf tranches sur des sprites, le paramètre Sprite Trim Mode de l’image doit être réglé sur Off.

Mipmaps et découpage en neuf tranches

En raison du fonctionnement du mipmapping dans le moteur de rendu, la mise à l’échelle des segments de texture peut parfois présenter des artefacts. Cela se produit lorsque vous réduisez la taille des segments en dessous de la taille de la texture d’origine. Le moteur de rendu sélectionne alors un mipmap de résolution inférieure pour le segment, ce qui entraîne des artefacts visuels.

Mipmapping du découpage en neuf tranches

Pour éviter ce problème, assurez-vous que les segments de la texture qui seront mis à l’échelle sont suffisamment petits pour ne jamais devoir être réduits, mais uniquement agrandis.