游戏UI

💡返回主题

做完了悬浮武器，也就意味着游戏引擎部分暂时告一段落了，接下来我们需要为游戏增添一抹色彩，也就是游戏的UI。

主菜单按钮

首先，一个游戏最重要的UI就是，返回主界面，这里我们创建一个新的角色，并把造型导入近我们的新角色并完成命名：

我们右键这个角色，然后选择创建文件夹，创建一个名为UI的文件夹，因为这个按钮是不需要跟随G相机移动的，所以我们需要将这个文件夹里面的角色全部不跟随相机：

接下来，我们编写这个角色的行为：

这里我们先在收到“开始”广播时显示，然后进行初始化，显示、大小设定、造型切换，接着在循环中移动到最前面（因为这个角色是需要保持在最上面的图层的）

然后就是移动到一个固定的位置，然后做碰到鼠标的动画，碰到鼠标我们让他放大，接着在没碰到鼠标时，缩小回去。这里缩放的效果也是使用的非线性公式哦~

当我们点击这个角色后，他会让我们断开MMO的链接，然后广播“主界面”的广播，回到主界面。

武器展示

因为这个角色到目前为止还非常简单，所以我们显示武器按钮的代码就放在这个角色里面吧！

首先我们用编号作为key进行克隆：

因为一次会显示三个按钮，所以我们这里克隆三个角色。

接着我们编写克隆体的代码：

首先初始化大小，然后重复执行移动到最前面。

我们之前创建了个专门用于储存当前装备的武器的列表“持有武器”，现在让我们在这个列表中获取第key项的内容，再将其作为我们的造型。

这样就让我们的造型和列表的内容同步了。

接下来我们让按钮移动到对应的位置，左下角按照ID排序。

再然后我们为其配置动画，如果碰到了鼠标指针，或者当前武器的名称和自己设置过的造型名称一样，我们就将大小改为大一点的，如果都没有，那就将大小改为正常的。

最后，如果在碰到鼠标的同时，鼠标按下了，就将当前武器设置为当前的ID。

现在，武器的部分也都编完了。

天空背景

最后，我们创建一个角色作为背景，这个角色也要放在UI文件夹中：

他的代码很简单，只需要在开始时重置一下就行了：

因为无论是主界面，还是游戏界面，他的效果始终都是不会有一点变化的。

至此，我们的游戏已经有了UI界面，下一小节中我们会创建一个能切换地图的主界面。

效果如下：

➡下一节：02 主界面

<iframe
  width="100%"
  height="800px"
  scrolling="no"
  src="https://www.ccw.site/embed?id=WhiteCat101/baimao/Lec4/01&type=comment"
  title="{小猫4-游戏UI}"
  frameBorder="0"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
  allowFullScreen
  scrolling="0"
></iframe>

本页索引

• 主菜单按钮
• 武器展示
• 天空背景