内容纲要

对上节课的场景搭建进行重构

  • 在游戏主画面中,可以用鼠标翻页的是除了Bottom2场景外的其他界面,而Bottom2的5个图标不能翻页,而是通过点击图标进入对应的界面,我们需要对搭建好的场景进行修改。

把多个主界面做成翻页效果

  1. 给每一个MainUI下面的子节点增加背景,并设置属性。
    • 点击MainUi-StartMatchUI-Background,鼠标右键,点击拷贝,再选中其他4个节点,右击粘贴,给每个画面增加背景。
      10-搭建多个主页面并实现翻页插图
    • 改变每一个画面的颜色。选中CardSelectUI节点下的背景,在属性检查器中找到Color属性,对颜色进行修改,其他节点的颜色修改方法同该节点的设置。
      10-搭建多个主页面并实现翻页插图(1)
    • 设置背景Size为(1720,,1080)。
  2. 仿照PageView,实现翻页功能
    • 鼠标选中MainUI,在属性检查器下面有一个添加组件。
    • 点中添加组件,添加UI组件-PageView
      10-搭建多个主页面并实现翻页插图(2)
  3. 在MainUI下面新建一个空节点Pages。
    • 右击MainUI,创建节点-创建空节点,重命名为Pages。
      10-搭建多个主页面并实现翻页插图(3)
    • 选中Pages,点中添加组件,添加渲染组件-Mask。
      10-搭建多个主页面并实现翻页插图(4)
    • 设置Pages节点Size大小为(1080,1720),设置Positionwei(0,100)。
      10-搭建多个主页面并实现翻页插图(5)
  4. 把Bottom2节点从StartMatchUI节点中移出,放在MainUI节点下面,这样在翻页时,Bottom2里面的图标不会随之翻动。
  5. 在Pages节点下面设置子节点Contents节点。
    • 右击Pages,创建节点-创建空节点,修改节点名为Contents。
    • 点中PContents,设置Size大小为(5400,1720)。再点击属性检查器下面的添加组件,添加UI组件-Layout。
      10-搭建多个主页面并实现翻页插图(6)
    • 把ShopUI,CardSelectUI,StartMatchUI,GuildUI和Champion这5个页面移动到Contents节点下面。
      10-搭建多个主页面并实现翻页插图(7)

发表评论