UI绑定背包容量

 

 创建绑定

开始写函数

 创建书包的ui，命名为BagUI

 在创建背包预置物ui，命名为BagItemSlot

尺寸自定义

 

100*100

删掉画布，然后拖入一个按钮

 加入一个分层管理的容器，overlay

向其容器里面添加image，作为图标

 分别设置overlay和image，让其占满空间

向容器中拖入文本

 修改字体大小和颜色

将文本放在右下方

设置一下字体的阴影，让字体更醒目

设置阴影的偏移

现在设置overlay和image的边距，都设成0，这样就可以占满按钮了。

对图片和文本进行重命名

将文本设成可编辑

进入背包的ui，再拖入一个画布，重命名为BagPanel

 

按shift+ctrl设置锚点

 设置bagpanel的大小

再拖入一个画布，重命名为title

 

按shift+ctrl设置锚点，并调整一下高度

 

 向title中拖入一个border，一个文本

 按shift+ctrl设置border的锚点

 

背景改成灰色

 按shift+ctrl设置文本的锚点

 

设置文本的文字和大小，并微调位置，效果如下

 再拖入一个画布，重名为contentArea

 按shift+ctrl设置锚点

 调整大小

加入border

 

 按shift+ctrl设置border的锚点

颜色为黑，透明度改为0.3

 拖入网格容器

  按shift+ctrl设置网格容器的锚点

 

 为容器包裹一层scroll box

设置滚动条的粗度

 拖入我们ui试一下

效果

 

但我发现了一个问题

我换成苹果就是这种效果。

 推断：跟照片有关系：128*128是正常的，其他的不正常，要改成128*128

 打开美图秀秀：新建 128*128画布

 右键插入图片，并调整图片大小

导入图片

 换上这个苹果

问题解决 

 

 如果这个空隙太大，就调整一下这个画布

我们在项目设置里面再添加一个action的输入映射 

-------------------------------------------------------------------------------------------------------------

我们设置函数来实现显示、隐藏背包ui等其他ui的功能

 在小白人蓝图里面先创建2个函数，分别是showpanel和hidepanel

 我们把拾取面板的显示事件的蓝图逻辑复制到showpanel函数里面

 这两个要变成参数

变成这样

 重命名一下

 这个节点也要换，换成通过引用设置参数的节点

 

整理一下这个线

拾取面板调用函数

 这个也放到函数里

 

测试：报错

原因set by ref var赋值无效

 只能用老办法了。

创建背包图表

创建显示隐藏背包事件

 

创建变量，类型是bagui的对象引用

 

 打开背包

 关闭背包

 通过输入动作事件打开关闭背包