UI设计工具文档UI设计工具文档
反馈
  • AC791
  • AC792
  • AC63
  • GPMCU
  • AD14/15/17/18/AD104
  • AD16
  • AD24
  • AC82
  • AW30
  • AW31
反馈
  • AC791
  • AC792
  • AC63
  • GPMCU
  • AD14/15/17/18/AD104
  • AD16
  • AD24
  • AC82
  • AW30
  • AW31
  • 1.工具前言

    • 1.1.工具首页
    • 1.2.前言说明
  • 2.快速使用

    • 2.1.快速使用
    • 2.2.快速上手
    • 2.3.板子配置
    • 2.4.视频教程
    • 2.5.硬件资料
  • 3.控件说明

    • 3.1.控件说明
    • 3.2.基础控件

      • 页面
      • 按钮
      • 图片按钮
      • 标签
      • 图片
      • 文本框
      • 开关
      • 数字微调器
      • 复选框
      • 下拉框
      • 进度条
      • Lottie动画
      • 帧动画
      • 图表
      • 滑动条
      • 弧线
      • 仪表盘
    • 3.3.菜单控件

      • 圆弧菜单
      • 齿轮菜单
      • 列表菜单
      • 曲线菜单
      • 网格菜单
      • 万花筒菜单
      • 多边形菜单
    • 3.4.容器控件

      • 通用容器
      • Flex布局
  • 4.高级功能

    • 4.1.时间轴动画
    • 4.2.模型绑定
    • 4.3.资源管理
    • 4.4.国际化
    • 4.5.硬件仿真
    • 4.6.自动化测试
    • 4.7.控件组
    • 4.8.菜单管理
    • 4.9.页面管理
    • 4.10.动态页面
  • 5.插件系统

    • 5.1.插件说明
    • 5.2.开发指南
    • 5.3.字体合并
    • 5.4.图片编辑
    • 5.5.截图
    • 5.6.项目合并
    • 5.7.项目属性编辑
    • 5.8.视频转图片
  • 6.使用案例

    • 6.1.倒计时案例
  • 7.常见问题

    • 7.1.问题说明
    • 7.2.编译问题
    • 7.3.LVGL问题
    • 7.4.仿真问题
    • 7.5.UI工具问题
    • 7.6.其他问题
  • 8.工具杂项

    • 8.1.杂项1
    • 8.2.杂项2

菜单

  • 在手表项目中,通常都会有多种菜单样式的需求,比如:列表菜单、圆弧菜单、满天星菜单等等,在以前的UI工具里,需要为每个菜单样式单独设计菜单项的属性、事件等,这样会导致工作量增加,而且不利于维护。
  • 在新UI设计工具中,我们提供了菜单管理、和多种菜单控件,可以通过配置一个菜单样式,然后通过不同的菜单控件绑定这个菜单样式,就可以实现多种菜单样式的需求。
  • 后续如果需要修改菜单样式,只需要修改菜单样式,所有绑定这个菜单样式的菜单控件都会自动更新。
本章目录
  • 1. 增加菜单
  • 2. 编辑菜单
  • 3. 使用菜单
  • 4. 仿真
本章正文

增加菜单

在 资源 - 菜单管理 上,点击 添加 按钮,填写菜单信息,点击 确定 按钮,即可添加一个菜单样式。

编辑菜单

添加菜单样式后,点击下方 添加 按钮,增加菜单项,填写菜单项信息,为菜单项设置 名称、文本、图标、是否可见 、事件 等属性。

  • 菜单项的 关联页面 ,当前只在 多边形菜单 控件有效,设置后,调用 多边形菜单 控件的接口,可以切换到所关联的页面。

  • 菜单项的 文本、是否可见 支持 绑定模型,可以像其他控件属性绑定一样,绑定到模型的属性上。

  • 菜单项的 文本 支持 多国语言,配置好 多国语言 后, 文本 内容设置为 多国语言 的 原始文本,然后菜单项启用 多国语言 功能即可。

  • 菜单项的 事件 可以像普通控件一样配置事件,然后在 事件 中添加 动作。

模型绑定 里,增加了一个 bool 类型的模型属性 display,然后将 时钟 菜单项的 是否可见 属性绑定到这个模型属性上。

多国语言 里,增加了一个 中文 和 英文 的语言列,然后将菜单项的 文本 属性绑定到这个多国语言上。

使用菜单

在控件列表中,找到 圆弧菜单 控件,创建后,可以在属性的 菜单 中选择刚刚添加的菜单样式,还可以设置 圆弧菜单 控件独有的属性。

增加了两个 按钮 控件,分别给 Click 事件添加设置 多国语言 的动作,一个设置为 中文,一个设置为 英文。

增加了一个 开关 控件,给 选中 属性绑定到 display 模型属性上。

仿真

编译仿真后,可以看到 圆弧菜单 控件的菜单项是刚刚添加的菜单样式,点击 按钮 控件,可以看到 圆弧菜单 控件的菜单项的文本内容会随着按钮的点击事件变化,点击 开关 控件,可以看到 时钟 菜单项的 是否可见 会随着开关的选中状态变化,编译输出 的打印信息中,可以看到菜单项的点击事件打印。

上一页
4.7.控件组
下一页
4.9.页面管理