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

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

[复制链接]
STMCU-管管 发布时间:2021-5-31 17:37
客户在使用 TouchGFX开发 GUI应用的时候, 需要很多的图片资源来呈现友好的人机交互功能, 因此外扩了一个 FLASH来存储图片资源. 在软件研发后期发现现有的 FLASH存储空间不够, 因此提出是否可以使用 TouchGFX来减少图片资源的存储空间且实现同样的 UI效果.9 R4 @! i7 L2 g# }3 O
1.png
! f7 |$ x3 _' J! m8 V5 t( E
01调研
  _5 {' X- y  V3 J$ q+ ]& Z) c* L' Z, K6 r+ h- f

% G! G+ |6 H! x# 在硬件方面
, o  G# f6 _3 a, J; A0 i% \" w; h
' s0 f/ R/ b; P% i1 |) \/ t

9 r$ }9 v5 S6 y2 `6 V7 g3 wMCU 的图像处理加速器DMA2D 中的调色板的颜色格式 , 支持 L8 格式的图层之间的渲染:4 }( J6 h+ p4 ?& `
2.png

9 \: @2 H# d2 C* b8 m6 O$ |; q# 从软件方面
; ?  W7 t6 z& x; p5 p# F0 r2 Q& G. G6 r- y" p$ A
% M+ Q: }% M9 r7 h8 I
最新的 TouchGFX4.12.3 开始, 可以利用了 DMA2D 的调色板功能对图片的资源进行优化 .  I: T( e8 ~' i  P7 {) ^, i6 [% B
* [9 f0 n  m, U( @# Z( S) F* \
# 比如下图(宽 x 高=200x200)
! l* t* t, Y! ]8 M' ?8 F5 C
1 L7 [: V5 R* {) G3 T3 ~

  C% t6 n3 @/ T3 e* _1. 这幅图是由 256 种颜色组成的.
5 @7 d% P7 T' M  U' R  a+ d2. 且每种颜色都针对图像进行了优化.7 t- t, m3 w$ Y0 L& F+ O& {/ O2 ^
3. 256 种索引颜色中的每一种都是 24 位颜色.
; I' ]: c7 o* c
3.png
为了在 LCD 上显示这张图, TouchGFX Designer 在生成资源文件时,生成的资源文件大小:8 v  H6 G& o6 s& [% J/ P- a) u' X

9 Z+ v4 i8 i' l
$ Q' K3 [% c5 D. p8 q6 G
1. L8_ARGB8888 :2 U- }, h; v% v+ E1 d
200x200x1byte+256x4byte=41024bytes4 g4 _3 I5 J- J$ Q/ g& w
- V  H( u: J2 @

% F+ ^; W1 N$ }( c3 b* }1 k# y; G=>200x200 个 8bit 的颜色索引+256 个 32bit' g2 j( V' ~5 W
4.png

! ~3 j( c+ g. _' T3 F0 q
. }" d6 L1 o' U! |
2. ARGB8888 :7 \9 Q" N: Q/ j# a$ M" p
200x200x4byte=160000bytes.( b; U! M! I* n7 F$ G- n
=>200x200 个 32bit 的颜色6 l) k4 I0 z3 l; Q, l% I' q

: C: X, M& c# C* E+ X: y; [' Q* N
7 T  \7 {3 {9 q: v9 B$ t& x3 I
在 TouchGFX 中使用 L8 Image ,只需要将 L8 的图片拖入到 TouchGFX Designer 中,然后在Image 页面中选择正确的格式 :* r% Q, A+ Y% M/ B# ^, J/ A9 |0 z9 i
5.png
2 S3 r; _) ^5 k0 d: A5 {
注意 :如果图片超过 256 颜色,转换工具就会报错,因此可以使用图片工具(如
7 q  w% j% q8 C$ V+ P" V( c7 i
/ f! X$ _) U* @. K

3 k3 ]  ]6 f# i7 s$ k9 m- a& X/ d! Xpaint.net/imagemagick)将颜色数减少至少于 256 色 :) s- |/ U7 v9 L. r) I/ n
. |/ e0 A: j: R9 ?4 j

) [7 }. N) r) U3 t Paint.net:# N2 V3 h2 [+ R9 P
6.png
Image Magick (www.imagemagick.org):
( U+ _/ z& r  s9 C
7.png

  P% Q0 V2 f8 x# b. p( G; ^02结论
8 c6 I3 R1 U0 X# B
. g8 t* K5 S3 m% i+ s, t

1 ]2 h" \( y/ G图像使用 L8 格式时占用的 flash 大小显著低于标准 24 位格式(RGB888)的原始图像。下表列出了这三种不同调色板格式的具体图像的 flash 使用情况(图片分辨率 200x200):
; r: H, w0 w/ r; g
8.png
由于 TouchGFX 对于 L8 格式还可以支持 L8_ARGB8888,因此可以与 ARGB8888 等格式的图像进行混合渲染,因此特别适合作为图标等颜色数少但是素材丰富的应用.
: U* Y1 Y5 Q3 c5 C5 N
7 ~$ ^: T8 m$ n9 `) S0 B
. a: [9 G! j6 v5 t* Z/ Y
综上可以看出,采用 TouchGFX4.12.3+L8 格式 :' k  C8 h8 E( S- F1 M9 H$ y* z- C
& o% R- N5 z- l3 V
* g8 V9 I4 A! @! D1 r
1. 相比较 ARGB8888 像素格式, L8 大幅降低了资源文件的大小, 从而降低对存储芯片的需求 .3 q  v1 O& y+ i6 Q
2. 同时由于图片像素信息大幅减少,读写一张图片的速度也大大提高, 也提高了系统实时性能.
7 O* n0 X. c- Z4 `; t$ K
7 n- j! {4 i! m8 s03处理
2 R* Z0 e1 O; ~& ?5 ^
/ a  h$ x+ @9 D1 Z" f5 F1 I( i5 F6 @因此我们建议客户选择使用 TouchGFX4.12.3+L8 的功能,通过重新优化部分资源文件,减少图片资源的存储空间来实现客户的 UI 效果,并且改善了系统的实时性能.
* K0 v/ R5 K* H( S1 m2 U$ t3 i3 G% w
0 I8 S, N5 a4 ^9 }; x$ a9 B
1 收藏 1 评论1 发布时间:2021-5-31 17:37

举报

1个回答
BEEE 回答时间:2021-9-14 21:08:25
学习/ T0 }  t' M1 W* U0 B" j' w7 c0 W3 y  |

所属标签

相似分享

官网相关资源

关于
我们是谁
投资者关系
意法半导体可持续发展举措
创新与技术
意法半导体官网
联系我们
联系ST分支机构
寻找销售人员和分销渠道
社区
媒体中心
活动与培训
隐私策略
隐私策略
Cookies管理
行使您的权利
官方最新发布
STM32N6 AI生态系统
STM32MCU,MPU高性能GUI
ST ACEPACK电源模块
意法半导体生物传感器
STM32Cube扩展软件包
关注我们
st-img 微信公众号
st-img 手机版