【典藏】自制小型GUI界面框架(设计思想篇)
1、来聊聊(轻松一刻)
这里为大家挑选了一首经典的《逍遥叹》，逍遥自在的生活是每个人追求的目标，即使目前未能达到也可以感受下！好了，进来看文章的小伙伴应该都发现上面的一点点小变化，是的，作者对一些图片进行优化升级，也希望公众号也能和大家一同进步。
今天给大家带来的内容是:小型GUI界面程序设计框架，这也是应多位粉丝的需求和建议所以作者根据自身经验为大家带来这方面的设计思想和理念。本篇文章主要为大家讲解设计思想，让大家形成一个整体的设计布局，后续GUI文章也会带来相关算法和程序设计。
2、了解小型GUI设计的必要性
了解GUI的小伙伴应该都知道目前有非常多的GUI界面库，小型的有ucGUi，ST_enWin以及一些开源界面库，大型有在嵌入式操作系统上的minGUI、Qt等等，大家可以通过移植相应的代码方便的应用到自己的系统中来，同时这些GUI都有着非常丰富的说明文档和资料，大家只需要通过了解对应的API接口便可以做出非常漂亮的界面来。
既然GUI库都做得那么方便了那为何作者还要在这里讲解这块的内容呢？我们都知道这些比较成熟的GUI界面库一般都是用于TFT彩色屏等，他们对于内存资源、处理器的运行速度等等都有着不小的要求，并且更重要的是对于部分GUI还需要授权收费等等，确实比较麻烦。而对于很多小伙伴都只是用于一些界面调试比如智能车上用OLED或者12864查看或者配置一些参数，显示飞控的一些状态等等，并不需要一些复杂的界面处理，简单的切换界面，显示数据等等功能即可，如果这种情况用上那些大型的GUI感觉有点累赘，而且对于一些性能不太好的单片机也不太合适。
出于上述原因小伙伴都会去自己写一些简单的界面来进行使用，不过我们在做这种界面的时候可能精力有限基本都不会考虑太多，界面的扩展性，移植性，通用性等等都没有进行太多的考虑，导致后续类似的开发又会花费许多精力，所以作者这里通过本篇文章为大家讲解这种小型GUI的一种设计的框架供大家学习，大家在以后的学习中都能够带着这种思路去编写、改造或者是裁剪自己的GUI。
3、GUI设计前期准备
对于之前移植过多款GUI界面的小伙伴们都会有这样的感受，GUI移植好像要那么几个主要的部分:确定屏幕的规格，提供画点、读点函数以及提高GUI效率的一些处理(而且通常这些处理也是可选的)，那么其实对于我们的GUI设计的基础准备也是这几个部分。
我们的GUI绘制说得更加通俗一点就相当于一个人在进行绘画，从控制理论的角度我们可以类比下，真实的画画相当于一种连续的模型，而显示屏幕的绘制相当于一种离散的模型，那么很多的算法通过离散化就可以获得了。(听不太懂的小伙伴没关系，后续算法文章会跟大家讲解)
4、GUI界面设计思想
上面我们对GUI设计已经进行了前期的准备，其中重要的是初始化对应的硬件显示并且封装画点、读点等函数接口，这样我们底层LCD的驱动就准备好了，现在我们需要由最简单的画点函数来封装更加上层的图形函数，如通过点-->线-->二维图形等等(比如矩形、bmp等)。
其实我们很多小伙伴都会认为那些GUI库是非常厉害的，却忘了其实windows这样的图形应用程序才是GUI的大佬。所以我们平时在研究桌面应用开发的时候很多的图形设计思想都是可以应用到我们的嵌入式GUI设计中的。那些写过桌面应用程序的小伙伴应该知道控件的概念，控件简单一点说就是一种封装好的小型窗口，我们的基础绘制图形的组合就可以构造我们的控件，从而实现面向对象的一种设计方法，这里为了方便大家理解，我还是以图形的方式展示给大家一个小型GUI界面结构图。
这里作者再举个具体的例子说明一下这个结构图，方便各位理解，现在我们想在界面上显示一个菜单选择控件，下面的图应该是大部分自制GUI常用的一个菜单图，可以看到窗口界面上其实基本元素不多，仅包括:矩形框，中文字体、最多右侧有一个进度条，而对于中文字体可以通过字模软件生成像bmp图片数据然后进行显示即可，进度条也是由矩形框构成的。
所以说对于GUI没有特殊要求的小伙伴，要实现自己风格的GUI并不是什么特别困难的事情，主要是对于一些逻辑可能需要理一理。
5、GUI动态交互设计
上面我们说了一下GUI的设计，那么GUI界面其主要的功能不仅仅只是显示功能，更多的是进行人机交互，比如说我们想通过按键控制窗口或者菜单的变化，或者输入一些简单的数据显示等等。那么GUI就需要有处理事务能力，我们还是可以从windows桌面程序里面借鉴过来一些思想，大部分学习过win32桌面编程的小伙伴在最开始进行学习的时候都会学习到窗口的实现机制。没有学习过的小伙伴也不用慌，我这里简单画个图供大家参考:
其实我们可以完全按照上面这个思路来进行设计我们的GUI，不过毕竟我们想做的仅仅只是一个小型的GUI界面，所有我们可以对其进行简化来更快的满足我们的应用，下面展示一下我经常用到的一种简单的GUI设计框架。
分析一下:
1)界面管理器起到承上启下的作用，界面管理器使用一个结构体来封装我们的LCD接口函数指针，我们的窗口的绘制和更新都会使用到这些接口(对于接口的概念如果不是很清楚可以看往期文章《嵌入式动态接口编程》)；
2)界面管理器包括我们每个窗口数据指针，可以根据外界消息接口通过消息处理打包由界面管理器把消息传递给各个窗口；注意上面的消息处理并不是直接处理界面更新，而是为了处理成统一的消息类型然后转发给上层使用，这样做的原因是当我们如果有多个外界交互设备同时存在切换界面的信号，那么我们在消息处理里面统一打包成同一个信号发送给上层，然后每个窗口接受到对应的消息以后便可以进行处理。
3)在窗口进行切换的过程中为了实现退回机制，我们需要保存相应的数据，在进行界面切换之前我们需要进行保存当前窗口的状态，然后从界面管理器中提取将要显示界面的历史信息并完成新界面的显示。
6、最后小结
好了，上面我就为大家总结了我平时写一些简单的GUI界面的一些简单思想，这些思想主要是为了让大家形成一个较好的设计思路，用方法来指导设计和编码是非常高效的。对于初学者作者建议不要一打开电脑就开始狂敲代码，作者在之前的文章中提到过一定要用思想来指导编码，不然很多时候都会出现删除的代码比写的代码还多，编码效率大大下降，弄不好还会使得情绪烦躁，制造更多的bug，所以说老程序是很“佛系”的。
一个复杂的GUI框架的编写是非常锻炼一个人的，涉及到的知识也特别的多，比如计算机图形学，数据处理、视觉效应等等，后续作者会为大家抽取一些实用的知识来进行讲解，大家如果特别感兴趣可以研究一下目前比较热门的GUI界面源码来进行学习。
这里是公众号：“最后一个bug”，感谢各位的关注，这里将是帮你找到最后一个bug的技术研究基地。下期精彩见！(下方作者微信，如需沟通交流直接添加即可)