emwin多页面切换：零基础实现界面跳转逻辑

从零开始玩转 emWin：手把手教你实现多页面平滑跳转

你有没有遇到过这样的场景？
刚把 LCD 屏点亮，画了个按钮、显示个温度值，心里正美滋滋，老板突然说：“这个界面太单调了，加个设置菜单，点进去还能返回来。”
然后你就懵了——怎么跳？跳完怎么回来？要不要清屏？会不会闪？内存够不够？

别慌。今天我们就用emWin，从零开始，不讲虚的，一步步带你实现一个真正可用的多页面跳转系统。不需要懂太多底层原理，也不需要啃完几百页手册，只需要你会写 C 语言、能跑通 STM32 工程，就能照着做出来。

先搞清楚一件事：为什么不能“手动清屏重绘”？

很多初学者在做 GUI 时，第一反应是：

“我当前显示主界面 → 用户一按按钮 → 我GUI_Clear()→ 然后重新画一个新的界面。”

听起来没问题？其实坑很多：

  • 清屏会闪烁（尤其是没有双缓冲的情况下）；
  • 控件状态全丢了（比如滑动条位置、输入框内容）；
  • 返回时得再画一遍原界面，效率低；
  • 代码耦合严重，改一个页面影响全局。

而 emWin 早就为你准备好了更聪明的办法：窗口管理机制（Window Manager, WM）。

它就像手机上的 App 切换——微信和微博都在后台运行，你只是切到前台显示而已，并不需要每次点击都重启一次应用。

emWin 的“页面”到底是什么？

在 emWin 里，没有“页面”这个概念，只有“窗口（Window）”。

每个窗口是一个独立的绘制区域，有自己的坐标系、事件处理函数和生命周期。我们所谓的“页面”，其实就是一个全屏大小的顶层窗口，通常用FRAMEWIN来封装。

关键角色介绍

组件作用
WM_HWIN窗口句柄，相当于窗口的“身份证号”
FRAMEWIN_CreateEx()创建一个可作为页面容器的框架窗口
WM_CALLBACK_FUNC回调函数，负责处理消息（如按钮被点了）
WM_ShowWindow()/WM_HideWindow()显示/隐藏某个窗口
WM_BringToTop()把某个窗口提到最前面

这些 API 加起来，就是你实现页面跳转的全套工具箱。

实战：两个页面互相跳转

我们来做个最简单的例子：
有两个页面——主菜单页和设置页，主菜单有个“进入设置”按钮，设置页有个“返回”按钮，点击即可来回切换。

第一步：定义页面创建函数（接口先行）

先建两个头文件，声明每个页面的创建函数：

// page_main.h #ifndef PAGE_MAIN_H #define PAGE_MAIN_H WM_HWIN CreateMainWindow(void); #endif
// page_settings.h #ifndef PAGE_SETTINGS_H #define PAGE_SETTINGS_H WM_HWIN CreateSettingsWindow(void); #endif

这样做的好处是模块清晰，后期想加“关于页”、“网络配置页”也方便扩展。

第二步：主页面实现（带跳转逻辑）

// page_main.c #include "DIALOG.h" #include "page_main.h" #include "page_settings.h" static WM_HWIN hMainWnd; // 保存主页面句柄 // 主页回调函数 static void _cbMain(WM_MESSAGE *pMsg) { WM_HWIN hItem; int Id; switch (pMsg->MsgId) { case WM_CREATE: // 标题文本 TEXT_CreateEx(100, 10, 120, 20, pMsg->hWin, WM_CF_SHOW, 0, 0, "主菜单"); // 跳转按钮 BUTTON_CreateEx(100, 50, 100, 40, pMsg->hWin, 0, 0, 0, "进入设置"); break; case WM_NOTIFY_PARENT: // 子控件发来的通知 Id = WM_GetId(pMsg->hWinSrc); // 获取哪个控件触发 if (pMsg->Data.v == WM_NOTIFY_CHILD_CLICKED) { if (Id == GUI_ID_BUTTON0) { // 假设这是第一个按钮 WM_HideWindow(hMainWnd); // 隐藏自己 CreateSettingsWindow(); // 显示设置页 } } break; default: WM_DefaultProc(pMsg); // 其他消息交给默认处理器 } } WM_HWIN CreateMainWindow(void) { // 创建全屏 FRAMEWIN 作为主页面 hMainWnd = FRAMEWIN_CreateEx(0, 0, 320, 240, WM_CF_SHOW, 0, 0, 0, "Main", _cbMain); FRAMEWIN_SetClientColor(hMainWnd, GUI_WHITE); // 设置背景色 return hMainWnd; }

