客户在使用 TouchGFX开发 GUI应用的时候, 需要很多的图片资源来呈现友好的人机交互功能, 因此外扩了一个 FLASH来存储图片资源. 在软件研发后期发现现有的 FLASH存储空间不够, 因此提出是否可以使用 TouchGFX来减少图片资源的存储空间且实现同样的 UI效果.

01调研

8 B& R" G3 l8 Y# U3 r. J
* b7 L2 E( Z9 |" p# 在硬件方面
7 Q! g2 i+ ?: V* I# uMCU 的图像处理加速器DMA2D 中的调色板的颜色格式 , 支持 L8 格式的图层之间的渲染：

4 ~; Q" D  }- f; h$ U# 从软件方面
' K. O# l6 V/ D! N; z最新的 TouchGFX4.12.3 开始, 可以利用了 DMA2D 的调色板功能对图片的资源进行优化 .

+ T1 s  X) H/ Q' P) }) l# 比如下图(宽 x 高=200x200)
- \& S4 i7 |& U

1 n; l' o, L; \+ r  d# o. h' T+ w7 k1. 这幅图是由 256 种颜色组成的.
" m. u* u# e' A4 n: G* R2. 且每种颜色都针对图像进行了优化.
3. 256 种索引颜色中的每一种都是 24 位颜色.
5 z- Y: N2 C5 r8 A$ [& s

为了在 LCD 上显示这张图, TouchGFX Designer 在生成资源文件时,生成的资源文件大小:
  H/ w9 C4 m' U1 ~. s. V

1. L8_ARGB8888 :
+ }1 w, i  [6 Y7 {0 L200x200x1byte+256x4byte=41024bytes
=>200x200 个 8bit 的颜色索引+256 个 32bit

" q4 i, {6 o/ E2. ARGB8888 :
200x200x4byte=160000bytes.
2 S" {+ x& `( P5 V7 `3 \$ {=>200x200 个 32bit 的颜色

9 B+ L9 B) Z% c+ _( N) H# t: j) W
/ o; c% O" W; `9 y: R# q, G! `在 TouchGFX 中使用 L8 Image ，只需要将 L8 的图片拖入到 TouchGFX Designer 中，然后在Image 页面中选择正确的格式 :

注意: 如果图片超过 256 颜色，转换工具就会报错，因此可以使用图片工具(如


paint.net/imagemagick)将颜色数减少至少于 256 色 :
( q3 j7 K' I" U$ `
* `+ S# C* o3 J5 j# K: j- N+ `. {4 W
Paint.net:

Image Magick (www.imagemagick.org):

7 ^+ e+ c& h; {1 U# r' m: E7 c
% z+ v4 |( }  ^02结论
  u) r, `* D5 s9 u

图像使用 L8 格式时占用的 flash 大小显著低于标准 24 位格式(RGB888)的原始图像。下表列出了这三种不同调色板格式的具体图像的 flash 使用情况（图片分辨率 200x200）：

由于 TouchGFX 对于 L8 格式还可以支持 L8_ARGB8888，因此可以与 ARGB8888 等格式的图像进行混合渲染，因此特别适合作为图标等颜色数少但是素材丰富的应用.

  _- y/ J1 D2 ]- @2 G$ e7 w综上可以看出，采用 TouchGFX4.12.3+L8 格式 :
( L+ G7 h# v2 J$ H/ A) G

+ o2 m4 b" i; c; F$ \3 _1. 相比较 ARGB8888 像素格式, L8 大幅降低了资源文件的大小, 从而降低对存储芯片的需求 .
2. 同时由于图片像素信息大幅减少，读写一张图片的速度也大大提高, 也提高了系统实时性能.
0 a" d& b1 L0 J6 S* [9 H# E7 D

4 ~: o% F0 p0 V03处理

2 o  \8 J1 g( D8 {( Y6 d7 a% e因此我们建议客户选择使用 TouchGFX4.12.3+L8 的功能，通过重新优化部分资源文件，减少图片资源的存储空间来实现客户的 UI 效果，并且改善了系统的实时性能.
& u/ q2 h* p3 e; u4 T" U

打卡，学习！