设为首页收藏本站
开启辅助访问 切换到宽版

 找回密码
 立即注册

QQ登录

只需一步，快速开始

热门： 51单片机 | 24小时必答区 | 单片机教程 | 单片机DIY制作 | STM32 | Cortex M3 | 模数电子 | 电子DIY制作 | 音响/功放 | 拆机乐园 | Arduino | 嵌入式OS | 程序设计

搜索
»论坛 › 嵌入式/单片机论坛 › STM32/8 › 基于STM32之OLED菜单界面框架搭建
12下一页
返回列表 发新帖
查看: 23647|回复: 56
收起左侧

基于STM32之OLED菜单界面框架搭建

  [复制链接]
ID:235201 发表于 2018-10-3 21:41 | 显示全部楼层 |阅读模式
基于STM32驱动OLED屏显示三级菜单界面框架搭建
个人总结的一些经验，写的不好勿喷。
  • 硬件要求
    （1）处理器：STM32F103系列。
    （2）OLED屏，SPI或IIC接口都可以。
    （3）按键，用于控制界面的切换。
一个基本的菜单界面最少有有一个主界，所以所有先设计一个主界面。
1.什么是主界面？
/******** 这里说的主界面是本次需要设计的主界面 ********/
主界面是电路上电程序启动完成后屏幕显示的第一个界面，就是主界面。
主界面根据自己的爱好来设计，比如：
IMG_20181001_135438.jpg
界面中的图形和文字可自己设计，这里我设计的就如上图所示。
主界面设计好后，那么根据自己的需求来添加多级界面。
我这里就设计了三级菜单界面。
IMG_20181001_141102.jpg

