使用TouchGFX开发STM32界面应用之入门篇（一）-- 软件安装与Hello World

okhxyyo

使用TouchGFX开发STM32界面应用之入门篇（一）-- 软件安装与Hello World [复制链接]

使用TouchGFX开发STM32界面应用之入门篇（一）-- 软件安装与Hello World
2018年秋季，STM32正式收购了TouchGFX -- 嵌入式GUI界面中间件软件领先的开发商。用过TouchGFX的朋友都知道，TouchGFX在MCU系统上运行的界面非常炫，堪比手机的APP界面，此番STM32将其收购，广大开发者不必再使用TtouchGFX的试用版了，可以光明正大地使用正式版了！
总的来说，使用TouchGFX开发STM32界面，有2种方法：一是利用TouchGFX Designer软件，支持图片和控件拖拽、可快速生成在KEIL或IAR等IDE中可打开的项目工程；另一种方法是，STM32CUBEMX 5.0版本增加了对TouchGFX的支持，可以使用CubeMX开发TouchGFX应用（后续文章详述）。本文先介绍TouchGFX Designer的使用。
TouchGFX Designer下载地址：TouchGFX Designer下载地址 。  需要在st官网上先注册一个用户名、然后login，下载页面的最下方是下载链接。



图一

下载完成后得到安装包 TouchGFX-4.10.0.msi，安装目录推荐使用默认路径，或者安装到D盘根目录也可以，注意：路径不要带空格！
启动 TouchGFX Designer ，初始画面如下：



图二

功能区主要分为2个部分：MY APPLICATION，创建自己的界面应用；ONLINE APPLICATION，应该是GFX预置好的项目文件，目前只有一个关于洗衣机的DEMO，本文不做描述。下面以STM32F769I-DISCO官方开发板为例来具体演示第一个图形界面例程。
首先在 APPLICATION TEMPLATE 中选择我们要使用的开发板。移动鼠标到Simulator那个画面位置，自动出现一个 CHANGE 按钮：



图三

鼠标点击这个按钮：



图四

选择 STM32F769I Discovery Kit ，修改项目文件存储路径（例如：D:TouchGFXProjects），命名例程名称：MyTest，如图：



图五

点击 CREATE ，



图六

软件自动从网上下载本项目需要用到的GUI和模板代码（有时下载很慢；如果出现红字提示失败，就再尝试 create 一次、直到成功），出现软件的设计画面：




图七

为了设计此例程的界面，还需要先做一个准备工作：准备要显示的图片（png格式）、并放置到该项目的文件目录下。本例程只需要一个图片：



图八

这是一个预先画好的图片（可以使用画笔等制图工具，然后生成png格式的图片），STM32F769I-DISCO开发板的屏幕分辨率是800x480，所以图片也是要这个尺寸。TouchGFX Designer自动生成的项目文件包含一个子目录images，我们就把做好的图片放到这个目录下：



图九

回到TouchGFX Designer，点击左边中部的“图片资源”Tab：



图十

可以看到系统自动把我们刚才准备好的图片文件添加了进来：



图十一

鼠标点击图片 stm32logo.png ：




图十二

上面的操作等价于添加了一个IMAGE控件、并且将该控件的主要的“图片”属性设置成了 stm32logo.png （关于控件、属性等术语，将在后续文章中介绍），所以呈现出上面的图片。点击右上方的 Run Simulator ，系统将生成在PC上可运行的模拟画面：



图十三

等待一会儿时间，电脑屏幕上出现模拟界面：



图十四

这个模拟界面功能非常强大，还可以在PC上打印调试信息，后文还将对模拟器做详细介绍。模拟界面成功后，就可以生成代码并烧写到目标反上看实际运行结果了！
点击右上角的 Generate Code：



图十五

此时，确认 STM32F769I-DISCO开发板 通过USB线已经与PC连接好了，然后点击 Run Target：



图十六

左下角显示提示信息：Compiling target code （时间较长，请耐心等待）：



图十七

之后，提示信息变成：Flashing target code ，并且板子上ST-LINK的指示灯闪烁（正在烧写代码！）：



图十八

几十秒钟之后，烧写完成，板子上正确显示出STM32的logo图片，这是GUI模式的 hello，world！  图片还是很漂亮的：



图十九

正如你所看到的，整个显示图片的操作过程中，不需要敲入一行代码！这个 TouchGFX Designer 不一般吧？！
小结：
系统配置与版本：
1）宿主机：win10
2）TouchGFX Designer 版本4.10
3）目标板： STM32F769I-DISCO开发板，主芯片为 STM32F769NIH6U
4）ST-LINK-V2.1的驱动是必不可少的
5）最好预装 Visual Studio 2013（或VS的其他版本），后面的 TouchGFX Designer 进阶文章中就要用到VS来添加、修改代码了，VS是TouchGFX Designer 开发必备的IDE开发环境。本人安装的是VS社区版，是可以免费下载、使用的：



图二十


本讲到此结束，下一讲介绍人机交互功能的实现，从界面上的“按钮”开始一个新的例程！
进入第二讲：使用TouchGFX开发STM32界面应用之入门篇（二）-- 按钮与消息响应例程。


作者：海东青电子
来源：简书

ddllxxrr

写得超详细，顶一下