注意几个细节：
- 使用FRAMEWIN_CreateEx创建窗口，并指定回调函数_cbMain；
- 按钮通过BUTTON_CreateEx添加到主窗口中；
- 点击事件在WM_NOTIFY_PARENT中捕获；
- 当前页面隐藏后才创建新页面，避免叠加错乱。

第三步：设置页实现（支持返回）

// page_settings.c #include "DIALOG.h" #include "page_settings.h" #include "page_main.h" static WM_HWIN hSettingsWnd; static void _cbSettings(WM_MESSAGE *pMsg) { int Id; switch (pMsg->MsgId) { case WM_CREATE: TEXT_CreateEx(100, 10, 120, 20, pMsg->hWin, WM_CF_SHOW, 0, 0, "设置页"); BUTTON_CreateEx(100, 50, 100, 40, pMsg->hWin, 0, 0, 0, "返回"); break; case WM_NOTIFY_PARENT: Id = WM_GetId(pMsg->hWinSrc); if (pMsg->Data.v == WM_NOTIFY_CHILD_CLICKED) { if (Id == GUI_ID_BUTTON0) { WM_HideWindow(hSettingsWnd); // 隐藏自己 CreateMainWindow(); // 重建主页面（或复用） } } break; default: WM_DefaultProc(pMsg); } } WM_HWIN CreateSettingsWindow(void) { hSettingsWnd = FRAMEWIN_CreateEx(0, 0, 320, 240, WM_CF_SHOW, 0, 0, 0, "Settings", _cbSettings); FRAMEWIN_SetClientColor(hSettingsWnd, GUI_LIGHTGRAY); return hSettingsWnd; }

这里有个关键点：
当我们从设置页返回时，再次调用了CreateMainWindow()。但如果主页面之前只是被隐藏（没销毁），其实可以直接用句柄恢复显示，而不是重新创建。

那怎么优化？往下看。

进阶技巧：让页面“活着”，提升响应速度

频繁创建/销毁页面不仅慢，还容易造成内存碎片。更好的做法是：

常驻核心页面 + 按需加载次要页面

我们可以加一个简单的“页面管理器”：

// page_manager.h #ifndef PAGE_MANAGER_H #define PAGE_MANAGER_H void Page_SwitchToMain(void); void Page_SwitchToSettings(void); #endif
// page_manager.c #include "page_main.h" #include "page_settings.h" static WM_HWIN hMain = 0; static WM_HWIN hSetting = 0; void Page_SwitchToMain(void) { if (!hMain) { hMain = CreateMainWindow(); } else { WM_ShowWindow(hMain); WM_BringToTop(hMain); } if (hSetting) { WM_HideWindow(hSetting); } } void Page_SwitchToSettings(void) { if (!hSetting) { hSetting = CreateSettingsWindow(); } else { WM_ShowWindow(hSetting); WM_BringToTop(hSetting); } if (hMain) { WM_HideWindow(hMain); } }

现在你的跳转逻辑变成了：

// 在主页面按钮点击处： Page_SwitchToSettings(); // 在设置页返回按钮处： Page_SwitchToMain();

优点非常明显：
- 主页只创建一次，返回极快；
- 内存使用可控；
- 结构清晰，易于维护。

如何防止“越点越卡”？内存与资源管理建议

emWin 默认使用动态内存分配（GUI_ALLOC）。如果你发现跳几次就卡住甚至死机，大概率是内存不足或泄漏了。

几条铁律请牢记：

  1. 检查返回值
    所有Create函数都可能返回0，说明创建失败（内存不够）：

c hWin = FRAMEWIN_CreateEx(...); if (!hWin) { GUI_DEBUG_ERROROUT("Failed to create window!"); return; }

  1. 启用内存设备减少闪烁
    在初始化时加上这句：

c WM_SetCreateFlags(WM_CF_MEMDEV);

它会让每个窗口自带“离屏缓冲”，绘制时不直接操作屏幕，大幅降低闪烁。

  1. 监控剩余内存
    开发阶段可以定期打印：

c GUI_ALLOC_GetNumFreeBytes()

如果低于几 KB，就要考虑限制页面数量或释放非活跃页面。

  1. 公共资源统一注册
    字体、图标等不要在每个页面重复加载：

