你的浏览器版本过低,可能导致网站不能正常访问!
为了你能正常使用网站功能,请使用这些浏览器。

干货笔记 | 使用 TouchGFX4.12.3+L8 格式减少图片资源以提高性能

[复制链接]
STMCU-管管 发布时间:2021-5-31 17:37
客户在使用 TouchGFX开发 GUI应用的时候, 需要很多的图片资源来呈现友好的人机交互功能, 因此外扩了一个 FLASH来存储图片资源. 在软件研发后期发现现有的 FLASH存储空间不够, 因此提出是否可以使用 TouchGFX来减少图片资源的存储空间且实现同样的 UI效果.9 Z4 x: I+ n2 x9 d2 D, M, e
1.png
/ V+ |# `8 Y8 R6 |5 H, E6 h
01调研+ }6 V3 ^' f! V- W6 M8 K

) e. e0 L& v: n. x

# h- V+ N$ Z) S& Q/ ]. R. h! n# 在硬件方面
8 l. O2 t9 V# \1 K6 G0 G5 P, }- n  `/ `
3 {4 K. p, x' n
MCU 的图像处理加速器DMA2D 中的调色板的颜色格式 , 支持 L8 格式的图层之间的渲染:
6 W5 }% M# G% z$ {% G, R0 D
2.png
5 b5 |% i! Q9 W7 Q# ^6 s
# 从软件方面" B; L" k# V/ P

) o) x: j& R' e3 V) g. M

/ g5 W0 m/ W# F8 O4 Q最新的 TouchGFX4.12.3 开始, 可以利用了 DMA2D 的调色板功能对图片的资源进行优化 .! f1 g& q$ B! L* g) k  y0 w) s; e

: Y% c; K7 }, Q# 比如下图(宽 x 高=200x200)
3 n# N& m: l( ^; V6 e4 x. H$ n/ @5 s! s) G/ u7 E' m' }
4 Q0 ?& a2 O/ E! c3 d% y
1. 这幅图是由 256 种颜色组成的.
: {& @- K" A. u* V- N2. 且每种颜色都针对图像进行了优化.! J8 ^" T% I9 f
3. 256 种索引颜色中的每一种都是 24 位颜色.7 R9 E1 @5 v( e, Z% S) `9 h8 \
3.png
为了在 LCD 上显示这张图, TouchGFX Designer 在生成资源文件时,生成的资源文件大小:
* w7 A" @: j6 S! s- X0 l$ m* L0 a0 D

7 c) F0 y, H" Y4 l$ ^( X: i1. L8_ARGB8888 :4 O* Q: q- c5 H0 j! m4 K3 U( y
200x200x1byte+256x4byte=41024bytes
( K; A  B% L2 ^* W4 e/ j
9 N% n: @3 ]7 K

0 B; Z: Q& n, W=>200x200 个 8bit 的颜色索引+256 个 32bit& b  x! [8 a/ L/ E$ q5 b
4.png

: o3 _) D/ P: ~5 D2 P/ `1 I0 ]  l
* s8 ?: j0 m* N9 r0 x7 {
2. ARGB8888 :0 Y' J" G) G4 z* g& G1 W' P" U) E! i
200x200x4byte=160000bytes.& E- b3 R$ C) f* X6 K, B
=>200x200 个 32bit 的颜色9 D* b# o3 [3 r" Y

( z5 m: _" F% |6 W; z8 M
& |3 G  A7 P9 g6 y2 X: i4 ?
在 TouchGFX 中使用 L8 Image ,只需要将 L8 的图片拖入到 TouchGFX Designer 中,然后在Image 页面中选择正确的格式 :
  K  \3 y2 F1 m
5.png

. t. J; q5 K4 L% q注意 :如果图片超过 256 颜色,转换工具就会报错,因此可以使用图片工具(如
4 N1 f' Q* K, A# y9 T/ p0 K
# H, I9 H7 [2 ^
. H/ z/ O! g" M" v# J1 B7 _5 s0 q# W
paint.net/imagemagick)将颜色数减少至少于 256 色 :! j: L. D! m8 u7 a, D* H0 Z& G
" U) Z8 F* V: E
; i5 g& f5 b+ s8 j( K: U
Paint.net:# h* I& H: Y" m" Z7 J& b
6.png
Image Magick (www.imagemagick.org):
, M( ?9 t( A/ J- D" t" G5 T4 e
7.png
; A* R6 a0 Z* i% g3 o- S
02结论
' t" d! ]& U7 _5 z" W+ N1 H/ J1 k6 T* z) `5 R1 x

+ _: R. O0 \9 p' n图像使用 L8 格式时占用的 flash 大小显著低于标准 24 位格式(RGB888)的原始图像。下表列出了这三种不同调色板格式的具体图像的 flash 使用情况(图片分辨率 200x200):
, v' a: \' h0 X4 Q! n0 O' o
8.png
由于 TouchGFX 对于 L8 格式还可以支持 L8_ARGB8888,因此可以与 ARGB8888 等格式的图像进行混合渲染,因此特别适合作为图标等颜色数少但是素材丰富的应用.; M- H$ F% A" C: X2 t* y/ N5 s

) A# C/ G% n0 n* s5 z6 y

& V$ V- E3 F9 e+ m6 s6 u# P综上可以看出,采用 TouchGFX4.12.3+L8 格式 :# ]* _. F: l! L( h/ w; E. q- l6 y

8 U( l  |- a) r! n7 }
. J- j6 ?+ a* \3 g1 S9 C8 c8 c
1. 相比较 ARGB8888 像素格式, L8 大幅降低了资源文件的大小, 从而降低对存储芯片的需求 .
- S! n7 Z7 B, ~8 B' b2. 同时由于图片像素信息大幅减少,读写一张图片的速度也大大提高, 也提高了系统实时性能.9 k2 G) @; |9 K' C1 `

  w0 F  [9 l8 x/ `03处理* {- [- @3 O7 i2 U3 d7 m: f
( A6 }/ z: O7 `: q2 h% T
因此我们建议客户选择使用 TouchGFX4.12.3+L8 的功能,通过重新优化部分资源文件,减少图片资源的存储空间来实现客户的 UI 效果,并且改善了系统的实时性能.
1 f# D8 `1 B8 T, p* T; W' P+ c+ D4 Q  c: I7 D3 ]: t
赞 1 收藏 1 评论1 发布时间:2021-5-31 17:37

举报

1个回答
BEEE 回答时间:2021-9-14 21:08:25
学习
8 O5 h* w: _$ C: O2 V1 @$ w% \

所属标签

相似技术帖

官网相关资源

关于
我们是谁
投资者关系
意法半导体可持续发展举措
创新与技术
意法半导体官网
联系我们
联系ST分支机构
寻找销售人员和分销渠道
社区
媒体中心
活动与培训
隐私策略
隐私策略
Cookies管理
行使您的权利
官方最新发布
人形机器人运动控制、感知与智能配电
半导体创新技术与应用方向
EE架构与软件定义汽车
12V/48V 汽车智能配电(SPD)
区域控制单元(ZCU)与分区架构
关注我们
st-img 微信公众号
st-img 手机版