Arduino提高篇15—摇杆操作OLED多级菜单

摇杆操作OLED多级菜单

随着越来越多的人机交互需求，带有屏幕的嵌入式设备需要展示的信息也越来越多，多种菜单随着按键输入进行各种深入、各种切换操作。如何方便的管理不同菜单之间的切换操作呢？本篇通过实验来介绍多级菜单的实现思路。

1. 多级菜单介绍

在各种屏幕操作中，多级菜单其实是一种思路或者说是一种固定的编程框架。简单来说就是当按键触发时，根据按键定义从数组中取出当前按键需要跳转的界面索引，然后根据索引去执行响应的界面函数。

2. 具体实现

1. 首先，我们要定义一个结构体，结构体成员变量一般包括界面索引号、界面函数指针和与实际按键对应的变量，用来存储按键表示的索引号。其中，索引号与界面函数指针是对应的。

typedef struct
{
  unsigned char index;
  unsigned char up;
  unsigned char down;
  unsigned char left;
  unsigned char right;
  void (*operation)(void);
} KEY_TABLE;

本实验中定义了四个按键，故定义了up、down、left、right四个按键变量。

2. 使用定义的结构体类型来定义一个结构体数组，有多少个界面，数组的元素个数就是多少。

KEY_TABLE table[9] =
{
  {0, 0, 0, 0, 0, (*menu11)},
  {1, 0, 0, 0, 0, (*menu12)},
  {2, 0, 0, 0, 0, (*menu21)},
  {3, 0, 0, 0, 0, (*menu22)},
  {4, 0, 0, 0, 0, (*menu23)},
  {5, 0, 0, 0, 0, (*menu31)},
  {6, 0, 0, 0, 0, (*menu32)},
  {7, 0, 0, 0, 0, (*menu33)},
  {8, 0, 0, 0, 0, (*menu34)},
};

本实验中定义了9个界面，所以如上数组元素有9个，其中界面索引号从0到8，分别对应其界面函数指针。本实验中一级菜单有2个，二级菜单有3个，三级菜单有4个。

3. 确定各按键按下需要跳转的界面索引。这一步骤确定了各界面之间的切换关系，非常重要。在此之前可以通过草图来整理菜单之间切换关系，如下所示为本实验9个界面之间的关联图。

多级菜单结构

举几个例子：

在index为0，即menu11界面下,确定{0, 0, 0, 0, 0, (*menu11)}中四个按键变量的值：

• 当按下up键时，显示menu11界面，即index为0的界面，那么此时up=0；
• 当按下down键时，显示menu12界面，即index为1的界面，那么此时down=1；
• 当按下left键时，显示menu11界面，即index为0的界面，那么此时down=0；
• 当按下right键时，显示menu21界面，即index为2的界面，那么此时down=2；

故得到{0, 0, 1, 0, 2, (*menu11)}

在index为5，即menu31界面下,确定{5, 0, 0, 0, 0, (*menu31)}中四个按键变量的值：

• 当按下up键时，显示menu31界面，即index为5的界面，那么此时up=5；
• 当按下down键时，显示menu32界面，即index为6的界面，那么此时down=6；
• 当按下left键时，显示menu21界面，即index为2的界面，那么此时down=2；
• 当按下right键时，显示menu31界面，即index为5的界面，那么此时down=5；

故得到{5, 5, 6, 2, 5, (*menu31)}

各个界面之间的跳转关系根据实际的需求进行确立，如下为本实验中完整的结构体数组变量赋值情况。

KEY_TABLE table[9] =
{
  {0, 0, 1, 0, 2, (*menu11)},
  {1, 0, 1, 1, 4, (*menu12)},
  {2, 2, 3, 0, 5, (*menu21)},
  {3, 2, 3, 0, 7, (*menu22)},
  {4, 4, 4, 1, 4, (*menu23)},
  {5, 5, 6, 2, 5, (*menu31)},
  {6, 5, 6, 2, 6, (*menu32)},
  {7, 7, 8, 3, 7, (*menu33)},
  {8, 7, 8, 3, 8, (*menu34)},
};

4. 根据实际按键返回值对应的功能，获取按键对应的界面索引号，然后根据索引号找到并执行对应的界面函数。

switch (keyValue)//获取按键对应序号
    {
      case 1: funIndex = table[funIndex].right; break;
      case 2: funIndex = table[funIndex].left; break;
      case 3: funIndex = table[funIndex].down; break;
      case 4: funIndex = table[funIndex].up; break;
    }
current = table[funIndex].operation;//根据需要获取对应需要执行的函数
(*current)();//执行获取到的函数

3. 实验材料

• Uno R3开发板
• 配套USB数据线
• 面包板及配套连接线
• 双轴按键摇杆模块
• OLED显示屏

4. 实验步骤

1. 根据原理图搭建电路图。

OLED屏的VCC、GND分别连接开发板的3.3V、GND，OLED屏的SDA和SCL分别连接开发板的A4和A5。双轴按键摇杆模块的VCC、GND分别连接开发板的5V、GND，模块的X轴输出、Y轴输出分别连接开发板的模拟引脚A0、A1。

实验原理图如下图所示：

实验原理图

实物连接图如下图所示：

实物连接图

2. 新建sketch，拷贝代码替换自动生成的代码并进行保存。

由于代码较长，完整代码可在文末获取。

3. 连接开发板，设置好对应端口号和开发板类型，进行程序下载。

程序下载

5. 实验现象

多界面切换效果：

实验现象

---

关注公众号「TonyCode」，后台回复“提高”，获取文中代码。

image