c GUI_SetFont(&GUI_Font32_ASCII); // 在 GUI_Init 后统一设置

高级玩法：模拟“返回栈”，支持多级跳转

如果你要做三级菜单（主页 → 设置 → 时间设置 → 返回 → 返回），怎么办？

可以用一个页面栈（Page Stack）来记录历史：

#define MAX_PAGE_STACK 5 static WM_HWIN hPageStack[MAX_PAGE_STACK]; static int stackIndex = -1; void Page_Push(WM_HWIN hNext) { if (stackIndex < MAX_PAGE_STACK - 1) { hPageStack[++stackIndex] = hNext; } } WM_HWIN Page_Pop(void) { return (stackIndex >= 0) ? hPageStack[stackIndex--] : 0; }

跳转时压栈，返回时出栈：

// 前进 WM_HideWindow(current); Page_Push(current); WM_ShowWindow(next); // 返回 WM_HideWindow(current); WM_HWIN prev = Page_Pop(); if (prev) WM_ShowWindow(prev);

是不是有点像 Android 的 Activity 栈？没错，思想是一样的。

常见问题 & 解决方案（避坑指南）

问题可能原因解法
页面切换后按钮没反应新页面未正确关联父窗口确保控件创建时传入pMsg->hWin作为父窗口
屏幕闪烁严重未启用内存设备加上WM_SetCreateFlags(WM_CF_MEMDEV)
返回后画面错乱多个页面同时显示且层级混乱使用WM_HideWindow隐藏旧页，必要时调WM_BringToTop
内存耗尽崩溃页面反复创建未销毁引入页面管理器，控制实例数量
文字显示乱码字体未正确加载提前注册字体并确保编码匹配（如 GB2312）

还有一个隐藏大坑：触摸校准不准会导致点击无响应！
务必确认你的 X/Y 坐标映射正确，否则你以为是 emWin 的锅，其实是驱动没调好。

最后一点思考：emWin 到底强在哪？

很多人觉得 emWin 就是个“画图库”，其实不然。

它真正的价值在于提供了一整套嵌入式 UI 框架能力：

  • 分层的窗口管理系统
  • 消息队列与事件分发机制
  • 支持动画、透明度、抗锯齿等高级特性
  • 与 RTOS（如 FreeRTOS）无缝集成
  • 成熟的调试工具链（GUIBuilder、Simulation）

掌握多页面跳转，只是迈出了第一步。后面你还可以做：
- 滑动切换动画（配合GUI_ANIM）
- 模态对话框（弹窗确认）
- 动态布局更新
- 主题切换（白天/夜间模式）

如果你正在做一个智能仪表、工业控制面板或者 IoT 设备的人机交互界面，这套方案完全可以直接用上去。

而且你会发现，一旦结构搭好了，加新功能就像搭积木一样简单。

所以别再手动Clear和Draw了，学会用 emWin 的窗口机制，让你的嵌入式 GUI 真正“活”起来。

如果你在实现过程中遇到了其他挑战，欢迎在评论区分享讨论。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/1151259.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

AI健身计划生成：MediaPipe Pose数据分析

AI健身计划生成：MediaPipe Pose数据分析

AI健身计划生成&#xff1a;MediaPipe Pose数据分析 1. 引言&#xff1a;AI驱动的个性化健身新范式 1.1 传统健身指导的局限性 在传统健身场景中&#xff0c;用户往往依赖教练经验或视频模仿进行动作训练。这种方式存在明显短板&#xff1a;缺乏实时反馈、动作标准难以量化、…
阅读更多...
批量生成字体图

批量生成字体图

有一个需求&#xff0c;甲方发了一堆的字体包&#xff0c;让我去嵌入&#xff0c;但是为了美观性&#xff0c;我还需要展示对应字体包的预览图&#xff0c;所以这就需要我来去生成了&#xff0c;因此写了一个省事的代码 from PIL import Image, ImageDraw, ImageFont import os…
阅读更多...
人体姿态检测模型：MediaPipe

人体姿态检测模型：MediaPipe

人体姿态检测模型&#xff1a;MediaPipe 1. 引言&#xff1a;AI 人体骨骼关键点检测的现实价值 随着计算机视觉技术的快速发展&#xff0c;人体姿态估计&#xff08;Human Pose Estimation&#xff09;已成为智能交互、运动分析、虚拟现实和健康监测等领域的核心技术之一。其…
阅读更多...
快速理解es连接工具在热重载中的行为表现

快速理解es连接工具在热重载中的行为表现

