En utilisant des modificateurs d'apparence, vous pouvez personnaliser davantage l'apparence de vos GuiObjects.
- Appliquez un dégradé à l'arrière-plan d'un objet.
- Appliquez un contour au texte ou à une bordure.
- Définissez des coins arrondis pour un objet.
- Augmentez le remplissage entre les bordures d'un objet.
- Ajoutez une ombre portée derrière un objet.
Dégradé
L'objet UIGradient applique un dégradé de couleur et de transparence à son parent GuiObject.
Vous pouvez configurer le dégradé en :
- Choisissant le point de départ du dégradé (à l'intérieur ou à l'extérieur des limites du parent) via la propriété Offset.
- Choisissant l'angle du dégradé via la propriété Rotation.
Séquence de couleurs
Pour définir la séquence de couleurs d'un dégradé :
Dans la fenêtre Explorer, sélectionnez le UIGradient.
Dans la fenêtre Propriétés, cliquez à l'intérieur du champ de propriété Color, puis cliquez sur le bouton ⋯ à droite de la zone de saisie. Une fenêtre contextuelle de séquence de couleurs s'affiche.
Chaque triangle sur l'axe inférieur de la séquence de couleurs est un point clé qui détermine la valeur de couleur à ce point.
Cliquez sur un point clé dans la séquence de couleurs, puis cliquez sur le petit carré à côté de Couleur pour ouvrir la fenêtre contextuelle Couleurs.
Sélectionnez la couleur souhaitée pour le point clé.
Si nécessaire, vous pouvez :
- Ajouter un autre point clé en cliquant n'importe où sur le graphique.
- Faire glisser un point clé existant vers une nouvelle position, ou sélectionner un point clé et entrer une valeur de temps spécifique via l'entrée Temps.
- Supprimer un point clé en le sélectionnant et en cliquant sur le bouton Supprimer.
- Réinitialiser la séquence en cliquant sur le bouton Réinitialiser.
Transparence
Pour ajuster la transparence d'un dégradé sur toute sa plage :
Dans la fenêtre Explorer, sélectionnez le UIGradient.
Dans la fenêtre Propriétés, cliquez à l'intérieur du champ de propriété Transparency, puis cliquez sur le bouton ⋯ à droite de la zone de saisie. Une fenêtre contextuelle de séquence numérique s'affiche.
Chaque carré sur le graphique de la séquence numérique est un point clé qui détermine la valeur de transparence à ce point.
Cliquez et faites glisser n'importe quel point clé, ou sélectionnez un point clé et entrez une combinaison temps/valeur spécifique via les entrées Temps et Valeur.
Si nécessaire, vous pouvez :
- Ajouter un autre point clé en cliquant n'importe où sur le graphique.
- Supprimer un point clé en le sélectionnant et en cliquant sur le bouton Supprimer.
- Réinitialiser la séquence en cliquant sur le bouton Réinitialiser.
Décalage et rotation
Les propriétés Offset et Rotation vous permettent d'ajuster les points de contrôle du dégradé et son angle. Comme illustré dans les diagrammes suivants, Offset est basé sur un pourcentage de la largeur ou de la hauteur du parent, et les valeurs positives ou négatives sont valides.
De même, lorsque vous faites pivoter le dégradé, les points de contrôle tournent également :
Contour
L'instance UIStroke applique un contour au texte ou à une bordure. Les caractéristiques clés incluent :
- Capacité à définir la transparence du contour indépendamment de la transparence du parent.
- Position et/ou décalage personnalisables par rapport à la bordure du parent.
- Trois styles de coins (arrondi, biseauté ou en onglet).
- Support de dégradé pour le contour via l'instance UIGradient.
Épaisseur
Vous pouvez définir la largeur du contour via la propriété Thickness, qui est mesurée en pixels (par défaut) ou mise à l'échelle par rapport au parent, selon le StrokeSizingMode du modificateur. Si le contour est sur du texte et que StrokeSizingMode est défini sur ScaledSize, l'épaisseur est relative à la taille de la police.
Couleur ou dégradé
Vous pouvez définir la couleur du contour via la propriété Color, ainsi qu'insérer une instance enfant UIGradient pour créer des contours en dégradé.
L'objet parent et UIStroke peuvent tous deux avoir des instances enfants UIGradient, vous permettant de définir des dégradés sur le contour et le remplissage indépendamment.
Contour de texte ou bordure
Selon le type de son parent, UIStroke fonctionne soit comme un contour de texte, soit comme une bordure. Lorsque vous parentifiez UIStroke à un objet texte comme TextLabel, il s'applique au contour du texte ; lorsque vous parentifiez UIStroke à d'autres GuiObjects, il s'applique à la bordure.
Lorsqu'il est appliqué à un objet texte, vous pouvez remplacer le comportement par défaut du contour par la propriété ApplyStrokeMode, vous permettant d'appliquer le contour aux limites de l'objet plutôt qu'au texte lui-même. Vous pouvez même contrôler indépendamment le contour du texte et la bordure en parentifiant deux instances UIStroke à un objet texte, l'une définie sur Contextuel et l'autre sur Bordure.
Position/décalage de la bordure
BorderStrokePosition définit la position du contour par rapport à la bordure de son parent et BorderOffset vous permet de spécifier un décalage supplémentaire à la position du contour.
Transparence
La propriété Transparency définit la transparence du contour indépendamment de la BackgroundTransparency de l'objet parent ou de la TextTransparency. Cela vous permet de rendre le texte et les bordures "creux" (consistant uniquement en un contour).
Style de coin
La propriété LineJoinMode vous permet de contrôler comment les coins sont interprétés. Elle accepte une valeur de Round, Bevel, ou Miter.
Superposition
Pour superposer plusieurs instances de UIStroke sur un GuiObject de l'avant vers l'arrière, vous pouvez utiliser la propriété ZIndex. Celles avec un ZIndex inférieur se rendent en dessous (derrière) de celles avec un ZIndex supérieur.
Notez que l'ordre de rendu pour les instances UIStroke ayant le même ZIndex est indéfini. Ne pas appliquer plusieurs instances UIStroke avec le même index si leur ordre de rendu est important.
Coins
L'instance UICorner applique une déformation aux coins de son parent GuiObject. Vous pouvez contrôler le rayon appliqué via la propriété CornerRadius en utilisant soit Scale soit Offset.
Scale arrondit les coins à un pourcentage basé sur la longueur totale du bord le plus court du parent, ce qui signifie qu'un échelle de 0.5 ou plus déforme le parent en une forme de "gélule", quelle que soit sa largeur ou sa hauteur. Offset arrondit les coins à un nombre spécifique de pixels, quelle que soit la largeur/hauteur du parent.
Vous pouvez également contrôler les coins individuels via les propriétés TopLeftRadius, TopRightRadius, BottomRightRadius, et BottomLeftRadius.
TopRightRadius = (0, 48)
BottomRightRadius = (0, 48)
BottomLeftRadius = (0, 0)
Remplissage
Un objet UIPadding applique un remplissage en haut, en bas, à gauche et/ou à droite au contenu du parent GuiObject. Par exemple, vous pouvez déplacer le texte à l'intérieur d'une étiquette de texte vers le bas ou vers le haut en appliquant un décalage à la propriété PaddingBottom du modificateur.
Ombre
Un objet UIShadow rend une ombre portée derrière son instance UI parent. Les caractéristiques clés incluent :
- Ajustez la flou de l'ombre.
- Ajustez la couleur et la transparence de l'ombre.
- Ajustez le décalage et l'étalement de l'ombre.
- Si le parent est tourné par GuiObject.Rotation, l'ombre sera également tournée.
- Si le parent a des coins arrondis, l'ombre aura également des coins arrondis.
UIShadow ne prend pas en charge le texte. Si vous ajoutez ce modificateur à un TextLabel ou TextButton, il rend une ombre de la zone de délimitation rectangulaire de l'objet, et non du texte.
Flou
La propriété BlurRadius détermine le flou de l'ombre. Une valeur plus grande rend les bords de l'ombre plus doux. Notez que le facteur de scale de cette propriété UDim est relatif à la largeur ou à la hauteur du parent, selon ce qui est le plus court.
Couleur et transparence
La propriété Color détermine la couleur de l'ombre, tandis que Transparency définit la transparence de l'ombre avec 0 étant complètement opaque et 1 étant complètement transparent.
Décalage et étalement
La propriété Offset déplace l'ombre par rapport à la position du parent, tandis que Spread étend ou réduit l'ombre par rapport à la taille du parent.
