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

  j/ o/ I0 H3 o* c01调研

6 _: \7 \) I- z' O) n; N$ ~
# 在硬件方面
; `8 `; a' l. o" ~% d

MCU 的图像处理加速器DMA2D 中的调色板的颜色格式 , 支持 L8 格式的图层之间的渲染：

# 从软件方面


. J% \( {1 t1 H/ o" v最新的 TouchGFX4.12.3 开始, 可以利用了 DMA2D 的调色板功能对图片的资源进行优化 .

# 比如下图(宽 x 高=200x200)
2 F9 e# h  V+ V) q6 C  m1 j2 F

; z* w  X$ M4 j2 g5 I1. 这幅图是由 256 种颜色组成的.
2. 且每种颜色都针对图像进行了优化.
3. 256 种索引颜色中的每一种都是 24 位颜色.

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

+ q5 }) X' ]! D5 \6 @2 l. U
' D' w8 L- w. P" R3 [% W% U  l1. L8_ARGB8888 :
6 Q2 n# v8 P2 a6 T* k) Y" F200x200x1byte+256x4byte=41024bytes

- `5 m7 x: E6 x4 r6 V
=>200x200 个 8bit 的颜色索引+256 个 32bit

4 v' y  k" F' K  }' f# t
5 G6 z4 f( [3 O" D, a2. ARGB8888 :
3 [9 z9 p$ ~; u8 g( _: o200x200x4byte=160000bytes.
2 s0 y+ o" G6 U$ [=>200x200 个 32bit 的颜色
% ^: a( f! ?& U. z2 {
3 o. ?) a$ o2 G9 U- `
2 o( O5 @0 f6 L; r5 R6 c在 TouchGFX 中使用 L8 Image ，只需要将 L8 的图片拖入到 TouchGFX Designer 中，然后在Image 页面中选择正确的格式 :

4 S  V6 C! x. W( R! V注意 :如果图片超过 256 颜色，转换工具就会报错，因此可以使用图片工具(如
9 S3 E4 p& X! Q+ B+ g+ a
( u- i! ^7 b" A! T4 v& K# j/ _, X
6 z% o. S# Q/ J: L7 A4 K+ o  Hpaint.net/imagemagick)将颜色数减少至少于 256 色 :
1 @5 ?1 g+ v! N2 V& o6 X( d3 G0 l3 \
# Z; h. ?, ?$ `
Paint.net:
' w. b) X' R: t9 A" w+ D

Image Magick (www.imagemagick.org):
$ d8 K3 j5 Y5 a( K/ l

02结论


7 D8 b" l3 r  O  \4 e图像使用 L8 格式时占用的 flash 大小显著低于标准 24 位格式(RGB888)的原始图像。下表列出了这三种不同调色板格式的具体图像的 flash 使用情况（图片分辨率 200x200）：
0 C, X# {7 Z& _; E4 A6 D

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


综上可以看出，采用 TouchGFX4.12.3+L8 格式 :
+ \/ e; i0 _0 D: {6 o$ O; \

9 R) Y' A  L# p) R) N& Y1. 相比较 ARGB8888 像素格式, L8 大幅降低了资源文件的大小, 从而降低对存储芯片的需求 .
) d: B7 \& A3 N7 ^3 t) E, U! B. Q: A2. 同时由于图片像素信息大幅减少，读写一张图片的速度也大大提高, 也提高了系统实时性能.

03处理
0 w: H$ B# p4 T& q' I5 a
) n. M5 D7 M! y1 ]2 u% p- @, u+ [因此我们建议客户选择使用 TouchGFX4.12.3+L8 的功能，通过重新优化部分资源文件，减少图片资源的存储空间来实现客户的 UI 效果，并且改善了系统的实时性能.
4 b' N4 h7 J0 _6 r( i
: ]- s+ q* [. D/ ^6 @

学习