如何让 ES 连接在热重载中“优雅存活”&#xff1f;深入解析常见坑点与工程实践 你有没有遇到过这种情况&#xff1a;正在调试一个 Node.js 服务&#xff0c;修改了某个路由文件&#xff0c;保存后自动热重载——结果控制台突然爆出一堆 Error: read ECONNRESET 或者 too m…
阅读更多...
一键启动骨骼检测：MediaPipe镜像开箱即用指南

一键启动骨骼检测：MediaPipe镜像开箱即用指南

一键启动骨骼检测&#xff1a;MediaPipe镜像开箱即用指南 在智能健身镜中实时纠正深蹲姿势、在康复训练中自动分析步态稳定性、在虚拟直播中驱动数字人完成舞蹈动作——这些看似复杂的交互背后&#xff0c;都依赖于一项核心技术&#xff1a;人体骨骼关键点检测。然而&#xff…
阅读更多...
实测MediaPipe骨骼关键点检测：健身动作分析效果惊艳

实测MediaPipe骨骼关键点检测：健身动作分析效果惊艳

实测MediaPipe骨骼关键点检测&#xff1a;健身动作分析效果惊艳 1. 引言&#xff1a;从健身场景看人体姿态估计的落地价值 近年来&#xff0c;AI运动健康成为智能硬件和应用开发的重要方向。无论是家庭健身镜、在线私教课程&#xff0c;还是运动员动作矫正系统&#xff0c;背…
阅读更多...
MediaPipe Pose实战案例：健身动作分析系统优化教程

MediaPipe Pose实战案例：健身动作分析系统优化教程

MediaPipe Pose实战案例&#xff1a;健身动作分析系统优化教程 1. 引言&#xff1a;AI 人体骨骼关键点检测的工程价值 随着智能健身、远程康复和虚拟教练等应用的兴起&#xff0c;实时人体姿态估计已成为计算机视觉领域的重要技术支点。传统动作识别依赖传感器或复杂深度学习…
阅读更多...
全面讲解Elasticsearch聚合查询的性能优化策略

全面讲解Elasticsearch聚合查询的性能优化策略

如何让Elasticsearch聚合查询快如闪电&#xff1f;一线工程师的实战调优笔记你有没有遇到过这样的场景&#xff1a;一个看似简单的“按地区统计订单量”请求&#xff0c;却让ES集群CPU飙到90%、响应时间从毫秒级暴涨到十几秒&#xff1f;更糟的是&#xff0c;类似的问题在技术面…
阅读更多...
MediaPipe Pose应用开发：集成到现有系统的步骤

MediaPipe Pose应用开发：集成到现有系统的步骤

MediaPipe Pose应用开发&#xff1a;集成到现有系统的步骤 1. 引言&#xff1a;AI 人体骨骼关键点检测的工程价值 随着计算机视觉技术的发展&#xff0c;人体姿态估计&#xff08;Human Pose Estimation&#xff09;已成为智能健身、动作捕捉、虚拟试衣、安防监控等场景的核心…
阅读更多...
从图片到骨骼图：MediaPipe镜像手把手教学

从图片到骨骼图：MediaPipe镜像手把手教学

从图片到骨骼图&#xff1a;MediaPipe镜像手把手教学 1. 引言&#xff1a;为什么需要人体骨骼关键点检测&#xff1f; 在计算机视觉领域&#xff0c;人体姿态估计&#xff08;Human Pose Estimation&#xff09; 是一项基础而关键的技术。它通过分析图像或视频中的人体结构&a…
阅读更多...
AI动作捕捉系统：MediaPipe Pose部署与优化实战

AI动作捕捉系统：MediaPipe Pose部署与优化实战

AI动作捕捉系统&#xff1a;MediaPipe Pose部署与优化实战 1. 引言&#xff1a;AI人体骨骼关键点检测的现实价值 随着人工智能在视觉领域的深入发展&#xff0c;人体姿态估计&#xff08;Human Pose Estimation&#xff09;已成为智能健身、虚拟试衣、动作分析、人机交互等场…
阅读更多...
MediaPipe Pose部署案例：舞蹈动作分析效果优化实战

MediaPipe Pose部署案例：舞蹈动作分析效果优化实战

MediaPipe Pose部署案例&#xff1a;舞蹈动作分析效果优化实战 1. 引言&#xff1a;AI人体骨骼关键点检测的现实挑战 随着AI在智能健身、虚拟教练和动作捕捉等领域的广泛应用&#xff0c;人体姿态估计&#xff08;Human Pose Estimation&#xff09;已成为计算机视觉中的核心…
阅读更多...
人体骨骼检测优化：MediaPipe Pose模型调参详解

