STM32使用KEIL pack包快速移植LVGL GUI框架并实战指南

先展示最终实现的功能效果如下：

1.目的与意义

之前在学习STM32移植LVGL图形库的时候，搜到的很多教程都是在官网下载LVGL的文件包，然后一个个文件包含进去，还要添加路径，还要给文件改名字，最后才能修改程序实现效果，十分繁琐，编译时还容易报错缺少各种文件，而采用KEIL的pack包直接进行移植，则可以直接跳过这些繁琐的环节，直接对文件程序进行修改。

2.LVGL pack包的获取及移植到KEIL-STM32工程上

LVGL pack包下载网址：
https://www.keil.arm.com/packs/?q=LVGL&pack-search=

下载之后通过keil的pack installer>file>import导入pack包即可，然后通过keil的Manage Run-Time Environment即可看到LVGL已经可以供我们移植了：

然后我们只是为了满足基础的使用（显示屏的显示，触摸屏的输入），所以只需要选择Essential(核心模块)和Porting（移植）即可。

其中最关键的就是2个c文件，3个h文件,我们只需要对这5个文件进行修改即可。

lv_conf_cmsis.h相当于LVGL提供给用户设置各种参数及使能各种功能的界面；
lv_port_disp_template为显示屏的移植部分，
lv_port_indev_template为输入设备的移植部分，其中包含鼠标、键盘、触屏等，
lv_port_fs_template为移植文件系统提供支持，里面提供了WIN、FATFS等文件系统。

首先我们打开lv_conf_cmsis.h文件进行修改：

LV_COLOR_DEPTH根据你屏幕显示的颜色格式进行匹配，RGB565则设为16，RGB888则设为32；
LV_COLOR_16_SWAP根据TFTLCD跟MCU的通讯方式进行设置，我采用的是FSMC 16位数据，所以置0，若使用SPI 8位数据进行通讯则置1。

这里可以看到LV_MEM_CUSTOM置0时由LVGL帮助申请堆(heap)内存作为LVGL的可执行内存，这里建议大于12Kb。

这里分别是调整显示刷新频率和输入设备检测频率，调小可以加快屏幕刷新速度和触摸屏的灵敏度，但是不宜过大，这里可以调整为5ms左右。

至此lv_conf_cmsis.h文件就修改完成了。

接下来修改lv_port_disp_template.h和.c文件对接显示屏驱动：

这样lv_port_disp_template.h文件就修改完成；

这样lv_port_disp_template.c文件就修改完成。

这里将我的画矩形图程序也提供给你们作参考：

void Lcd_SetRegion(uint16_t x_start,uint16_t y_start,uint16_t x_end,uint16_t y_end)

{

LCD_WRITE_REG=CMD_SetCoordinateX; 

LCD_WRITE_DATA=(x_start>>8); 

LCD_WRITE_DATA=(x_start&0XFF);     

LCD_WRITE_DATA=(x_end>>8); 

LCD_WRITE_DATA=(x_end&0XFF);    

LCD_WRITE_REG=CMD_SetCoordinateY; 

LCD_WRITE_DATA=(y_start>>8); 

LCD_WRITE_DATA=(y_start&0XFF);

LCD_WRITE_DATA=(y_end>>8); 

LCD_WRITE_DATA=(y_end&0XFF);

}

void LCD_Draw_Picture(uint16_t sx,uint16_t sy,uint16_t ex,uint16_t ey,uint16_t *color)

