Unreal Engine 4 RPG 系列教程（六）：背包系统

本文正在参加「金石计划」

背包系统

UMG

在这篇教程中，我要为角色开发一个背包系统，首先在开发这个功能的时候，我们得先知道在 UE 中如何去创建 UI，这里就必须要说到 UMG 了，它提供了许多的 UI 组件，例如最基本的 "文本（Textblock）"，"图片（UImage）", "进度条（ProcessBar）" 等等，如图：

创建背包 UI

创建一个 UI 文件夹，用于存放项目所有 UMG 相关的文件，随后双击打开后右键创建一个 Widget Blueprint, 取名 UI_Inventory。

打开背包事件

在游戏中打开背包需要添加按键事件，在这个工程就用 I 键来映射打开背包事件吧！在工程设置中添加打开背包事件，并用键盘 I 键来映射。

打开角色蓝图，右键搜索 OpenBag 函数，然后 CreateWidget，选择上文中的 UI_Inventory，并显示鼠标。

布局

接下来，我们来完成背包的视图布局，首先给背包添加背景色，在画布中拖入 Border，调整大小，然后居中，

修改 Border 的背景色为灰色半透明，

在 Border 上再拖入 Canvas Panel 画布组件，用于绘制标题，背包关闭按钮，以及容器列表，步骤如下，

• 先设置标题，Anchors 向上居中
• 设置关闭按钮，Anchors 向上居右，在 Button 上附加 Overlay UImage 组件，选择关闭 icon
• 底部添加俩个按钮，使用道具按钮，以及丢弃道具按钮
• 容器这里用到了俩个组件 "Scroll Box" 和 "Wrap Box"，将 ScrollBox 添加进来，居中然后调整大小，再在其中加入 WrapBox 作为它的子视图

这样我们的背包界面就完成了，效果如图：

组件的层次结构如图：

另外，由于在蓝图中需要获取 UI 的控件变量，所以在创建的时候需要给控件命名，以及勾选成为可以获取的变量，如图：

背包中将显示一个个的道具以及它的数量，道具将由 Wrap Box 作为容器将其显示出来，所以接下来我们要设计一下格子的 UI。

道具格子

道具的格子也通过 Widget 来创建，右键创建 Widget Blueprint，然后取名 UI_ItemCube, 设计如图所示，并且也需要对控件命名以及勾选成为变量：

素材准备

接下来，我们从商城中去下载一些道具素材，如图：

下载完毕后，还需要自己整理一些道具的 icon, 由于资源包里没有提供，所以我就自己在编辑器里截图了一些道具，如图：

导入到工程中，如图：

创建道具 Actor, 右键 Blueprint Class -> Actor, 取名 ItemPickUp_BP, 双击打开, 然后 Add Component 分别为 StaticMesh 和 Sphere Collosion, 如图：

创建一个枚举类型 LiquorType_E，用于分类道具：

给枚举补充类型，如图：

回到 ItemPickUp_BP 中，添加俩个变量，类型分别是 LiquorType_E 和 Texture2D，如图：

随后在 ItemPickUp_BP 文件上右键创建它的子类，Health_BP, 并给它的成员变量赋值和配置，步骤如下:

然后接下来就简单了，直接复制 Health_BP，并将剩余的道具配置完成，最终如图所示：

加载内容

道具对象创建好以后，我们在背包中先默认添加一些道具，这时候就需要一个数组来管理这些默认道具。

首先在编辑器中创建一个结构体 InventoryItemInfo_S，来定义背包道具格子：

然后，打开玩家角色蓝图，定义一个数组变量，数组的类型为 InventoryItemInfo_S，然后添加三个默认值，作为玩家背包中的初始化商品：

数据有了，接下来就让它们显示在背包中吧！打开 UI_Inventory 的 Event Graph 来加载商品，蓝图逻辑如下：

简单的说一下逻辑的步骤：

1. 获取玩家身上默认的道具数组，这里需要用到全局的 GetPlayer Character 函数，通过 Cast 转换成 Player_BP，这样就可以获取角色身上的属性了

2. 遍历道具数组，获取每个元素，这里用到了For Each Loop 函数

3. 拿到元素后，通过 SpawnActor 生成变量 Pick Up Item

4. 创建 Cube Widget, 并通过Pick Up Item 把它的缩略图以及数量赋值，这里用到了 Make Brush from Texture, SetBrush, SetText 函数

5. 将创建好的 Cube Widget 通过 Add Child to WrapBox 函数加入到 WrapBox 容器中

6. 最后将创建好的 Actor 通过 DestoryActor 函数销毁

编译保存，然后运行游戏中打开背包，你就能看到物品在背包中显示了，

最后，还要加上关闭背包的事件，给关闭按钮添加点击事件，并完成蓝图逻辑如下：

这样一个简单的背包就完成了，在后续的文章中，会对其进一步优化和完善。今天的文章到这里就结束拉，感谢~

工程地址

关注 HelloWorld杰少 回复关键字 'RPG' 获取游戏工程文件

往期文章：

• UE4 RPG游戏实战开发（五）：近战魔法
• UE4 RPG游戏实战开发（四）：远程魔法
• UE4 RPG游戏实战开发（三）：连招攻击
• UE4 RPG游戏实战开发（二）：装备武器
• UE4 RPG游戏实战开发（一）
• UE4 如何用命令行来打包你的游戏
• UE4：来为我们的角色制作一个血条吧
• 使用 Google Breakpad 来助力解决程序崩溃
• UE4 多人游戏服务器探索
• 使用虚幻引擎自动化工具实现自动化部署
• 如何在 UE4 中制作一扇自动开启的大门
• 如何在 UE4 中用代码去控制角色移动
• 如何给 UE4 场景添加游戏角色
• UE4：Android 平台开发实践指南
• UE4 开发避坑指南（持续更新）

请你喝杯 ☕️ 点赞 + 关注哦～

1. 阅读完记得给我点个赞哦，有👍 有动力
2. 关注公众号--- HelloWorld杰少，第一时间推送新姿势

最后，创作不易，如果对大家有所帮助，希望大家点赞支持，有什么问题也可以在评论区里讨论😄～**