经验——GUI GUider基础使用

     先说一下GUI Guider的特点，界面简洁美观，有中文且上手门槛低，标准的现代风且免费。但是它只支持有限的屏幕设备，比如480*320、800*720的，多以横屏为主，只有720*1280这一种竖屏。

        举个实例，我现在有一块480*800的竖屏，而GUI Guider只有800*720这种横屏。于是现在只剩下两种可能，要么放弃GUI Guider，要么坚持横屏开发。

        对于第一种选择，现在lvgl主流就两款，另一款还比较麻烦，官网下载经常失败，个人版虽免费但限制大，上手门槛较高，总之还需要时间进化。如果两款都放弃的话，又得回到手搓时代，得花费大量精力，不好。

        对于第二种选择，可以以横屏状态，配置竖屏的效果，比如图片，旋转-90度就可以达到竖屏效果。但是最新支持的8.3.1也不是所有控件都可以旋转，比如说最简单的文本框，虽然后续新版可能会做到，但是歪着脖子开发，不好。

        于是，你也会想到第三种选择——折中。即选择一个合适的屏幕，在上面完成大致的界面布局，生成代码后在工程里细调。如果后续需要添加新的控件，也可随时新建一个GUI Guider工程，初始化控件后，把它生成的setup_scr_screen.c、gui_guider.h中的相应代码复制到你的文件中（暂时没有考虑事件）。

一、创建工程

1，创建

        这个是真的容易上手，也有很多教程。这里就提一下注意事项，无论是工程名字、工程目录，还是资源文件（如图片）的名称都不要使用中文。资源文件的目录虽然可以使用中文，但建议还是不要用，养成习惯

2，移植

        应该有很多初学者跟我一样，了解到有GUI这个东西后，先听的正点原子课，再接触到GUI GUider，这时要注意LVGL的版本。

        我这里GUI Guider使用的是8.3.1。但是当初用于学习的LVGL是8.2，所以后来又移植了8.3.1版本的库（移植教程非常多且详细），可以删除了一些不必要的内容，比如demos，因为GUI Guider里就有一堆模板

generated：生成代码，主要包括屏幕的初始化、事件的初始化等。必须包含

events_init.h/c    初始化事件的，可以在里面给控件添加事件，然后编写事件回调函数

gui_guider.h/c    顾名思义，这个是GUI Guider生成的特定文件，就比如STM32CubeMX生成的初始化函数有            
                  MX_前缀一样。这里面放着大量与渲染相关的东西，但需要重点要关注的只有lv_gui这                
                  个结构体

setup_scr_screen.c    “setup_scr_”是个前缀，意为加载资源，后面的“screen”是界面的名称，GUI         
                      Guider默认的界面就叫screen，如果你再创建一个界面，名称就叫做screen1，生成         
                      的c文件就是“setup_scr_screen1.c ”

负责各种控件资源的初始化，比如按钮、图片等，只要初始化就可以显示这些控件的画面了

widgets_init.h/c    暂时先别管它吧，目前我没有用到过它，没有深究里面的那两个事件回调函数发挥着怎    
                    样的作用。等有机会里再研究

custom：要自定义文件，主要包含事件函数实现的子程序。理论上包含，实际上可以不包含，除非你在GUI Guider上开发代码

simulator：GUI Guider仿真用的文件夹。一般用于初学时对照，不用包含，熟练使用GUI Guider后来就不需要关注这个了。如果你的配置出现里问题，那么可以把自己的lv_conf.h与lvgl-simulator下的lv_conf.h对照一下，看看哪些需要改。出问题时，可以使用VS Code的比较代码的插件。

    如果你使用它生成的lv_conf.h的话（就是simulator下的lv_conf.h），那么要小心内存有没有超，合理设置这个分配内存大小，一般二三十就可以了，120显然太大。如果不是的话，那么就不需要关心这个

二、修改_防止超内存

        如果你的lv_conf.h配置的是合理的话，那么需要注意下面这几个事项

1，字体

        字体是大户，动不动就几百KB，这个需要格外注意。首先尽量选用字体大小一样的，防止调用多个字体文件。其次，最好使用自定义生成的字库C文件，而非GUI Guider自带的字库C文件

①生成自定义字体

先导入字体，再选择字号和要生成的文字。要注意，导入的字体中不是所有的字体都包含中文。

