UE入门-如何使用结构体数组创建动态UI

首先,我们先来构建思路,什么是结构体?什么又是结构体数组呢?

在学校,一个学生可以拥有多个属性,比如【学号】,【ID】,【性别】等等,将这些分散的数据组合在一起,就"拼接"成了一个学生。那么如果是一个班里所有的学生,应该怎么办呢?这就用到了【结构体数组】。

UI中可以进行动态传递参数,如果我们拿到了这个结构体数组,将这个数组循环添加到UI的底部盒子中,并且使用一个【Index】来控制当前按下的是哪一个按钮,那么问题就迎刃而解了。

接下来,我们来实操吧!

①创建结构体

我们新建一个结构体,用来存放当前一个按钮的信息,包括【提示背景图】和【提示文字】

②在基类中创建结构体数组

创建好结构体后,在基类中,创建一个【结构体数组】,用来存放生成的【按钮】

切记:在基类的结构体数组中,默认添加为空。

③配置子类结构体

当父类结构体数组创建好之后,我们可以在【子类】中进行配置,因为结构体数组已经从父类中继承过来了

找到继承的结构体数组,给我们创建好的结构体数组添加两个结构体,表示两个按钮。

④进入UI环节,制作【自定义UI】

添加一个【Overlay】画布,并添加图片和按钮,调整UI大小。

切记!一定要提升为变量

在事件图表中,新建结构体变量,并将结构体变量的属性赋值给【按钮背景】和【提示文字】

!!!这里需要新建两个变量,用来存放结构体的引用和当前的索引。

接下来,我们来尝试将我们制作完成的UI控件添加到主UI中

我们的理想是先创建一个【HorizontalBox】水平框,将ButtonUI控件添加进去,但是发现添加之后会出现问题。

当将UI创建到水平框中,控件会一致向左边排列,这是错误的,我们希望控件可以在整个画布的中间进行排列。

这里可以尝试在水平框的外面包裹一层【OverLay】,这样无论添加多少button在水平中,都会在居中生成了。

接下来,可以尝试做一些动画,当角色靠近某一个物体后,播放这个动画。

在事件图表中编写动画逻辑

做完这些以后,我们发现一个问题,我们的结构体数组还没有用到过,但是如何拿到之前在父类中创建的结构体数组呢?

结果一定是:

拿到数组->遍历数组->添加到水平框

在事件的输入引脚,添加父类的引用,在发生交互的时候,将这个引用传递给事件的输入引脚。

当将结构体数组遍历并添加到【水平框】后,一起来看一下效果。

但是,问题又来了,我们创建的Index,好像从未用到过,在循环遍历中,我们给Index赋值但是并没有使用。

而Index的作用是用来判断当前按下的是哪一个按钮,相当于每一个按钮的ID。因此,我们需要在按下按钮的时候,赋值这个ID。

来到按钮的【OnClick】事件,但是怎样传递参数呢?

回头来理一下,当具体哪个物体发生交互,就会触发这个物体的【Interact】事件,而这个事件是在父类创建的,于是我们找到父类

于是,我们在父类的事件中添加一个输入引脚。

父类的事件触发是通过角色蓝图类中创建的,因此还需要回到BP_Character ,将这个CurrentIndex作为输入。

现在,我们应该找到最后的思路了,在自定义UI控件中,可以拿到角色蓝图类,调用这个函数,将参数传递过去,就大功告成了。

这样,我们就完成了使用结构体数组创建动态UI的基础思路。

我们下期间啦,拜拜!

相关推荐
重生之我是Java开发战士2 小时前
【广度优先搜索】多源BFS:矩阵,飞地的数量,地图中的最高点,地图分析
数据结构·算法·矩阵·广度优先
sali-tec2 小时前
C# 基于OpenCv的视觉工作流-章43-轮廓匹配
图像处理·人工智能·opencv·算法·计算机视觉
Coovally AI模型快速验证2 小时前
检测+跟踪一体化!4.39M参数、8.3W功耗,轻量化模型让无人机在露天矿实时巡检
算法·yolo·无人机·智能巡检·智慧矿山
玛卡巴卡ldf2 小时前
【LeetCode 手撕算法】(矩阵)73-矩阵置零、54-螺旋矩阵(贪吃蛇)、48-旋转图像
java·数据结构·算法·leetcode·力扣
C^h2 小时前
RTthread中的内存池理解
linux·数据库·c++·算法·嵌入式
深藏功yu名2 小时前
Day25(高阶篇):RAG检索与重排序算法精研|从原理到参数调优,彻底攻克检索瓶颈
人工智能·算法·ai·自然语言处理·排序算法·agent
郝学胜-神的一滴2 小时前
深入解析:生成器在UserList中的应用与Python可迭代对象实现原理
开发语言·python·程序人生·算法
雪木木2 小时前
刷题:力扣热题100--滑动窗口(Day03)
算法·leetcode
Yzzz-F2 小时前
Problem - 2157D - Codeforces
算法