다음 방법으로 위젯을 상호작용 가능하게 만들 수 있습니다.
AddWidget()함수를 사용하여 위젯을 추가할 때player_ui_slot{InputMode := ui_input_mode.All }실행인자를 추가합니다.이벤트 핸들러를 위젯 이벤트에 바인딩합니다.
현재 상호작용 가능하게 만들 수 있는 위젯은 다음과 같습니다.
다음 섹션은 이러한 위젯을 상호작용 가능하게 만드는 예시입니다.
버튼 상호작용
다음 단계를 따라 버튼이 있는 UI를 만들고, 플레이어가 버튼과 상호작용할 때 선택된 버튼 텍스트를 화면에 프린트하는 비헤이비어를 추가합니다.
위젯 제거하기에서 생성한 Verse 파일을 엽니다.
UI를 만들
CreateMyUI()함수를 생성합니다.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 MyInteractableButtonsMaybeMyUIPerPlayer타입을[player]?canvas로 변경합니다.var MaybeMyUIPerPlayer : [player]?canvas = map{}NewUI할당을 변경하여 새 함수CreateMyUI()를 호출합니다.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}) {}함수를 사용하여 위젯을 추가할 때
player_ui_slot{InputMode := ui_input_mode.All}실행인자를 추가하여 생성 시 플레이어가 캔버스에서 커서를 사용할 수 있게 합니다.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}) {}모든 UI 버튼에는 등록 가능한
OnClick()listenable이벤트가 있습니다. 이벤트 핸들러는void반환 타입과widget_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 = # 플레이어가 버튼을 누를 때 발생하는 일 정의HandleSelectedUIButton에서 버튼 텍스트를 화면에 출력하고 위젯을 화면에서 제거합니다.widget_message는 어떤 플레이어 및 UI 엘리먼트가 선택했는지 알기 때문에 그 정보를 사용하여 버튼 텍스트를 가져오고 플레이어에게 표시된 위젯을 찾아서 화면에서 제거할 수 있습니다.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) {}이 예시의 완성된 코드는 다음과 같습니다.
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
슬라이더 상호작용
다음 단계를 따라 슬라이더가 있는 UI를 만들고, 플레이어가 슬라이더와 상호작용할 때 설정된 값을 화면에 출력하는 행동을 추가합니다.
버튼 상호작용에서 생성한 Verse 파일을 엽니다.
CreateMyUI()함수를 슬라이더로 업데이트합니다.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 MyInteractableWidgets모든 UI 슬라이더에는 등록 가능한
OnValueChanged()listenable이벤트가 있습니다. 이벤트 핸들러는void반환 타입과widget_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 = #플레이어가 슬라이더 값을 변경할 때 발생하는 일 정의HandleValueChangedUISlider에서 슬라이더 값을 화면에 출력합니다.widget_message는 어떤 플레이어가 상호작용했는지, 어떤 UI 엘리먼트를 선택했는지 알기 때문에 해당 정보를 사용하여 슬라이더 값을 가져오고 플레이어에게 표시된 위젯을 찾아 화면에서 제거할 수 있습니다.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()}")이 예시의 완성된 코드는 다음과 같습니다.
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