基于低成本 STM32 的图形应用

[复制链接]

STMCU小助手发布时间：2023-6-19 14:07

技术帖
文章封面:
文章简介:	越来越多的智能设备会基于 STM32 实现图形界面，而 TouchGFX 是专门用于 STM32 的图形界面设计软件，使图形界面能达到类似智能手机的显示效果。

前言
越来越多的智能设备会基于 STM32 实现图形界面，而 TouchGFX 是专门用于 STM32 的图形界面设计软件，使图形界面能达到类似智能手机的显示效果。通常，在支持 FMC、LTDC、MIPI-DSI 等 LCD 接口的 STM32，都有着比较丰富的内存资源，SRAM 存放帧缓冲也毫无压力。但在一些成本敏感的产品上，STM32 内存较小，不足以存放完整的帧缓冲，这类产品又如何使用 TouchGFX 来做图形界面应用呢？本文将介绍 TouchGFX 的部分帧缓冲特性，以及基于STM32G0 系列的移植过程。
部分帧缓冲
通常在做图形应用时，需要在 MCU 的 SRAM 里申请一块内存作为帧缓冲：framebuffer。比如使用一个分辨率为240x320，16 位色深的 LCD，需要申请的内存大小为：240x320x2 = 153600 Bytes。而很多低成本的 MCU 内存较小，根本无法满足图形应用对内存的需求。不过，TouchGFX 现在支持部分帧缓冲，仅使用较小的内存作为帧缓冲即可支持图形应用。

Partial Framebuffer，部分帧缓冲
对内置了 GRAM 的 LCD 来说，图形显示的过程可以概括如下图：

V7O8[W}A{S)]Z)6@RGOWN@O.png

1， MCU 将图形界面画到内部 Framebuffer
2，画图过程结束后，将 Framebuffer 内容传输到 LCD GRAM
3，由 LCD controller 将 GRAM 内容显示到屏幕

如果使用完整的 framebuffer，在上面第 2 步进行传输时，每次传输的都是一整屏的数据。而在很多场景中，LCD 屏幕上变化的区域并不大。比如一个控制界面，可能只有一个小图标会有变化，其它区域都保持不变。我们可以只更新屏幕变化的区域。
部分帧缓冲与此类似，framebuffer 可以被分成许多个小的缓存块去更新和传输，而这些小块的缓存可以被重用，这样可以极大的减小图形应用对内存的需求。而使用 partial framebuffer 的方式，仅有稍许限制：
1， LCD 模块必需要内置 GRAM
2，在复杂界面时可能会有撕裂效果

部分帧缓冲在 STM32G071 上的应用
目标板上的 STM32G071 内置 128K flash，36K SRAM，外接 SPI 接口的 LCD，分辨率 240x320 像素，16 位色。按此 LCD 的分辨率，要支持 TouchGFX 图形应用，必须使用部分帧缓冲特性。

配置过程
整个配置过程主要包括以下四个方面：
一、在 CubeMX 中，配置 TouchGFX generator 的 display 属性如下图：
9U48ZJRGV[})~8Q`{OQ`]T6.png

缓冲块个数和缓冲块大小都可以根据需要调整

NL]D)L~F}{20Q92U94Z6N75.png

二、配置完成后，先由 CubeMX 生成代码。可以看到，会生成 TouchGFX 目录，以及该目录下的配置文件与部分源码文件。

%BMHLSDS5WF{)UK~8HRI2HG.png

三、打开 ApplicationTemplate.touchgfx.part 文件，即可打开 TouchGFX Designer 工具，如下图。比如，可以添加box 控件作为背景，textArea 控件来显示文本。

}U]B28(CY}(B5X4RSSR(P93.png

然后通过 Generate Code 生成 UI 相关的代码，主要包含 generated 和 gui 两个目录。generated 目录包含生成的资源文件，如字体信息、文本信息、图片资源等，还包括各个 screen 的基类代码。而 gui 目录则包含 screen 的派生类代码。用户可基于 gui 目录进行 UI 后续的开发。

@J}]NR~L`KZ)`VIZ584VG(7.png