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

STM32 GUI高阶培训之实验二、蝴蝶闪呀闪,应用工程APP

[复制链接]
七哥 发布时间:2018-7-23 22:52
本帖最后由 toofree 于 2018-7-24 17:09 编辑

STM32 GUI高阶培训之实验二、蝴蝶闪呀闪,应用工程APP

  今天来体验一下,STM32CubeMX集成的ST emWin的强大,也就是本次培训重要的GUI部分。

  打开之前建好的,STM32CubeMX工程模板BSP。
  建立过程参考前一贴——《STM32 GUI高阶培训之实验一、创建STM32CubeMX GUI工程BSP》
https://www.stmcu.org.cn/module/forum/forum.php?mod=viewthread&tid=616765&fromuid=307297
(出处: 意法半导体STM32/STM8技术社区)


  打开工程后,双击选择“GRAPHICS”组件,弹出设置窗口,在STemWin项目下,直接点“Execute”启动STemWin。
1.jpg

  打开
STemWin窗口后,点“1”所示图标,添加一个图片零件。
2.jpg

  修改图片零件属性,名称、长、宽等信息,此图为背影图片,需要满幅显示,因此长宽为800、480。
3.jpg

  同理,添加将来的“蝴蝶位置”,先占个位。位置起始坐标250、200,图片的坐标是从左上角为(0,0)开始,与显示器的坐标设置是相同的。但不同于图片的坐标,一般图片的坐标是从左下角为(0,0)开始。
4.jpg

  保存STemWin设置
5.jpg

  提示已存在,是否替换,“确定”替换即可。
6.jpg

  重新生成Keil工程及代码。
7.jpg

  Keil工程生成完毕,打开Keil工程。
8.jpg

  关键的两个文件“GUI_App.c”、“WindowDLG.c
”。先编译,下载到目标板,看一下是什么效果。
9.jpg

  与STemWin设置时相同,只是两个虚框框,并没有要显示的图片。
10.jpg

  在717的“STM32图形界面 GUI高阶实战演练”时,在演讲窗口右下角,下载过一个压缩包“http---cache.gensee.com-ftuploadcz159-TVP8j3G43e-814044454.7z
”,名字比较长。这个压缩包是,显示程序所需要用到的转换工具、背景
蝴蝶图片等,当然也可以通过其它途径获得相应文件。
11.jpg

  打开压缩包可以看到,图片已经转好了“.c”文件,解压缩到本地文件夹(路径随意定,能找到就行)。接下来,将验证一下通过视频学习的转换方法,转个把文件验证即可,不必每个文件都转。
12.jpg

  打开转换工具软件“BmpCvtST.exe
”。
13.jpg

  
“BmpCvtST.exe”打开后,光光的,界面相当简洁。
14.jpg

  通过File下拉菜单的OPEN,浏览打开要转换的文件,如“background_new.png”

15.jpg

  打开后,可以预览图片效果,以及看到图片信息,图片大小800x480,ARGB格式。
16.jpg

  保存时,将可以根据提示,转换文件。
17.jpg

  选择“.c”格式,文件名定为“background_new1.c
”,为了不与已有的文件“background_new.c”造成冲突。
18.jpg

  选择第二项,带alpha通道(透明度)的真彩格式,R与B调换位置,
alpha通道翻转。
19.jpg

  用文件对比工具软件“Beyond Compare 4”,打开文件
“background_new1.c”与“background_new.c”,对比是否一致。
20.jpg


  经对比,两个文件数据都相同,仅文件名与文件内部相应的数据名称不同。说明我们转换的方法正确,与演讲老师的一致。

那么我们就不再对其它“蝴蝶”图片做转换了,直接使用转换好的“.c”文件即可。
21.jpg

  将几个图片的“.c”文件存放到,工程的STemWin文件下,“TEST_STM32F769_DISCO_APP\STemWin\App\res
”,“res”文件夹需要用户自己新建。
23.jpg

  在Keil工具中添加文件夹,并重命名为“res”。
22.jpg

  将“
“TEST_STM32F769_DISCO_APP\STemWin\App\res”文件夹下的图片“.c”文件添加进来。
24.jpg

  现在开始修改工程源文件
“GUI_App.c”和“WindowDLG.c”。
  打开“background_new.c”,复制数组声明行。
25.jpg

  打开文件“
WindowDLG.c”,在第40行处,粘贴插入刚复制的数组声明信息,为了能在本文件中使用数组。
26.jpg

  依此类推,将5个文件数组声明信息全部复制到文件
WindowDLG.c
27.jpg

  需要更换原有的屏显函数。
28.jpg

  更换为函数IMAGE_SetBitmap()。
29.jpg

  新创建一个静态变量,标示“蝴蝶”循环显示状态。

30.jpg

  将4种显示状态,分别一一列出来。按
butterfly_status值来显示当前,通过改变butterfly_status的值,下次按新值进行状态轮转。
31.jpg

  打开
文件“GUI_App.c”,需要修改两处程序。
32.jpg

  新建显示窗口,并把显示窗口指针赋给WM_HWIN类型的hWin。修改定时1s,进行显示窗口更新。即每1s,执行一次_cbDialog(WM_MESSAGE * pMsg)函数,显示蝴蝶图片更换,
butterfly_status状态随之改变一次。
33.jpg

  下载程序到开发板。
34.jpg

  复位或重新上电,程序全速运行。
35.jpg

  观察程序运行后的显示效果,可以看到4个颜色的蝴蝶,开始每1秒切换显示一次。
36butterflys.gif

  至此,蝴蝶开始闪呀闪!本实验完成。

国际惯例,程序必须有!完整版本工程:
TEST_STM32F769_DISCO_APP.rar (18.39 MB, 下载次数: 42)
收藏 1 评论6 发布时间:2018-7-23 22:52

举报

6个回答
zero99 回答时间:2018-7-24 10:53:55
支持下
CC4 回答时间:2018-7-24 11:00:00
帮顶,学习下
supermanandy 回答时间:2018-8-1 14:57:30
分享的非常详细,感谢分享
myxiexing 回答时间:2018-8-2 23:06:01
谢谢分享
lf01221116 回答时间:2018-8-29 20:13:07
谢谢~~~
swapkernel1111 回答时间:2021-12-31 13:03:33

谢谢

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