人体骨骼检测优化：MediaPipe Pose模型调参详解

人体骨骼检测优化&#xff1a;MediaPipe Pose模型调参详解 1. 引言&#xff1a;AI 人体骨骼关键点检测的工程挑战 随着计算机视觉技术的发展&#xff0c;人体姿态估计&#xff08;Human Pose Estimation&#xff09;已成为智能健身、动作捕捉、虚拟现实和人机交互等领域的核心…
阅读更多...
零基础玩转人体姿态识别：MediaPipe骨骼检测保姆级教程

零基础玩转人体姿态识别：MediaPipe骨骼检测保姆级教程

零基础玩转人体姿态识别&#xff1a;MediaPipe骨骼检测保姆级教程 1. 引言&#xff1a;为什么你需要关注人体姿态识别&#xff1f; 1.1 技术背景与应用场景 人体姿态识别&#xff08;Human Pose Estimation&#xff09;是计算机视觉中的核心任务之一&#xff0c;旨在从图像或…
阅读更多...
基于SpringBoot的闲置资产管理系统(源码+lw+部署文档+讲解等)

基于SpringBoot的闲置资产管理系统(源码+lw+部署文档+讲解等)

课题介绍随着绿色低碳理念普及及资源高效利用需求增长&#xff0c;个人与企业闲置资产积压、盘活困难等问题日益凸显&#xff0c;当前闲置资产管理中存在资产信息零散、状态跟踪不及时、盘活渠道有限、处置流程不规范等问题&#xff0c;制约了闲置资产的高效循环利用。本课题以…
阅读更多...
一键启动：MediaPipe WebUI镜像让骨骼检测开箱即用

一键启动：MediaPipe WebUI镜像让骨骼检测开箱即用

一键启动&#xff1a;MediaPipe WebUI镜像让骨骼检测开箱即用 1. 引言&#xff1a;为什么你需要一个“开箱即用”的骨骼检测方案&#xff1f; 在计算机视觉领域&#xff0c;人体姿态估计&#xff08;Human Pose Estimation&#xff09; 正在成为智能健身、动作捕捉、虚拟试衣…
阅读更多...
人体骨骼检测技术详解：MediaPipe Pose核心算法

人体骨骼检测技术详解：MediaPipe Pose核心算法

人体骨骼检测技术详解&#xff1a;MediaPipe Pose核心算法 1. 引言&#xff1a;AI 人体骨骼关键点检测的技术演进 随着计算机视觉与深度学习的快速发展&#xff0c;人体姿态估计&#xff08;Human Pose Estimation&#xff09;已成为智能交互、运动分析、虚拟现实和安防监控等…
阅读更多...
系统学习Packet Tracer汉化界面测试流程

系统学习Packet Tracer汉化界面测试流程

跨越语言鸿沟&#xff1a;Packet Tracer 汉化实战与教学提效全解析你有没有遇到过这样的场景&#xff1f;刚接触网络工程的学生&#xff0c;面对 Packet Tracer 里一连串英文菜单——“Routing Information Protocol”、“Access Control List”&#xff0c;一脸茫然。不是不懂…
阅读更多...
实测MediaPipe骨骼检测：33个关键点精准定位效果展示

实测MediaPipe骨骼检测：33个关键点精准定位效果展示

实测MediaPipe骨骼检测&#xff1a;33个关键点精准定位效果展示 1. 引言&#xff1a;为什么选择MediaPipe进行人体姿态估计&#xff1f; 在计算机视觉领域&#xff0c;人体骨骼关键点检测&#xff08;Human Pose Estimation&#xff09;是理解人类行为的基础能力之一。无论是…
阅读更多...
一键启动人体骨骼检测：MediaPipe WebUI极速体验

一键启动人体骨骼检测：MediaPipe WebUI极速体验

一键启动人体骨骼检测&#xff1a;MediaPipe WebUI极速体验 1. 引言&#xff1a;为什么需要轻量级人体骨骼检测&#xff1f; 在智能健身、动作捕捉、虚拟试衣和人机交互等前沿应用中&#xff0c;人体骨骼关键点检测正成为核心技术支撑。传统方案往往依赖GPU加速或云端API调用…
阅读更多...
最新文章

Copyright @ 2022~2023