U8G2库实现垂直滚动菜单的技术解析
2025-06-06 22:33:26作者:凤尚柏Louis
前言
在嵌入式图形界面开发中,菜单系统是最常见的交互方式之一。本文将详细介绍如何使用U8G2图形库实现一个高效的垂直滚动菜单系统,特别针对资源有限的嵌入式设备。
菜单系统设计原理
垂直滚动菜单的核心原理是通过维护多个指针变量来跟踪当前显示状态:
- select_ptr:跟踪当前选中的菜单项在可视区域内的位置
- name_ptr:跟踪当前选中的菜单项在完整列表中的绝对位置
- list_ptr:跟踪当前显示的第一个菜单项在完整列表中的位置
这种设计实现了显示窗口与完整菜单数据的分离,使得在小屏幕上显示长菜单成为可能。
关键实现细节
数据结构定义
使用结构体数组存储菜单项信息是最直接的方式:
const char* list1[] = {
"SETTING 1", "SETTING 2", "SETTING 3",
"SETTING 4", "SETTING 5", "SETTING 6",
"SETTING 7", "SETTING 8"
};
显示控制参数
合理的参数设置对菜单视觉效果至关重要:
#define LIST_PER_FRAME 5 // 每屏显示5个菜单项
#define LIST_Y(_Y) (LIST_Y_START_POINT+(12*_Y)) // 计算Y坐标
绘图函数实现
绘图函数采用U8G2的标准双缓冲模式:
void glcd_print_list(void){
u8g2.firstPage();
do {
u8g2.clearBuffer();
// 绘制当前可见的菜单项
for(int i = 0, j = list_ptr; i < LIST_PER_FRAME; j++, i++){
u8g2.drawStr(LIST_X_START_POINT, LIST_Y(i), list1[j]);
}
// 绘制选中框
u8g2.setDrawColor(1);
u8g2.drawBox(SELECT_X_START_POINT, SELECT_Y(select_ptr),
SELECT_WIDTH, SELECT_HEIGHT);
u8g2.setDrawColor(0);
u8g2.drawStr(LIST_X_START_POINT, LIST_Y(select_ptr), list1[name_ptr]);
} while (u8g2.nextPage());
}
按键处理逻辑
按键处理需要协调三个指针变量的变化:
void glcd_update_button_control(void){
if (button_pressed) {
switch(button_type){
case BUTTON_UP:
select_ptr--;
name_ptr--;
if(select_ptr < 0){
select_ptr = 0;
list_ptr--;
}
// 范围检查
if(name_ptr < 0) name_ptr = 0;
if(list_ptr < 0) list_ptr = 0;
break;
case BUTTON_DOWN:
select_ptr++;
name_ptr++;
if(select_ptr >= LIST_PER_FRAME){
select_ptr = LIST_PER_FRAME-1;
list_ptr++;
}
// 范围检查
if(name_ptr >= LIST_COUNT) name_ptr = LIST_COUNT-1;
if(list_ptr > LIST_COUNT-LIST_PER_FRAME)
list_ptr = LIST_COUNT-LIST_PER_FRAME;
break;
}
update_display_flag = true;
}
}
性能优化建议
- 减少重绘频率:使用
glcd_update标志控制,仅在需要时重绘 - 内存优化:对于固定菜单,使用PROGMEM存储字符串
- 平滑滚动:可以添加动画效果,通过多步绘制实现平滑过渡
实际应用中的注意事项
- 菜单项动态更新:如果需要动态修改菜单内容,需要确保指针变量不会越界
- 长按加速:实现长按按键时的快速滚动功能
- 触摸屏适配:如果需要支持触摸屏,需要增加触摸坐标到菜单项的映射逻辑
总结
本文介绍的U8G2垂直滚动菜单实现方案具有以下特点:
- 代码结构清晰,易于理解和维护
- 内存占用低,适合资源受限的嵌入式系统
- 响应速度快,用户体验良好
- 可扩展性强,方便添加新功能
通过合理运用指针变量和范围检查,开发者可以构建出稳定可靠的菜单系统,为嵌入式设备提供良好的用户交互体验。
登录后查看全文
热门项目推荐
相关项目推荐
atomcodeClaude Code 的开源替代方案。连接任意大模型,编辑代码,运行命令,自动验证 — 全自动执行。用 Rust 构建,极致性能。 | An open-source alternative to Claude Code. Connect any LLM, edit code, run commands, and verify changes — autonomously. Built in Rust for speed. Get StartedRust0152- DDeepSeek-V4-ProDeepSeek-V4-Pro(总参数 1.6 万亿,激活 49B)面向复杂推理和高级编程任务,在代码竞赛、数学推理、Agent 工作流等场景表现优异,性能接近国际前沿闭源模型。Python00
LongCat-Video-Avatar-1.5最新开源LongCat-Video-Avatar 1.5 版本,这是一款经过升级的开源框架,专注于音频驱动人物视频生成的极致实证优化与生产级就绪能力。该版本在 LongCat-Video 基础模型之上构建,可生成高度稳定的商用级虚拟人视频,支持音频-文本转视频(AT2V)、音频-文本-图像转视频(ATI2V)以及视频续播等原生任务,并能无缝兼容单流与多流音频输入。00
auto-devAutoDev 是一个 AI 驱动的辅助编程插件。AutoDev 支持一键生成测试、代码、提交信息等,还能够与您的需求管理系统(例如Jira、Trello、Github Issue 等)直接对接。 在IDE 中,您只需简单点击,AutoDev 会根据您的需求自动为您生成代码。Kotlin03
Intern-S2-PreviewIntern-S2-Preview,这是一款高效的350亿参数科学多模态基础模型。除了常规的参数与数据规模扩展外,Intern-S2-Preview探索了任务扩展:通过提升科学任务的难度、多样性与覆盖范围,进一步释放模型能力。Python00
skillhubopenJiuwen 生态的 Skill 托管与分发开源方案,支持自建与可选 ClawHub 兼容。Python0112
热门内容推荐
项目优选
收起
暂无描述
Dockerfile
733
4.75 K
Ascend Extension for PyTorch
Python
617
795
本项目是CANN提供的数学类基础计算算子库,实现网络在NPU上加速计算。
C++
1.01 K
1.01 K
openEuler内核是openEuler操作系统的核心,既是系统性能与稳定性的基石,也是连接处理器、设备与服务的桥梁。
C
433
395
华为昇腾面向大规模分布式训练的多模态大模型套件,支撑多模态生成、多模态理解。
Python
145
237
Claude Code 的开源替代方案。连接任意大模型,编辑代码,运行命令,自动验证 — 全自动执行。用 Rust 构建,极致性能。 | An open-source alternative to Claude Code. Connect any LLM, edit code, run commands, and verify changes — autonomously. Built in Rust for speed.
Get Started
Rust
1.18 K
152
暂无简介
Dart
983
252
Oohos_react_native
React Native鸿蒙化仓库
C++
348
403
昇腾LLM分布式训练框架
Python
166
198
🎉 (RuoYi)官方仓库 基于SpringBoot,Spring Security,JWT,Vue3 & Vite、Element Plus 的前后端分离权限管理系统
Vue
1.68 K
989