Skip to content
iPlugin

分类切换与列表分页

分别制作两套固定分类,以及十条数据自动拆成两页的目录。

先区分要做的效果:固定分类是把事先写好的苹果页、钻石页互相切换;数据分页是把十条目录放进每页九格,自动得到两页。前者使用 pages,后者使用 generator。

固定分类切换

要完成的效果:第一行两个分类按钮保持不动,点击后切换后两行的内容;菜单刚打开时显示苹果页。

pages-demo.yml配置效果示意 · 非游戏截图
图示状态苹果分类
窗口槽位 13窗口坐标 4x1面板局部坐标 4x0字符 X

固定分类:上方两个按钮切换下方内容区。

1. 保存分类菜单

创建 plugins/Invero/workspace/pages-demo.yml,写入下列完整配置,或下载 pages-demo.yml。

plugins/Invero/workspace/pages-demo.yml
menu:
  title: '&8分类菜单'
  rows: 3
panels:
  - locate:
      - 0
      - 0
    layout:
      - '  A   B  '
    icons:
      A:
        material: APPLE
        name: '&a苹果页'
        action: 'page set to 0'
      B:
        material: DIAMOND
        name: '&b钻石页'
        action: 'page set to 1'
  - locate:
      - 0
      - 1
    scale:
      - 9
      - 2
    default-page: 0
    pages:
      - layout:
          - '    X    '
          - '         '
        icons:
          X:
            material: APPLE
            name: '&a苹果'
      - layout:
          - '    X    '
          - '         '
        icons:
          X:
            material: DIAMOND
            name: '&b钻石'

2. 看清两个区域

  • panels[0] 是顶端一行普通面板,按钮 A、B 在窗口槽位 2、6。这两个分类按钮不属于任何一页,所以切页后仍在。
  • panels[1] 是固定分页区域,从窗口第二行开始,宽九格、高两行。pages 中每一项就是事先写好的一页。
  • 两页的 X 都在自己面板的局部槽位 4,加上分页区起点后,对应窗口槽位 13。
  • default-page: 0 选择第一项苹果页。第二项钻石页的索引是 1。

3. 打开并切换

/invero menu reload
/invero menu open pages-demo

点击“钻石页”执行 page set to 1,中央显示钻石;点击“苹果页”执行 page set to 0,中央恢复苹果。pages 不会把一页里多写的图标自动挪到另一页,新增分类要再增加一个页面板及对应按钮。

一个菜单包含多个翻页区域时,先用 panel at N select 选择目标,再执行 page。所有字段、页索引与操作别名见固定分页参考。

按数据自动分页

要完成的效果:第一行每页放九本目录书,第二行放上一页、下一页和装饰。十条目录自动分成“九条+一条”,边界按钮不可用时显示灰色玻璃。

catalog-demo.yml配置效果示意 · 非游戏截图
图示状态第 1 / 2 页
窗口槽位 0窗口坐标 0x0字符 空格 · 生成项

十条数据,每页九项;底部固定导航不占用列表位置。

1. 保存目录菜单

创建 plugins/Invero/workspace/catalog-demo.yml,写入以下配置,或下载 catalog-demo.yml。

plugins/Invero/workspace/catalog-demo.yml
menu:
  title: '&8指南目录'
  rows: 2
panels:
  - layout:
      - '         '
      - '<#######>'
    generator:
      source: custom
      elements:
        - title: '服务器规则'
        - title: '常用命令'
        - title: '玩法说明'
        - title: '世界介绍'
        - title: '物品说明'
        - title: '活动日历'
        - title: '商店指南'
        - title: '领地说明'
        - title: '组队说明'
        - title: '联系管理'
      output:
        material: BOOK
        name: '&f{{&element_title}}'
        action: "mmsg '&a你选择了 {{&element_title}}'"
    icons:
      '#':
        material: GRAY_STAINED_GLASS_PANE
        name: ' '
      '<':
        material: GRAY_STAINED_GLASS_PANE
        name: '&7上一页'
        sub:
          - if: 'not page isFirst'
            material: ARROW
            name: '&f上一页'
            action: |-
              page previous
              icon by '<' refresh
              icon by '>' refresh
      '>':
        material: GRAY_STAINED_GLASS_PANE
        name: '&7下一页'
        sub:
          - if: 'not page isLast'
            material: ARROW
            name: '&f下一页'
            action: |-
              page next
              icon by '<' refresh
              icon by '>' refresh

2. 确定哪些格子生成目录

此文件只有一个生成器面板,配置位于 panels[0]:

  1. layout 第一行九格都没有固定图标,因此是生成区。
  2. 第二行 '<#######>' 由固定 icons 占满,不参与目录生成。不是靠某个单独的 page-size 字段设置每页九条。
  3. generator.elements 按顺序保存十条目录。每个 title 在模板中通过 {{&element_title}} 读出。
  4. generator.output 定义每本书的名称和点击动作;不需要为十条数据逐个填写 slot。

3. 打开、翻页与点击目录

/invero menu reload
/invero menu open catalog-demo

打开后等待列表就绪:第一页是“服务器规则”到“组队说明”九项;左侧是不可用的灰色玻璃,右侧是可用的箭头。点击任一本书,发送“你选择了”与该条目标题。

点击下一页后,第一行只剩“联系管理”,其他八格为空;左侧变成箭头,右侧变回灰色玻璃。点击上一页恢复前九项。

这些灰色与箭头不是两套页面里复制的按钮,而是同一个固定图标的 sub 状态:not page isFirst 和 not page isLast 判断是否可翻页。

4. 切页后同步导航

每个可用箭头的动作分三步,以下是右箭头原有动作:

catalog-demo.yml 的 panels[0].icons.'>'.sub[0].action
action: |-
  page next
  icon by '<' refresh
  icon by '>' refresh

先切到下一页,再分别重新选择两个固定按钮的状态。不要为了更新箭头把这两句改为 icons refresh:它会重建生成列表,并把刚切换的页重置回第一页。

其他刷新方式见图标语句;数据筛选、排序与来源规则见生成器参考。

下一步

  • 要显示“第 1 / 2 页”:见页码显示片段,对玩家显示时将零起始索引加一。
  • 要让玩家输入关键词:使用搜索列表示例,它包含输入、取消与清除动作。
  • 要左右或上下连续移动图标:使用滚动面板,不是给 pages 加滚动字段。

Last updated on