UE4中的Widget按钮事件绑定

UE4中的Widget按钮事件绑定

  • 前言
    • 1. 界面创建
      • 1.1 创建UI控件(Widget)
      • 1.2 添加按钮
      • 1.3 为按钮添加响应事件
      • 1.4 蓝图界面
    • 2 接口设计
      • 2.1 创建一个接口
      • 2.2 修改接口
      • 2.2 修改UI界面的事件响应流程
    • 3 事件响应
      • 3.1 接口实现
      • 3.2 程序接入

前言

因为掌握的知识太过基础知识存在大量断点而导致没有办法直接在网上找到UI按钮绑定主逻辑流程的方法,就写一个供大家参考 ??。

1. 界面创建

1.1 创建UI控件(Widget)

在主界面的“内容浏览器”中鼠标右键选择 “用户界面” -> “控件蓝图” 创建一个新的UI蓝图如“bowling_UI”

1.2 添加按钮

双击打开 “bowling_UI” 对象,在右上角的设计器界面中拖拽按钮进入主绘制区域(这里我一共添加了两个按钮)。
在UI界面中插入按钮

1.3 为按钮添加响应事件

选中一个按钮,在右侧的按钮“细节”面板中往下滑动滚轮,最最下面可以看到“事件”列表,选一个你喜欢的事件,点击“+”号。
为按钮添加事件

1.4 蓝图界面

到这里UI的界面就设计完了,稍后我们会回到这里

2 接口设计

在widget中,想要实现一个点击事件,需要借助于一个接口设置发起以及相应,在widget中设置点击发起事件,在蓝图类中设置一个响应类同时设置具体的函数实现方法,中间借助于接口interface来传输。

2.1 创建一个接口

在主界面的“内容浏览器”中鼠标右键选择 “蓝图” -> “蓝图接口” 创建一个新的蓝图接口如“UI_interface”

2.2 修改接口

双击打开刚才创建的“UI_interface”,可以看到在接口里面已经内置了一个函数,对准了这个函数单击一下就能修改它!改成你喜欢的名字比如“kickAss”。
修改接口内函数名称

2.2 修改UI界面的事件响应流程

让我们回到在1.1中创建的"Bowling_UI"这个界面控件,选择图表模式,就可以看到在1.3中添加的事件节点了,再额外添加一个新的节点"Get All Actors with interface",以及之前在Interface中创建过的那个函数“kickAss”。
创建接口调用
需要注意的是,在"Get All Actors with interface"节点中,需要设置参数“interface”的值,为你之前指定的那个接口。
那么现在UI方面我们已经准备好了,现在回到关卡的主蓝图。

3 事件响应

3.1 接口实现

打开关卡蓝图,点击上方的类设置按钮,可以再右边面板看到类设置面板。点击添加按钮,为该蓝图类添加对UIInterface的实现。
在这里插入图片描述

3.2 程序接入

在程序面板里面再右键搜索之前创建的“kickAss”事件,就可以搜索到“Event Fire Ball”~就可以执行主逻辑流程了!
在这里插入图片描述
全文完。