Procédez comme suit pour rendre vos widgets interactifs :
Ajoutez l'argument
player_ui_slot{InputMode := ui_input_mode.All }lorsque vous ajoutez un widget à l'aide de la fonctionAddWidget().Liez un gestionnaire d'événements à l'événement du widget.
Actuellement, vous pouvez rendre les widgets suivants interactifs :
Consultez les sections suivantes pour savoir comment rendre ces widgets interactifs.
Interagir avec des boutons
Procédez comme suit pour créer une interface utilisateur avec un bouton, et ajouter un comportement qui affiche le texte du bouton sélectionné à l'écran lorsque le joueur interagit avec le bouton :
Ouvrez le fichier Verse que vous avez créé à la rubrique Supprimer un widget.
Créez une fonction nommée
CreateMyUIt()dans laquelle vous allez créer l'interface utilisateur.CreateMyUI() : canvas = MyUIButton : button_loud = button_loud{DefaultText := TextForMyUI} MyInteractableButtons : canvas = canvas: Slots := array: canvas_slot: Anchors := anchors{Minimum := vector2{X := 0.25, Y := 0.5}, Maximum := vector2{X := 0.5, Y := 0.5}} Offsets := margin{Top := 0.0, Left := 0.0, Right := 0.0, Bottom := 0.0} Alignment := vector2{X := 0.5, Y := 0.5} SizeToContent := true Widget := MyUIButton return MyInteractableButtonsRemplacez le type de
MaybeMyUIPerPlayerpar[player]?canvas:var MaybeMyUIPerPlayer : [player]?canvas = map{}Modifiez l'assignation de
NewUIpour appeler votre nouvelle fonctionCreateMyUI().Verse# UI are added per Player. HandleButtonInteraction(Agent : agent) : void = if (InPlayer := player[Agent], PlayerUI := GetPlayerUI[InPlayer]): if (MyUI := MaybeMyUIPerPlayer[InPlayer]?): PlayerUI.RemoveWidget(MyUI) if (set MaybeMyUIPerPlayer[InPlayer] = false) {} else: NewUI := CreateMyUI() PlayerUI.AddWidget(NewUI) if (set MaybeMyUIPerPlayer[InPlayer] = option{NewUI}) {}Ajoutez l'argument
player_ui_slot{InputMode := ui_input_mode.All}lors de l'ajout d'un nouveau widget afin que le joueur puisse utiliser son curseur sur la zone de dessin lorsqu'il est créé.Verse# UI are added per Player. HandleButtonInteraction(Agent : agent) : void = if (InPlayer := player[Agent], PlayerUI := GetPlayerUI[InPlayer]): if (MyUI := MaybeMyUIPerPlayer[InPlayer]?): PlayerUI.RemoveWidget(MyUI) if (set MaybeMyUIPerPlayer[InPlayer] = false) {} else: NewUI := CreateMyUI() PlayerUI.AddWidget(NewUI, player_ui_slot{InputMode := ui_input_mode.All}) if (set MaybeMyUIPerPlayer[InPlayer] = option{NewUI}) {}Tous les boutons de l'interface utilisateur possèdent un événement
OnClick()listenableauquel vous pouvez vous abonner. Le gestionnaire d'événements doit avoir un type de retourvoidet un paramètre de typewidget_message.CreateMyUI() : canvas = MyUIButton : button_loud = button_loud{DefaultText := TextForMyUI} MyUIButton.OnClick().Subscribe(HandleSelectedUIButton) MyInteractableButtons : canvas = canvas: Slots := array: canvas_slot: Anchors := anchors{Minimum := vector2{X := 0.25, Y := 0.5}, Maximum := vector2{X := 0.5, Y := 0.5}} Offsets := margin{Top := 0.0, Left := 0.0, Right := 0.0, Bottom := 0.0} Alignment := vector2{X := 0.5, Y := 0.5} SizeToContent := true Widget := MyUIButton return MyInteractableButtons HandleSelectedUIButton(Message : widget_message) : void = # Indiquez ce qui se passe lorsque le joueur appuie sur le boutonDans
HandleSelectedUIButton, affichez le texte du bouton à l'écran et supprimez le widget de l'écran. Étant donné quewidget_messagesait quel joueur et quel élément de l'interface utilisateur l'ont sélectionné, vous pouvez utiliser ces informations pour obtenir le texte du bouton et trouver le widget présenté au joueur pour le supprimer de l'écran.VerseHandleSelectedUIButton(Message : widget_message) : void = if (PlayerUI := GetPlayerUI[Message.Player], MyUI := MaybeMyUIPerPlayer[Message.Player]?, SelectedButton := text_button_base[Message.Source]): Print("Player selected {SelectedButton.GetText()}") PlayerUI.RemoveWidget(MyUI) if (set MaybeMyUIPerPlayer[Message.Player] = false) {}Le code complet de cet exemple est le suivant.
Verseusing { /Fortnite.com/Devices } using { /Verse.org/Simulation } using { /UnrealEngine.com/Temporary/UI } using { /Fortnite.com/UI } using { /UnrealEngine.com/Temporary/SpatialMath } hello_world_device := class(creative_device): # Set the Button device in the Editor to reference the device in the level @editable
Interactions avec un curseur
Procédez comme suit pour créer une interface utilisateur avec un curseur et ajouter un comportement qui imprime la valeur définie à l'écran lorsque le joueur interagit avec le curseur :
Ouvrez le fichier Verse que vous avez créé à la rubrique Interagir avec des boutons.
Mettez à jour la fonction nommée
CreateMyUI()avec le curseur.CreateMyUI() : canvas = MyUIButton : button_loud = button_loud{DefaultText := TextForMyUI} MyUIButton.OnClick().Subscribe(HandleSelectedUIButton) MyUISlider : slider_regular = slider_regular: DefaultValue := 5.0 DefaultMinValue := 0.0 DefaultMaxValue := 10.0 DefaultStepSize := 0.5 MyInteractableWidgets : canvas = canvas: Slots := array: canvas_slot: Anchors := anchors{Minimum := vector2{X := 0.25, Y := 0.5}, Maximum := vector2{X := 0.5, Y := 0.5}} Offsets := margin{Top := 0.0, Left := 0.0, Right := 0.0, Bottom := 0.0} Alignment := vector2{X := 0.5, Y := 0.5} SizeToContent := true Widget := MyUISlider canvas_slot: Anchors := anchors{Minimum := vector2{X := 0.25, Y := 0.6}, Maximum := vector2{X := 0.5, Y := 0.6}} Offsets := margin{Top := 0.0, Left := 0.0, Right := 0.0, Bottom := 0.0} Alignment := vector2{X := 0.5, Y := 0.5} SizeToContent := true Widget := MyUIButton return MyInteractableWidgetsTous les curseurs de l'interface utilisateur possèdent un événement
OnValueChanged()listenableauquel vous pouvez vous abonner. Le gestionnaire d'événements doit avoir un type de retourvoidet un paramètre de typewidget_message.CreateMyUI() : canvas = MyUIButton : button_loud = button_loud{DefaultText := TextForMyUI} MyUIButton.OnClick().Subscribe(HandleSelectedUIButton) MyUISlider : slider_regular = slider_regular: DefaultValue := 5.0 DefaultMinValue := 0.0 DefaultMaxValue := 10.0 DefaultStepSize := 0.5 MyUISlider.OnValueChanged().Subscribe(HandleValueChangedUISlider) MyInteractableWidgets : canvas = canvas: Slots := array: canvas_slot: Anchors := anchors{Minimum := vector2{X := 0.25, Y := 0.5}, Maximum := vector2{X := 0.5, Y := 0.5}} Offsets := margin{Top := 0.0, Left := 0.0, Right := 0.0, Bottom := 0.0} Alignment := vector2{X := 0.5, Y := 0.5} SizeToContent := true Widget := MyUISlider canvas_slot: Anchors := anchors{Minimum := vector2{X := 0.25, Y := 0.6}, Maximum := vector2{X := 0.5, Y := 0.6}} Offsets := margin{Top := 0.0, Left := 0.0, Right := 0.0, Bottom := 0.0} Alignment := vector2{X := 0.5, Y := 0.5} SizeToContent := true Widget := MyUIButton return MyInteractableWidgets HandleValueChangedUISlider(Message : widget_message) : void = # Indiquer ce qui se passe lorsque le joueur modifie la valeur du curseurDans
HandleValueChangedUISlider, affichez la valeur du curseur à l'écran. Étant donné quewidget_messagesait quel joueur a interagi avec l'interface utilisateur et quel élément de l'interface utilisateur il a sélectionné, vous pouvez utiliser ces informations pour obtenir la valeur du curseur et trouver le widget présenté au joueur.VerseHandleValueChangedUISlider(Message : widget_message) : void = if: PlayerUI := GetPlayerUI[Message.Player] MyUI := MaybeMyUIPerPlayer[Message.Player]? ChangedSlider := slider_regular[Message.Source] then: Print("Player changed slider value to {ChangedSlider.GetValue()}")Le code complet de cet exemple est le suivant.
Verseusing { /Fortnite.com/Devices } using { /Verse.org/Simulation } using { /UnrealEngine.com/Temporary/UI } using { /Fortnite.com/UI } using { /UnrealEngine.com/Temporary/SpatialMath } interactable_slider := class(creative_device): # Set the Button device in the Editor to reference the device in the level @editable