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

使用 TouchGFX4.12.3+L8 格式减少图片资源以提升性能

[复制链接]
STMCU小助手 发布时间:2022-8-8 23:13
前言; K) w7 Y8 p/ m
客户在使用 TouchGFX 开发 GUI 应用的时候, 往往需要很多的图片资源来呈现友好的人机交互功能, 因此外扩了一个 FLASH 来存储图片资源. 在软件研发后期发现现有的 FLASH 存储空间不够, 因此提出是否可以使用 TouchGFX 来减少图片资源的存储空间且实现同样的 UI 效果.' m, s/ d: O2 R: N% }1 X: P+ d% A

8 R# K0 _$ U7 t" {4 S6 B8 L" T
  s" V: x( M2 k% z
1 调研
8 `" q- {' s  Z9 ]9 ?+ Z$ r9 F经过调研发现 :
& T: l) U5 ?7 K1 X, B. R. Q➢ 在硬件方面 :
' M+ s4 ]! E/ jMCU 的图像处理加速器 DMA2D 中的调色板的颜色格式 , 支持 L8 格式的图层之间的渲染 :
/ j6 F8 l' r, ~' L( e* c+ h8 J
+ c2 D# U& R& t6 N9 p0 X
H~}L`RJ%@0WBP_H~0P(JVGC.png - f" D+ m+ Q- Q# A$ ?9 v5 w1 P* j
) ?# C/ H5 K9 K- S* H( s" B
➢ 从软件方面:
/ T9 d1 f2 e1 ]# I* U' v最新的 TouchGFX4.12.3 开始, 可以利用了 DMA2D 的调色板功能对图片的资源进行优化 .. W. Z5 b. G1 H# t+ R! ^9 F. u
➢ 比如下图(宽 x 高=200x200) :
& }! ~2 b. K. m& b1.这幅图是由 256 种颜色组成的.8 D: l; i( X- l
2.且每种颜色都针对图像进行了优化.- D3 {% a7 j& l+ I9 Y
3.256 种索引颜色中的每一种都是 24 位颜色.
, \1 o4 R* g1 X, G
4 y" N0 W. t( r7 u8 K
XL6H`8PGHG6(4N1C)6FIDGY.png : i, Q9 U; B# a9 H

) @. P5 A6 k; e- f4 d7 q, g; Q/ ?0 j 0 f6 M  l5 A; D4 P# I& c% s+ h! o
➢ 为了在 LCD 上显示这张图, TouchGFX Designer 在生成资源文件时,生成的资源文件 大小 :2 a% Y" t4 X# s
1. L8_ARGB8888 :
, N8 j- u+ x  `. K200x200x1byte+256x4byte=41024bytes+ y! z1 Q% Q. r: v; A. L
→200x200 个 8bit 的颜色索引+256 个 32bit 的颜色; V( V9 W% c+ L
9 _8 X5 P6 D  N" |; ~

4 g' q- S& [. P4 d+ M 8AH@8`9%Y$MPMND8`3GOI.png 2 a! @9 d1 c7 q" O: A( Y, T

  H' J, v+ p. _+ [# b' F( g9 _
2. ARGB8888 :3 w: \$ H4 H* x3 m
200x200x4byte=160000bytes./ k+ Z$ g; Z# Q# s
→200x200 个 32bit 的颜色: }4 F* M& C/ _& b' m
➢ 在 TouchGFX 中使用 L8 Image ,只需要将 L8 的图片拖入到 TouchGFX Designer 中,然后在 Image 页面中选择正确的格式 :
3 y. c! W6 O/ X* a" n! Q
* }& p' D; P' ?2 {  G

5 m- `) ^: m/ G7 Z# P. c MFU(`HJ%Y2WZX_GSC89%0O1.png
0 v- n% ?7 Q+ K3 B" p
3 ?2 Y+ O. ^$ G0 A
➢ 注意 :如果图片超过 256 颜色,转换工具就会报错,因此可以使用图片工具(如paint.net/imagemagick)将颜色数减少至少于 256 色 : % ?3 g) r4 r; z9 f; t( @4 t1 P
✓ Paint.net :
/ C& [$ o: c- u* x
% G  f+ Q2 c& T  Z

4 ]+ p' g4 y; q" w! H& i+ V KB`2[Z7`HTG{4K~0(E@2P{4.png 1 W% U$ C# g; Y% {1 Z

; T; ~! a* D6 B✓ Image Magick:
0 V2 _. x2 t3 s5 k: R" D @NS6`BD02F[@GT2AR7]CZ)J.png
& T+ z. m7 X+ e" r# N; m8 W5 I  k8 z7 A4 @0 ]3 x
2 结论 6 x! y, U  z3 x* @' D: F2 Q
图像使用 L8 格式时占用的 flash 大小显著低于标准 24 位格式(RGB888)的原始图像。下表列出了这三种不同调色板格式的具体图像的 flash 使用情况(图片分辨率 200x200):+ H3 j" W1 H: D* U- R, q0 s- }
9 ]8 @& g9 [* @0 l* z2 \2 O# r: T

: H7 v; }4 b: K 4W1JJPQ1)W{6W2~{M{DFI[J.png 3 O- X) T3 x% p0 y: K( _/ \
  T4 R# \# W9 D. {
由于 TouchGFX 对于 L8 格式还可以支持 L8_ARGB8888,因此可以与 ARGB8888 等格式的图像进行混合渲染,因此特别适合作为图标等颜色数少且素材丰富的应用.
! x$ @: x& a& U' l综上可以看出,采用 TouchGFX4.12.3+L8 格式 :
1 ~, H; F2 K5 n- v1 |1.相比较 ARGB8888 像素格式, L8 大幅降低了资源文件的大小, 从而降低对存储芯片的需求 .
. V; S* a5 q4 S  A) Z2.同时由于图片像素信息大幅减少,读写一张图片的速度也大大提高, 也提高了系统实时性能.
# W: k/ z# o2 W% A* w3 ~" `# _6 S/ }' e7 P/ D/ o1 m' E- H
3 处理 & Q) Y& h: a3 L
因此我们建议客户选择使用 TouchGFX4.12.3+L8 的功能,通过重新优化部分资源文件,减少图片资源的存储空间来实现客户的 UI 效果,并且改善了系统的实时性能.
+ r- U7 y+ C2 w+ H' w' S0 J: B' K0 |/ j3 U/ }/ W' U
" K$ s, z; _' Q$ o: c$ K

4 z3 |; I) \! V! C完整版请查看:附件
" w  v4 |. m" _7 I
7 c. R0 c  |4 Z0 U( O1 Q8 C, n0 t! t" ?6 F7 r1 H$ H

) h6 [6 Y3 N' f) \, F5 j9 F  w

LAT0771_使用TouchGFX4.12.3和L8格式减少图片资源以提升性能.pdf

下载

418.83 KB, 下载次数: 0

赞 收藏 评论0 发布时间:2022-8-8 23:13

举报

0个回答

所属标签

相似技术帖

官网相关资源

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