Les boutons sont des boutons qui permettent aux utilisateurs d'effectuer une action. Vous pouvez personnaliser les boutons pour fournir un contexte et des commentaires, tels que la modification de l'apparence visuelle ou le scripting d'un retour d'information audible lorsqu'un utilisateur clique sur un bouton.
Il y a deux types de boutons que vous pouvez placer sur l'écran ou dans l'expérience :
Un TextButton est un rectangle avec du texte qui déclenche l'événement Activated lorsqu'on clique/tape.
Un ImageButton est un rectangle avec une image qui déclenche l'événement Activated lorsqu'on clique/touche. Il prend en charge des états supplémentaires pour échanger l'image lorsque l'utilisateur passe la souris ou appuyersur.
Créer des boutons sur l'écran
Les boutons sur un écran sont utiles pour guider rapidement les utilisateurs dans divers menus ou pages.
Pour ajouter un bouton à l'écran :
Dans la fenêtre Explorateur , sélectionnez StarterGui et ajoutez un ScreenGUI .
Survolez StarterGui et cliquez sur le bouton ⊕. Un menu contextuel s'affiche.
Insérez un ScreenGUI .
Sélectionnez le nouveau ScreenGUI et ajoutez un bouton.
Survolez ScreenGUI et cliquez sur le bouton ⊕. Un menu contextuel s'affiche.
Insérez un bouton de texte ou bouton d'image .
Créer des boutons sur les parties du visage
Les boutons sur une partie sont utiles pour permettre aux utilisateurs d'interagir avec les parties. Par exemple, vous pouvez laisser les utilisateurs marcher sur un bouton pour terminer une action.
Pour ajouter un bouton au visage d'une partie :
Dans la fenêtre Explorateur , sélectionnez la partie et ajoutez un SurfaceGui .
Survolez la partie et cliquez sur le bouton ⊕. Un menu contextuel s'affiche.
Insérez un SurfaceGui .
Sélectionnez le nouveau SurfaceGui et ajoutez n'importe quel type de bouton ou d'entrée.
Survolez SurfaceGui et cliquez sur le bouton ⊕. Un menu contextuel s'affiche.
Insérez un bouton de texte ou bouton d'image .
Si vous ne voyez pas le bouton, essayez choisir un visage différent dans la propriété Visage du SurfaceGui.
Modifier l'apparence d'un bouton d'image
Changer l'apparence d'un ImageButton lorsqu'un utilisateur interagit avec lui fournit un retour commentairesutile. Par exemple, lorsque un ImageButton change l'apparence visuelle lorsqu'un utilisateur passe dessus, il laisse le savoir que ce n'est pas désactivé et qu'il a l'option de cliquer dessus si ils veulent effectuer cette action ImageButton
Un ImageButton a trois propriétés pour modifier son apparence visuelle :
Image - L'image qui s'affiche lorsqu'un utilisateur n'interagit pas avec le ImageButton .
HoverImage - L'image qui s'affiche lorsqu'un utilisateur passe son curseur sur le ImageButton .
PressedImage - L'image qui s'affiche lorsqu'un utilisateur clique sur le ImageButton .
Pour modifier l'apparence d'un ImageButton avec l'entrée de l'utilisateur :
Dans la fenêtre Explorateur , cliquez sur l'objet ImageButton .
Dans la fenêtre propriétés , attribuez trois ID de ressources respectifs pour le Image , HoverImage et 1>PressedImage1> propriétés.
Boutons de script
Vous pouvez script un action lorsqu'un utilisateur appuie sur un bouton en connectant le bouton à un événement GuiButton.Activated. Par exemple, lorsque vous parent le suivant LocalScript à un bouton, le bouton change en couleur aléatoire chaque fois qu'un utilisateur clique dessus.
local button = script.Parent
local RNG = Random.new()
local function onButtonActivated()
-- randomiser la couleur du bouton
button.BackgroundColor3 = Color3.fromHSV(RNG:NextNumber(), 1, 1)
end
button.Activated:Connect(onButtonActivated)