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

01调研
  A& V, I! e2 b

# 在硬件方面
3 E) D" R  M' ?7 c# ~# EMCU 的图像处理加速器DMA2D 中的调色板的颜色格式 , 支持 L8 格式的图层之间的渲染：

# 从软件方面
  @6 ~( r4 n! I8 n" ~6 y最新的 TouchGFX4.12.3 开始, 可以利用了 DMA2D 的调色板功能对图片的资源进行优化 .

0 |2 k9 b8 l: ?0 ^/ T# 比如下图(宽 x 高=200x200)
. t" G% q& I- ]+ v, [9 W; W

/ L- A/ n& l& b* p& C1. 这幅图是由 256 种颜色组成的.
2 C' u; x% t% Z0 }9 k4 ~) }2. 且每种颜色都针对图像进行了优化.
3. 256 种索引颜色中的每一种都是 24 位颜色.
0 s# x1 y  }; H, X6 q

为了在 LCD 上显示这张图, TouchGFX Designer 在生成资源文件时,生成的资源文件大小:

7 e! `  C2 m' A. {/ \$ r! U
( L  G; e1 t- R. B# ^, k' c1. L8_ARGB8888 :
# S" c7 B+ ^+ o& M7 W/ e" }( W$ m200x200x1byte+256x4byte=41024bytes
  g2 U- Y5 t1 B9 h3 J: A=>200x200 个 8bit 的颜色索引+256 个 32bit

1 r% b- n3 N' ^6 c; c2. ARGB8888 :
% S' O0 A& U9 ^5 [( c200x200x4byte=160000bytes.
$ a  f! m6 W, d4 D6 \1 K=>200x200 个 32bit 的颜色


. z! c- f5 t- s1 d( m# V在 TouchGFX 中使用 L8 Image ，只需要将 L8 的图片拖入到 TouchGFX Designer 中，然后在Image 页面中选择正确的格式 :
/ z- a6 a9 M; y" k4 R% p$ R

& R3 D, |% C5 k  N% p1 X8 n" s8 p
+ d: x# H5 Z% M4 l0 p. x3 B! c* Q注意: 如果图片超过 256 颜色，转换工具就会报错，因此可以使用图片工具(如

: L; @' h- {3 Y
paint.net/imagemagick)将颜色数减少至少于 256 色 :


Paint.net:

6 i3 D4 q7 ]) l4 c. k' PImage Magick (www.imagemagick.org):
# r4 g/ r; l+ ]9 i

02结论
+ u; }- U0 [7 @8 w, O# Y
3 |* H2 _% w" {# \
图像使用 L8 格式时占用的 flash 大小显著低于标准 24 位格式(RGB888)的原始图像。下表列出了这三种不同调色板格式的具体图像的 flash 使用情况（图片分辨率 200x200）：

由于 TouchGFX 对于 L8 格式还可以支持 L8_ARGB8888，因此可以与 ARGB8888 等格式的图像进行混合渲染，因此特别适合作为图标等颜色数少但是素材丰富的应用.
, O3 J! Q) s0 \, F' A
综上可以看出，采用 TouchGFX4.12.3+L8 格式 :


1. 相比较 ARGB8888 像素格式, L8 大幅降低了资源文件的大小, 从而降低对存储芯片的需求 .
# D  B, Y( y8 p3 N+ `. L2. 同时由于图片像素信息大幅减少，读写一张图片的速度也大大提高, 也提高了系统实时性能.

8 f; s5 C2 \- h% ?6 V
03处理

因此我们建议客户选择使用 TouchGFX4.12.3+L8 的功能，通过重新优化部分资源文件，减少图片资源的存储空间来实现客户的 UI 效果，并且改善了系统的实时性能.

打卡，学习！
& K, r' ]$ i( P4 l8 X' |% ]( B