②修改字库C文件内容

        点击确定后就可以在工程文件里找到生成的字库C文件了，路径为

“你的工程\generated\guider_customer_fonts”

        把生成的代码复制到你的工程里，不要直接在这改，否则你的GUI Guider运行仿真时会卡住

        然后把你生成的字库C文件名中的_customer去掉，并把文件里面所有_customer的都去掉（用替换）

        最后替换掉“你的工程\generated\guider_fonts”目录下的相应字库C文件

        之所以采用替换的方案，而不是在guider.h里面改，是因为实际项目中会经常改UI，而字体的变动相较没有那么频繁。这时就可以放心地把generated下除了自字体的相应文件全部替换掉原工程里的文件。

【setup_scr_screen】：设置屏幕界面的。一般无需亲手改动，直接复制GUI Guider生成的代码

【gui_guider】：主要是加载字体、图片等资源的。看情况修改

【widgets_init】：跟lvgl的定时器事件密切相关，实际项目中不怎么引人注视

【events_init】：设置一系列事件及其触发方式。实现界面功能的重点所在

        上面这些文件里的代码不需要会默写，但至少也要看懂里面代码是干什么的，发挥CV员特长。多尝试修改，不怕出错，再多查查资料文档，渐渐地就能熟练使用

2，图片

        如果你想用背景图片时，我的建议是不要直接把屏幕的图片选项（screen的背景）附上你的图片。哪怕你的图片原尺寸很小，它也会给你放大到整个屏幕那么大，结果呢又糊又大，内存会直接爆了。

        建议是，采用若干小图片，同时修改屏幕的背景颜色，从而共同构成屏幕背景

        下面稍微提一下这个渐变颜色的使用。点击颜色后会弹出这么一个框，点击渐变旁的那个图标就可以进入渐变模式（注意版本）

        进入这个渐变模式，需要注意的是，在这里修改【颜色】，修改的只是【渐变颜色】中的第一个，而要修改另一个则需退出这个框

然后点击下面这个多出来的【颜色】

        只不过后来的版本变了，只要开启了渐变后就只能修改第二个，需要切回普通模式才可以修改第一个，所以只得来回切换才可更改渐变的两个色彩。

三、转为C++工程

        无外乎是把一些c文件改为cpp文件，或是新增一些cpp文件。这个实用性不大，建议跳过

1，预警

 【C与C++混合调用】

        创建新的cpp文件时，最好是在cpp文件里调用c文件的东西，这样比较方便，因为C++兼容C。反之就比较麻烦，不过网上还是有教程的。

        需要说明的是，c文件里可以直接包含C++头文件，并调用里面的一些宏定义、变量之类的，前提是你不能调用C++的函数或属于C++特性的一些东西。

【C文件直接转Cpp文件】

        首先要注意C的类型检查是没有C++那么严格的，也就是说一些原本在C环境下能通过的代码，在C++环境下就不行，需要修改。

2，转为cpp文件

把下面这些文件改为cpp后缀

在对应头文件中把extern “C”注释掉

3，具体问题

①类型转换

最常见的是void*转换问题，这是由于C++对类型检查很严格。加上static_cast</*类型*/>即可

// a是void*类型

/*原表达*/
 lv_obj_t *obj =a;

/*修改后*/
 lv_obj_t *obj =static_cast<lv_obj_t*> (a);

②NULL与nullptr

        简而言之，NULL只是个宏定义（值为0），nullptr才是真正的空指针。所以使用C++时，如果是让指针指向空指针时，最好不要用NULL。

4，架构参考

        下面架构分层仅用于参考，根据自己需要即可。需要说明的是，层次分明易于维护和移植，比如当参加比赛时方便随时调用自己的代码库，而不必到某个文件里查找所需代码并修改。但这样做显然会增大代码量并降低一部分性能，不过总归是利大于弊。

库：用于存放官方库、第三方库

驱动层：用于存放外设初始化、LCD驱动之类的，比如SPI_Flash、ADC采样等，这些都与设备有关，将来移植时，只需要改变这里的代码就行了，功能层与应用层无需更改

功能层：用于存放如工具类（自己创的类文件）、功能逻辑实现和GUI等，如录音、放音的逻辑编写

应用层：主要实现用户界面逻辑，适合存放main、RTOS的任务实现