好，那么对应的界面做好后，就是如何控制界面之间的切换。
  1. /*********************************************
  2. * 创建一个结构体
  3. * 存放界面标志位
  4. */
  5. typedef struct
  6. {
  7.     u8 Interface_Mark;     //界面状态
  8.     u8 Task_Mark;          //任务状态
  9.     u8 Run_Task;           //开始运行任务
  10. } Mark;
  11. Mark Mark_Sign;//状态标志位

  13. /*********************************************
  14. * 创建一个枚举
  15. * 存放界面变量
  16. */
  17. enum
  18. {
  19.     Main_Interface = 0x10, /****主界面*****/
  20.     Menu_Interface = 0x20, /****菜单界面***/
  21.     Task_Interface = 0x30, /****任务界面***/
  22. };
  23. /*******************************************/
  24. switch(Mark_Sign.Interface_Mark)
  25. {
  26.         //状态标志位 主界面
  27.         case Main_Interface:
  28.             Main_Interface_APP();//显示主界面
  29.     break;

  31.         //状态标志位 菜单界面
  32.         case Menu_Interface:
  33.             Menu_Interface_APP();//显示菜单界面
  34.     break;

  36.         //状态标志位 任务界面
  37.         case Task_Interface:
  38.                     Function_Menu_APP();//显示功能界面
  39.     break;
  40. default:
  41.     break;

复制代码

上面这段代码用来判断是三级中哪一级界面。
里面创建了一个结构体，通过改变结构体里面的一个标志位来控制三级界面之间的切换。

那么就要用到按键来改变标志位的值，这里我采用了外部中断来控制。


  1. <font color="rgb(79, 79, 79)"><font face="-apple-system, &quot;"><font style="font-size: 16px">/*************左摇杆按键*****菜单 确认按键**********************/
  2.     if(DISABLE == KEY_Rocker_Left)
  3.     {
  4.         //当按下菜单键时，判断当前界面
  5.         /************判断当前界面为主界面***********************/
  6.         if(Main_Interface == Mark_Sign.Interface_Mark)
  7.         {
  8.             /**************进入菜单界面*************/
  9.             Mark_Sign.Interface_Mark = Menu_Interface;
  10.         }
  11.         /************判断当前界面为菜单界面*******************/
  12.         else if(Menu_Interface == Mark_Sign.Interface_Mark)
  13.         {
  14.             /***************进入任务界面************/
  15.             Mark_Sign.Interface_Mark = Task_Interface;

  17.             /**************进入指定的功能任务*******/
  18.             switch(Mark_Sign.Task_Mark)
  19.             {
  20.             /**************开始运行2.4G任务*******/
  21.             case NRF24L01_Task:
  22.                 Mark_Sign.Run_Task = NRF24L01_Task;
  23.                 break;
  24.             /**************开始运行蓝牙任务*******/
  25.             case Bluetooth_Task:
  26.                 Mark_Sign.Run_Task = Bluetooth_Task;
  27.                 break;
  28.             /**************开始运行WIFI任务*******/
  29.             case WIFI_Task:
  30.                 Mark_Sign.Run_Task = WIFI_Task;
  31.                 break;
  32.             /**************开始运行USB任务*******/
  33.             case USB_Task:
  34.                 Mark_Sign.Run_Task = USB_Task;
  35.                 break;
  36.             /**************开始运行设置任务*******/
  37.             case Set_Task:
  38.                 Mark_Sign.Run_Task = Set_Task;
  39.                 break;
  40.             default:
  41.                 break;
  42.             }
  43.         }
  44.         /************判断当前界面为任务界面******************/
  45.         else if(Task_Interface == Mark_Sign.Interface_Mark)
  46.         {
  47.             /*******判断当前正在运行的任务*******/
  48.             switch(Mark_Sign.Run_Task)
  49.             {
  50.             /*当前正在运行 2.4G任务*/
  51.             case NRF24L01_Task:

  53.                 break;
  54.             /*当前正在运行 2.4G任务*/
  55.             case Bluetooth_Task:

  57.                 break;
  58.             /*当前正在运行 2.4G任务*/
  59.             case WIFI_Task:

  61.                 break;
  62.             /*当前正在运行 2.4G任务*/
  63.             case USB_Task:

  65.                 break;
  66.             /*当前正在运行 2.4G任务*/
  67.             case Set_Task:
  68.             
  69.                 break;
  70.             default:
  71.                 break;
  72.             }
  73.         }
  74.     }
  75. </font></font></font>
复制代码

上面这段代功能

  1. <font color="rgb(79, 79, 79)"><font face="-apple-system, &quot;"><font style="font-size: 16px">/*
  2. * 1,检测当前按下的按键为确认键
  3. * 2,检测当前的界面
  4. *                (1)如果是主界面，则进入菜单界面
  5. *                (2)如果是菜单界面，则进入任务界面
  6. *                (3)如果是任务界面，则开执行被选中的任务
  7. */
  8. </font></font></font>
复制代码

那么可以从主界面进入，那怎么退出呢？
同样这里采用外部中断来控制

  1. <font color="rgb(79, 79, 79)"><font face="-apple-system, &quot;"><font style="font-size: 16px">/****************右摇杆按键****返回按键*************************/
  2.     if(DISABLE == KEY_Rocker_Right)
  3.     {
  4.         //当按下返回键时，判断当前界面
  5.         /************判断当前界面为菜单界面*******************/
  6.         if(Menu_Interface == Mark_Sign.Interface_Mark)
  7.         {
  8.             /*******退出菜单界面***进入主界面**/
  9.             Mark_Sign.Interface_Mark = Main_Interface;
  10.         }
  11.         /************判断当前界面为任务界面******************/
  12.         else if(Task_Interface == Mark_Sign.Interface_Mark)
  13.         {
  14.             /***退出正在运行的任务***/
  15.             Mark_Sign.Run_Task = Stop;
  16.             /*******退出任务界面*****/
  17.             Mark_Sign.Interface_Mark = Menu_Interface;
  18.         }

  20. </font></font></font>
复制代码

上面这段代码的功能

  1. <font color="rgb(79, 79, 79)"><font face="-apple-system, &quot;"><font style="font-size: 16px">/*
  2. * 1,检测当前按下的按键为返回键
  3. * 2,检测当前的界面
  4. *             (1)如果是任务界面，则停止正在运行的任务，返回到菜单界面
  5. *             (2)如果是菜单界面，则返回到主界面
  6. */</font></font></font>
复制代码
1.png

好
通过确认按键控制从主界面到菜单界面到任务界面的切换。
通过返回按键控制从任务界面到菜单界面到主界面的切换。

以上就是菜单界面的内容，不管你是小白还是正在学习STM32的你，根据这套框架你一样可以写出霸气的菜单界面，如果你们还有更好的写法，欢迎一起讨论。





IMG_20181001_141038.jpg

STM32_OLED_三级菜单框架.rar

397.21 KB, 下载次数: 798, 下载积分: 黑币 -5

评分

参与人数 3黑币 +121 收起 理由
6789364 + 6 很给力！
admin + 100 共享资料的黑币奖励！
杨雪飞 + 15 共享资料的黑币奖励！

查看全部评分

回复

使用道具 举报

ID:406408 发表于 2018-10-11 15:58 来自手机 | 显示全部楼层
学习了
回复

使用道具 举报

ID:415785 发表于 2018-11-2 16:03 | 显示全部楼层
学习了，不错！
回复

使用道具 举报

ID:129988 发表于 2018-11-12 00:28 | 显示全部楼层
最近正在学习OLED，感谢楼主的分享
回复

使用道具 举报

ID:29256 发表于 2018-11-12 15:51 | 显示全部楼层
多谢分享
回复

使用道具 举报

ID:220020 发表于 2018-11-23 17:08 | 显示全部楼层
多谢共享
回复

使用道具 举报

ID:157393 发表于 2018-11-24 16:19 | 显示全部楼层

最近正在学习OLED
回复

使用道具 举报

ID:96310 发表于 2018-12-17 16:35 | 显示全部楼层
感谢楼主 分享，学习一下
回复

使用道具 举报

ID:128321 发表于 2018-12-17 17:44 | 显示全部楼层
最近正在学习OLED
回复

使用道具 举报

ID:278145 发表于 2018-12-19 22:47 | 显示全部楼层
不错，值得学习
回复

使用道具 举报

ID:137086 发表于 2019-2-12 21:18 | 显示全部楼层
仔细 学习 一下  最近在学习怎么 写一个 菜单 的程序
回复

使用道具 举报

ID:461296 发表于 2019-2-23 13:52 | 显示全部楼层
学习一下
回复

使用道具 举报

ID:385466 发表于 2019-4-11 16:31 | 显示全部楼层
666，学习一下
回复

使用道具 举报

ID:385466 发表于 2019-4-12 11:57 | 显示全部楼层
怎么判断按下的是哪一个按键，DISABLE跳转到了stm32f10x.h了，有点看不懂，请教一下。
回复

使用道具 举报

ID:516199 发表于 2019-5-23 22:23 | 显示全部楼层
谢谢分享，
回复

使用道具 举报

ID:567848 发表于 2019-6-20 13:44 | 显示全部楼层
刚好需要，学习一下
回复

使用道具 举报

ID:567848 发表于 2019-6-20 13:46 | 显示全部楼层
学习一下，刚好需要
回复

使用道具 举报

ID:499409 发表于 2019-7-2 12:03 | 显示全部楼层
能发一下代码吗1813298696@qqcom
回复

使用道具 举报

ID:55591 发表于 2019-7-12 06:37 | 显示全部楼层
看着非常不错
回复

使用道具 举报

ID:570493 发表于 2019-7-15 16:59 | 显示全部楼层
怎么我用IIC模式没显示，是不是我哪没配置好？
回复

使用道具 举报

ID:521623 发表于 2019-7-19 17:13 | 显示全部楼层
额，那个mini版烧进去程序屏就黑了，咋啥都没有，是不是烧了 啊
回复

使用道具 举报

ID:432611 发表于 2019-7-19 22:04 | 显示全部楼层
great，学习
回复

使用道具 举报

ID:64765 发表于 2019-7-24 13:30 | 显示全部楼层
颇有收获，谢了。
回复

使用道具 举报

ID:586039 发表于 2019-7-28 11:53 | 显示全部楼层
请问是要外接摇杆按键吗，具体要怎么做呢
回复

使用道具 举报

ID:270932 发表于 2019-7-28 15:47 | 显示全部楼层
正好学习OLED，谢谢楼主资料分享
回复

使用道具 举报

ID:600035 发表于 2019-8-14 12:26 来自手机 | 显示全部楼层
学习学习
回复

使用道具 举报

ID:602925 发表于 2019-8-29 12:51 | 显示全部楼层
学习一下
回复

使用道具 举报

ID:302850 发表于 2019-8-30 06:42 来自手机 | 显示全部楼层
先收藏，感觉肯定会有一天能用上！
回复

使用道具 举报

ID:606788 发表于 2019-9-4 18:04 | 显示全部楼层
谢谢分享
回复

使用道具 举报

ID:547459 发表于 2019-9-4 21:12 | 显示全部楼层
学习了
回复

使用道具 举报

ID:610440 发表于 2019-9-11 14:50 | 显示全部楼层
你好,我最近有一个项目,需要用到stm32 oled屏显示菜单界面的框架,但是不理解框架架构关系,方便加我Q沟通探讨下吗?
回复

使用道具 举报

ID:606788 发表于 2019-9-28 20:01 | 显示全部楼层
最近正在学习OLED，感谢楼主的分享&#128076;
回复

使用道具 举报

ID:207341 发表于 2019-10-7 15:38 | 显示全部楼层
我记得下载了
回复

使用道具 举报

ID:58110 发表于 2019-10-8 08:42 | 显示全部楼层
很棒！谢谢分享！
回复

使用道具 举报

ID:607710 发表于 2019-10-9 11:09 | 显示全部楼层
这就是算法吗？希望多一些这样的教程
回复

使用道具 举报

ID:606788 发表于 2019-10-10 20:50 | 显示全部楼层
厉害了  学习下怎么写的
回复

使用道具 举报

ID:581602 发表于 2019-12-14 22:50 | 显示全部楼层
学习一下，感谢楼主分享。
回复

使用道具 举报

ID:269639 发表于 2019-12-15 22:01 | 显示全部楼层
真的非常好啊，感谢楼主
回复

使用道具 举报

ID:544005 发表于 2020-1-13 10:52 | 显示全部楼层
学习了谢谢!!!
回复

使用道具 举报

ID:408363 发表于 2020-2-6 20:44 | 显示全部楼层
请问2.8寸彩屏能使用吗
回复

使用道具 举报

下一页 »
12下一页
返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|51黑电子论坛 |51黑电子论坛6群 QQ 管理员QQ:125739409;技术交流QQ群281945664

Powered by 单片机教程网

快速回复 返回顶部 返回列表