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

STM32CubeIDE 结合图片取模在LCD显示图片经验分享

[复制链接]
攻城狮Melo 发布时间:2023-4-6 19:04
一、图片取模工具(imag2lcd)* Y% z( N* |6 [( g; a+ Y2 B
        我们前面将汉字显示时说过,嵌入式LCD屏显示就是通过LCD屏幕数据接口给每个屏幕像素给出一个颜色值实现实时渲染显示出来。只不过文字显示时,给出的是一个二进制点阵,然后根据二进制中的“1”或“0”值匹配给出程序设置的前景色或背景色。那么涉及图片显示时,图片本身就是携带了颜色信息的,那么我们就可以直接将颜色信息通过LCD接口推送给屏幕。
( ~( h: q9 g! A* h4 N0 J/ }
' }8 ~4 P& @8 e4 K3 [4 ]
        图片取模工具(或叫图片转换工具,imag2lcd),如下图所示,可以将图片格式文件转换为图片点阵代码表,将每个像素的颜色数值给出为16进制数值表示的点阵。5 q' X7 g- ]1 I% G, _' A& I& ~; W
% U0 L) W+ U; D8 M. U
b74a47d48a81432cab84738a4977d89f.png
7 W4 N, g2 }1 q) f% Q3 G2 r& x6 l1 g; U  P& C9 C

2 U$ ~0 J' h8 F6 m) `二、 工程设计
+ N! P* t6 B) j6 J' Y        【1】本文借用了本博客专栏前面汉字显示博文的基础源码包,在该基础上进行图片显示。 本文采用的STM32L496VGT3-ali开发板,其LCD屏幕支持240*240像素输出。
& B7 b  \  r: Y( X0 r2 G/ B+ E+ D7 C9 |8 f) N# l
ebfecbf1bbe44b9a92c3b9543f0251be.png
7 C4 l( p( ?; e4 B1 y
; L6 t4 K2 L8 g7 P: x3 @6 o) W! X$ }: s         只是为了讲述图片在LCD显示实现过程,本人直接在网上下载了一张240*240的图片,并将该图片转换为bmp格式。
" i4 V* R: Q8 k% q# P  u; H8 ~6 m5 |& H" F# i0 M- y4 T! Q5 ^7 _: Y
        【2】由于是进行240*240图片刷新在整个屏幕,因此采用了SPI-DMA实现刷新屏幕像素,本专栏前面oled点亮博文中,就采用了直接刷新和DMA刷新两种方式设置屏幕背景实现点亮。现在先回顾一下DMA方式需要注意的细节。
4 [7 A- f  c1 Q1 I+ W# l6 j8 _* C. h2 A1 `* A
        1)开启DMA支持* m+ h+ ~6 T- L- z& }3 F

/ t8 L5 Y" n  X  q5 m
c79bd6e189fa4049afece21c97de2596.png 2 h5 p6 V$ T3 _1 I

' r8 a, E+ M8 |/ `         2)开启中断支持,然后保存生成输出代码  E7 G* t2 n( [4 W* P1 B' S. w* l

( ^& K, a  U0 K6 d8 Q
ba8e3d72f90c4bcb8218ade57c941d38.png
7 H; A& d. U* Z* T; b2 [& ]' D) Q& s( n4 T+ X. ?2 Z0 W
         3)增加对中断回调的处理2 K$ B0 Z8 i8 p7 R* C

9 @; @0 O, c2 S' L! K
2494cd586b554410b912747b0d277a8e.png 9 m/ o) I/ d5 O) W
7 A/ t/ v* n0 v( j( n
8 o5 ]5 O  T; [! y/ ], r
三、图片显示实现过程9 u6 c3 v1 H- Y+ L  A0 y) F
       , P  S( i4 ^) T5 W+ b7 b$ D& t) A
        先假设已经能点亮lcd屏幕了,现在开始实现图片在lcd屏幕输出显示过程。
# g1 r3 W: W# w. G& j4 P

