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

01调研


9 m$ Z& ~6 `/ z8 C2 ^! f/ ?# 在硬件方面
6 \+ e: M1 h+ d5 q+ j

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

# 从软件方面

2 y9 U4 g7 J) \5 M- j
0 X: S5 J# G- E. {* Y: t- v4 }最新的 TouchGFX4.12.3 开始, 可以利用了 DMA2D 的调色板功能对图片的资源进行优化 .
, ?6 z  M2 N* j$ L/ h3 X$ T" z
  g' Z' @9 x6 Q1 w: b8 {# U# 比如下图(宽 x 高=200x200)
) Q. \9 Q8 i7 A! S1 K
  y5 r* s- z9 {
1 z: ?3 Q& D, w9 g9 V. @1. 这幅图是由 256 种颜色组成的.
2. 且每种颜色都针对图像进行了优化.
3. 256 种索引颜色中的每一种都是 24 位颜色.
7 g7 [- T# A# r( \; J/ L

为了在 LCD 上显示这张图, TouchGFX Designer 在生成资源文件时,生成的资源文件大小:
' F% F7 D5 G5 x$ t, g

7 ?7 z! _$ _' L" d1. L8_ARGB8888 :
200x200x1byte+256x4byte=41024bytes

' e, m7 g1 u2 G' y# v
=>200x200 个 8bit 的颜色索引+256 个 32bit
% T1 E5 E+ G4 u. Z% f

2. ARGB8888 :
; E/ W- A, V8 x6 }200x200x4byte=160000bytes.
! C, ^8 {2 l/ A; O( p=>200x200 个 32bit 的颜色

; w% f& a/ G) @, J* y) m
在 TouchGFX 中使用 L8 Image ，只需要将 L8 的图片拖入到 TouchGFX Designer 中，然后在Image 页面中选择正确的格式 :
1 W& u) ]1 l# l( x' O  S

( c3 S( q* t6 j1 X. F5 k" Y注意 :如果图片超过 256 颜色，转换工具就会报错，因此可以使用图片工具(如


paint.net/imagemagick)将颜色数减少至少于 256 色 :
0 Q# V! q  S8 l) {! [4 G9 ~
+ R$ F9 W$ P* R# W5 A3 f5 E
Paint.net:

Image Magick (www.imagemagick.org):

3 I/ A' o+ r5 H. f6 o02结论


图像使用 L8 格式时占用的 flash 大小显著低于标准 24 位格式(RGB888)的原始图像。下表列出了这三种不同调色板格式的具体图像的 flash 使用情况（图片分辨率 200x200）：
7 q% I) r; u+ X0 ]8 F# R" c

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


综上可以看出，采用 TouchGFX4.12.3+L8 格式 :
3 T. |5 M4 y, x$ `0 H% }: R/ ~
) k$ y' }& E; [
1. 相比较 ARGB8888 像素格式, L8 大幅降低了资源文件的大小, 从而降低对存储芯片的需求 .
& q2 [/ `8 ~1 F2 D  g6 r* ~1 x2. 同时由于图片像素信息大幅减少，读写一张图片的速度也大大提高, 也提高了系统实时性能.
" K% K# m  U" j$ ?
03处理
  s+ B' F# y( y. ^
7 m" b! w! j1 w因此我们建议客户选择使用 TouchGFX4.12.3+L8 的功能，通过重新优化部分资源文件，减少图片资源的存储空间来实现客户的 UI 效果，并且改善了系统的实时性能.

学习
2 L) D7 J1 L0 F% Q/ |: |" o% t5 q, l