{  

    uint16_t height,width;

    uint16_t i,j;

    width=ex-sx+1;                 //得到图片的宽度

    height=ey-sy+1;                //得到图片的高度

    Lcd_SetRegion(sx,sy,ex,ey);

    ILI9341_Write_Cmd ( CMD_SetPixel );     //开始写入GRAM,ili9341对应的命令值是0x2C

     for(i=0;i    {

        for(j=0;j        {          

            LCD_WRITE_DATA=*color;//写入颜色值

            color++;

        }

    }      

} 

接下来修改lv_port_indev_template.h和.c文件对接触摸屏驱动：

这样lv_port_indev_template.h文件就修改完成；

GT911触摸屏初始化我也放在main函数初始化那里执行了。

这里我也直接给出我对应的程序函数供参考（触摸屏我选用的是GT911驱动IC，通过STM32的硬件IIC进行通讯）：

uint8_t Is_TP_Pressed(void)

{

  if(flag_touch == 1)

  {

    flag_touch = 0;

    return 1;

  }

  return flag_touch;

}

uint16_t getTP_X_Info()

{

static uint16_t tx;

  uint8_t clear_buf = 0;        //用于清除寄存器

  uint8_t xy_temp[40];          //用于接受坐标

  //读取触摸的坐标

  HAL_I2C_Mem_Read(&hi2c2, GT911_ADDR, GT911_STATUS_ADD, 2, xy_temp, 40, 0xFFF);

  //通知GT911已读取完坐标，清除寄存器

  HAL_I2C_Mem_Write(&hi2c2, GT911_ADDR, GT911_STATUS_ADD, 2, &clear_buf, 1, 0xFF);

  //输出第一个触摸点的坐标

  tx = ((uint16_t)xy_temp[3] << 8) + xy_temp[2];

return tx;

}

uint16_t getTP_Y_Info()

{

static uint16_t ty;

  uint8_t clear_buf = 0;        //用于清除寄存器

  uint8_t xy_temp[40];          //用于接受坐标

  //读取触摸的坐标

  HAL_I2C_Mem_Read(&hi2c2, GT911_ADDR, GT911_STATUS_ADD, 2, xy_temp, 40, 0xFFF);

  //通知GT911已读取完坐标，清除寄存器

  HAL_I2C_Mem_Write(&hi2c2, GT911_ADDR, GT911_STATUS_ADD, 2, &clear_buf, 1, 0xFF);

  //输出第一个触摸点的坐标

  ty = ((uint16_t)xy_temp[5] << 8) + xy_temp[4];

return ty;

}

void ILI9341_DrawPointPixel ( uint16_t usX, uint16_t usY, uint16_t color )//画点函数

{

if ( ( usX < LCD_X_LENGTH ) && ( usY < LCD_Y_LENGTH ) )

  {

ILI9341_SetCursor ( usX, usY );

ILI9341_FillColor ( 1, color );

}

}

至此lv_port_indev_template.c文件就修改完成。

接下来在main.c文件里面添加对应头文件，然后对显示和触摸进行初始化，对LVGL进行初始化及开启LVGL的心跳包和任务管理函数：

成功之后就可以进行程序编译了，编译完成后烧录进硬件，对屏幕进行触摸应该可以看到在触摸处会留下一个个蓝色的点，这是因为我们在lv_port_indev_template.c文件的触摸点坐标获取函数里面加入了画点函数，这样便可以验证到显示和触摸已经成功跟lvgl图形库完成对接，接下来就可以畅玩LVGL了，记得验证完LVGL成功对接之后把触摸点坐标获取函数里面的画点函数删掉，否则后面一触摸就会执行画点了。

3.使用NXP的GUI Guider实现显示及触摸响应功能

选择一个空白模板：

由于我是要打竖显示，而默认320*240是打横显示，所以我进行了自定义宽度240和高度320：

首先先给背景上个底色，白色太单调了：

接着在左边的组件里面随便选择个控件进行测试，我选择了仪表盘：

接着再放一个按钮组件，并创建按钮事件，这里我们实现按钮被按下时变大且颜色变为红色，按钮松开后恢复为原来颜色：




然后信息栏就会开始显示生成的过程及结果，若没有问题就会自动跳出仿真界面，同时C代码也会生成在对应的地址。

第一次使用的时候如果信息栏报了一行乱码的错误，那大概率是因为电脑缺失java语言环境，该软件仿真需要java环境的支持，可以通过键盘按下 win+R，然后在运行窗口输入cmd进入下面该界面，然后输出java,如果电脑具有java环境，会输出java的信息，如下图，否则会输出不是内部或外部命令。。。。。。

接下来就去生成工程的地址下，拷贝custom和generated两个文件夹到你的STM32工程文件夹内：

然后在KEIL工程里面新建一个GUI文件组，将对应的C文件添加进去，然后再把custom和generated及其下属文件夹的路径进行添加：

最后在main.c文件里面添加头文件与执行函数即可：

之后就可以编译然后进行烧录到硬件进行验证了，若编译的时候报错缺少了各种lv_font、lv_meter等文件，直接去生成GUI guider工程的路径下进行查找然后复制到STM32工程所包含的路径下即可：

最后硬件跑起来的结果就如仿真的一致，也就是跟开头展示的功能效果差不多。

4.结语

通过LVGL来建立图形交互界面确实很方便，而且LVGL里面也自带了各种图片格式、包括GIF格式的解码库，还可以对接Win、FATFS等各种文件系统，在使用SD卡或Nor flash的内部图片进行读取显示时就显得更加轻松，希望这篇文章也能让各位学到一点关于LVGL的应用方法。