' r) C: g( g& a( x3 ^       【1】 打来安装好的image2lcd工具,载入需要显示的图片,如下图进行设置。
( Y, c0 l0 I* L( W
) Z; B( f4 V" N
7d41777e529a470881a32d410270f755.png 2 {* J+ d# e5 `0 z0 R
7 Q$ U, K5 W: s% T0 p/ r# k, u
         【2】完成设置,点击保存按钮,在弹出的对话框,输入想要保存的文件名,注意,如果没输入文件名后缀,将默认为(.c)输出,本文采用(.h)输出,如下图。' v, z; N! H9 j/ O

( m  ~1 c3 A& A- ?( B, t  v" B
3f3c6520ebe24540b8df90cae1867d98.png + ]$ G: {0 K; n, [
! d  p- p5 ~5 N5 O. G
         【3】输出图像编码表如下图所示。* i3 Y7 d: i' D. e. S

$ A" c+ K  t: F7 C- A
ce051cf5adaa46b6a52ccf565821137d.png
) e0 [# r+ {6 N" n7 O; P. u+ |; d" h$ F5 X5 o* [( ?# p2 d
         【4】将输出的"pyimg.h"文件拷贝到工程的ICore/ oled目录下,并为了消除编译告警信息,将gImage_pyimg的数据类型调整为"uint8_t"。
! c" g7 |$ y' ]% [. u% |: F
& r0 \9 c+ S- Z) o! A
84742f97b43845daa832211c91d9f5ae.png * ^8 l$ k3 b/ H# n! s" `$ v

8 @* f/ i$ ]+ i6 V  G, o' H         【5】在oled.h文件添加一个“void BSP_LCD_img_DMA();”函数声明,在oled.c文件中包含拷贝过来的头文件“include "pyimg.h"”,并实现“void BSP_LCD_img_DMA()”函数。
! b1 i$ F7 k8 r$ Y3 `! o
  1. extern volatile uint8_t one_frame_done;//已在spi.c中用户自定义+ h3 f, [1 y- b
  2. //加载240*240*2的uint8_t格式颜色数组进行LCD屏幕显示% N- E9 g' L# R, [9 `0 d1 j* t0 }
  3. void BSP_LCD_img_DMA()
    0 J4 p: u0 C, |# O7 C. o0 X
  4. {% s# b8 |% h% W- O
  5.         /*gImage_pyimg 在pyimg.h中,大小WIDTH * HEIGHT *2=115200 */! N1 m' A' B7 g, {
  6.         //需要分两次写入HAL_SPI_Transmit_DMA写入缓存大小uint16_t(0xfff,65535)2 J2 D$ w, P7 j
  7.         one_frame_done = 0;; c% `& n% S3 l- C* G. Z) `/ Q; }
  8.     /* 指定显存操作地址为全屏*/. N4 ^* v' k+ N+ \4 e/ _' j4 a
  9.     LCD_Address_Set(0, 0, WIDTH - 1, HEIGHT/2 - 1);6 E; R' f4 [( z5 N$ j) i% c1 V
  10.     Data_Cmd_State(1);/* 指定接下来的数据为数据 */
    ! N8 R( q9 @. M+ E; Z/ q
  11.     /*DMA 写前半屏*/
    4 f. ~5 p& s/ L3 |" T1 q9 o
  12.     HAL_SPI_Transmit_DMA(&hspi1,gImage_pyimg, WIDTH*HEIGHT);
      a6 u& z  ~0 U3 M8 Y1 E  x
  13.     while(!one_frame_done){/*release cpu and doing something else*/}
    $ s" L5 Z9 c. W! Y
  14.         one_frame_done = 0;
    4 H) z7 \  Q4 J
  15.     /* 指定显存操作地址为全屏*/0 M7 r  O, }% K  {# E
  16.     LCD_Address_Set(0, HEIGHT/2, WIDTH - 1, HEIGHT - 1);, \0 ^2 p. d0 s0 K
  17.     Data_Cmd_State(1);/* 指定接下来的数据为数据 */
    9 R1 k0 |- o& a. S2 T, Y, w0 }
  18.     /*DMA 写后半屏*/
    3 L/ u# y6 b  v/ d5 r
  19.     HAL_SPI_Transmit_DMA(&hspi1,gImage_pyimg+WIDTH*HEIGHT, WIDTH*HEIGHT);
    * y( [& j5 l& d7 B4 k' a% N
  20.     while(!one_frame_done){/*release cpu and doing something else*/}
    + y  }7 _  o/ s, @% f5 W( a2 N* R) I/ C' C
  21. }
复制代码

1 A5 s1 U9 L2 T* W% J四、编译及下载
+ G6 g$ p5 P  H        【1】在main.c主函数中,加入按键1时调用“BSP_LCD_img_DMA”函数,实现图片在LCD屏幕显示。
; ?; M& F. C* A* o9 G4 Z( v8 A6 B+ Q$ s' k: ?$ S2 h
a79fba8e61db44a1ab807934e22d264b.png
/ G+ R! {, V& Z2 {/ B" c# D
% {# ?, _! H( Z2 `; B5 l% @3 C         【2】点击编译及点击运行按钮,加载程序到开发板上" U! D) W+ V/ C5 Z' y, T

* G0 G) @4 W) H6 Z' L( r8 \
99b97baca0f248dcb081c9e00d8783e1.png
5 }5 [; @. o3 f
3 E$ D0 e- ?$ b- G
         【3】在开发板上点击按键1,观察显示效果5 x" c) s, N( S6 g9 {8 Y

: g, S! D+ F% S5 b5 H* e8 }  d
a2a947ff3f2842ecbd52ecb33a282973.png
$ {3 b, z5 P5 R/ r& Y. L
& x, p/ I9 `  k! y/ R. i/ X
5 ?# D" O& X, f7 `; q# t& y
————————————————
  g1 Y  V# H5 ]  M6 F+ |版权声明:py_free-物联智能) d( }# n& L$ L' S# d/ t( Q# m
如有侵权请联系删除
# x# E: x; a( z+ W) G
+ d$ }! Z  ]; Z4 [8 n) p: A2 Q2 ?. e' W' ^. p) ^
赞 收藏 评论0 发布时间:2023-4-6 19:04

举报

0个回答

所属标签

相似技术帖

官网相关资源

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