在做项目过程中,新手一般都是功能的罗列叠加,并不会过多的考虑可维护性。这样当我们后期修改功能和需求时就会变得非常麻烦,甚至会重写。尤其是对于 UMG(UI)系统更是如此。如我们要显示商店中的物品信息(图标和价格),如果一开始不考虑可维护性,那么后期我们添加和删除商店中的商品时就会变得异常麻烦。下面推荐一种 Data-Driven UMG(数据驱动),这种思想可以适用于任何引擎。
Data-Driven 系统中最核心的部分是数据本身,所以我们需要创建一张数据表(DataTable)【当然也可以用 XML JSON 和 数据库 等各种形式,但是 DataTable 对于美术来说是最友好的,来存储商店中所有的商品信息。首先我们创建一个结构体来代表每一行商品的信息,之后会创建前面提到的 DataTable ,结果如下图:
-
一行商品信息(ShopItem)
-
所有商品的信息表(ShopTable)
数据创建完成,之后就是创建界面啦。首先创建一个 Widget 蓝图,用于表示每一行的商品信息。并创建自定义方法用来设置 UMG 的值(此处并没有用 Binding ,因为相比来说 Binding 的效率可能会略低),具体效果可以参考下图。
-
设计 Widget 蓝图
-
其中需要分裂结构体为
Icon和Money进行分别设置
之后创建主界面即可,具体可参考下图。
-
设计主界面
-
在主界面中动态添加子界面
这样我们就可以随意更改 DataTable 中的数据,从而达到界面中及时更新的效果。