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

动态页面(功能测试)

动态页面,用于实现动态加载页面。目前处于beta测试阶段,功能尚未完成,请勿使用。

本章目录
  • 1. 创建动态页面
  • 2. 打包动态资源、编译工程
  • 3. 控件增加事件ID
本章正文

创建动态页面

创建一个标准页面home,和一个动态页面test。

home页面,添加一个按钮,增加Clicked事件,增加自定义事件,用于加载动态页面test。

const char * dyn_path = "A:\\workspace\\Application44\\lvgl-simulator\\board\\dynamic_res\\page\\test.dyn"; // 动态页面文件路径
gui_scr_t * scr = gui_dyn_parse_scr(dyn_path); // 解析动态页面
if(scr != NULL) {
	ui_load_scr_anim(ui, scr, LV_SCR_LOAD_ANIM_NONE, 0, 0, false, false, true);
} else {
	LV_LOG_WARN("gui_dyn_parse_scr failed");
}

test页面,添加一个时钟、一个标签、一个图片、一个按钮。 增加消息模型,用于给这些控件进行绑定测试。

时钟控件的 X 、Y 属性,分别绑定到消息模型的prop属性。标签控件的 文本内容 属性,绑定到消息模型的prop_1属性。按钮控件的 文本内容 属性,绑定到消息模型的prop_1属性。

提示

现在的动态页面只支持按钮、标签、图片、时钟、图片列表控件,其他控件暂时不支持。

打包动态资源、编译工程

点击 【运行】-【打包动态资源】,即可将工程中的所有动态页面一一打包成 dyn 文件。

预览仿真程序

控件增加事件ID

res_event_scr_pop_cb 事件,用于页面出栈,返回上一个页面。

ui_scr_stack_pop_anim(&guider_ui, LV_SCR_LOAD_ANIM_NONE, 100, 100, false, true, false);

res_event_start_sys_timer_cb 事件,用于启动系统定时器,更新模型中的系统时间

extern void start_sys_time_timer();
start_sys_time_timer();

res_event_stop_sys_timer_cb 事件,用于停止系统定时器,停止更新模型中的系统时间

extern void stop_sys_time_timer();
stop_sys_time_timer();

在 custom.c 文件中,实现 start_sys_time_timer 和 stop_sys_time_timer 函数。

lv_timer_t * sys_time_timer = NULL;
void sys_time_timer_cb(lv_timer_t * timer)
{
	gui_msg_action_change(GUI_SYS_MODEL_MSG_ID_SYS_TIME, GUI_MSG_ACCESS_GET, &guider_msg_data, VALUE_TIME);
	lv_subject_t * subject = gui_msg_get_subject(GUI_SYS_MODEL_MSG_ID_SYS_TIME);
	if (subject == NULL) return;
	lv_subject_set_pointer(subject, &guider_msg_data);
}
void start_sys_time_timer()
{
	if (sys_time_timer != NULL) return;
	sys_time_timer = lv_timer_create(sys_time_timer_cb, 1000, NULL);
}
void stop_sys_time_timer()
{
	if (sys_time_timer == NULL) return;
	lv_timer_del(sys_time_timer);
	sys_time_timer = NULL;
}

为了能在动态页面上使用 模型绑定 和 事件ID 的功能,还需要在 custom.c 文件中,绑定好动态页面相关的函数回调。

#include "gui_guider.h"

void custom_init(lv_ui *ui)
{
    gui_dyn_set_bind_get_cb((gui_bind_get_cb_t)gui_msg_get);
    gui_dyn_set_bind_get_subject_cb((gui_bind_get_subject_cb_t)gui_msg_get_subject);
    gui_dyn_set_bind_get_data_cb((gui_bind_get_data_cb_t)gui_msg_get_data);
    gui_dyn_set_bind_send_cb((gui_bind_send_cb_t)gui_msg_send);

    gui_dyn_set_event_get_cb((gui_get_event_cb_t)gui_get_event_cb);
}

给 按钮 控件增加事件ID

重新打包动态资源,编译工程,预览仿真程序

上一页
4.9.页面管理