L'objet SurfaceGui vous permet d'afficher le contenu du GUI sur les surfaces dans le monde 3D. Ils sont généralement utilisés pour afficher les classements ou les zones de panneaux dans l'espace 3D. Ce tutoriel vous montre comment créer un tableau d'affichage sur les statistiques de longue épée.
Créer une interface utilisateur graphiquede surface
Créer une partie nommée InfoBoard .
Changez la taille de la partie à 15, 18, 1 .
Insérez un SurfaceGui dans la partie et renommez-le en InfoSurfaceGui .
Insérez un Frame dans la GUI et nommez-le Frame de fond . Ce est le fond sur lequel les informations seront affichées.
Ajustement de la interface utilisateur graphique
Visage
La propriété Face détermine le visage de la partie qui sera utilisé pour afficher le SurfaceGui. L'objet Frame de fondation sera visible sur la surface comme un petit carré blanc lorsque le visage correct est sélectionné.
Définir la propriété Visage de InfoSurfaceGui sur avant .
Si la partie n'est pas visible après avoir sélectionné le visage avant, la partie peut pointer dans la mauvaise direction. Essayez de faire pivoter la partie ou de choisir un autre visage.
Taille
Pour que la couverture du cadre couvre toute la face, vous devrez ajuster sa propriété Taille .
Définir la propriété Taille de Frame de fond à 1, 0, 1, 0 afin qu'elle couvre tout le visage sélectionné.
Stylage
Il est souvent une bonne idée d'ajouter une contrainte UIPadding pour créer un espacement entre les bordures d'un objet GUI et son contenu.
Insérez une contrainte UIPadding dans InfoSurfaceGui .
Définir les propriétés PaddingBottom, PaddingLeft, PaddingRight et 2> PaddingTop2> pour créer une bordure autour du cadre.
Définissez la propriété Transparence de l'arrière-plan de Frame d'arrière-plan à 1 .
Ajouter du contenu
Vous pouvez utiliser les compétences apprises dans les tutoriels précédents pour afficher des informations dans le cadre de fond . Voici un exemple de contenu pour le cadre :
| Objet | Description |
|---|---|
| 1 | Un TextLabel pour afficher le nom de l'article avec un ImageLabel en dessous affichant des planches de bois. |
| 2) | Un ImageLabel pour afficher l'image de l'article avec une valeur de couleur de l'arrière-plan grise. Une contrainte UICorner est utilisée pour appliquer une bords arrondis à chaque coin. |
| 3 | Un cadre contenant trois étiquettes de texte positionnées avec une contrainte UIListLayout pour les organiser en une séquence horizontale, similaire à Créer une barre de score . |
Propriétés de surface
Maintenant que vous avez un SurfaceGui terminé, essayez de modifier les propriétés suivantes pour voir leurs effets.
Influence de lumière
Comme les interfaces graphiques de surface existent dans le monde 3D, elles peuvent être affectées par la lumière comme n'importe quel autre objet. La propriété LightInfluence contrôle la mesure dans laquelle la SurfaceGui est affectée par la lumière. La valeur normale est 1, ce qui signifie que l'espace
Adornes
La partie sur laquelle un SurfaceGui est affiché est déterminée par la propriété Adornee . Si elle est vide, il s'affiche automatiquement sur la partie parent. La capacité de définir Adornee permet la création de boutons interactifs lorsque le GUI n'est pas parenté à la partie. Pour adorner un SurfaceGui à une partie :
Faites glisser la surface GUI dans StarterGui .
Décorez-le à la partie en cliquant sur la zone d'entrée Adornee et sur la partie du tableau.