查看: 6701|回复: 4

TouchGFX基础教程(一):下载安装TouchGFX并运行示例

[复制链接]

658

主题

659

帖子

2079

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
2079
发表于 2019-11-14 15:49:50 | 显示全部楼层 |阅读模式
前言
TouchGFX是一种用户友好型的C++图形框架工具,它包括TouchGFX Designer(一种易于使用,基于拖放的PC图形构建器)以及TouchGFX引擎(一种功能强大且经过优化的图形核心)。它结合了拖放式GUI生成器TouchGFX Designer的简单性,C++语言的效率和灵活性以及PC模拟器的便利性,为开发者提供了完美的开发环境,使其能够快速便捷地开发具有高端图形和出色性能的高级嵌入式用户界面。TouchGFX基础篇一共分五个教程,让您可以逐步了解并开始使用TouchGFX。
! r& ?4 \4 m6 ~. N/ n$ t6 Z
步骤1:下载TouchGFX
用户首先需要在ST官网上注册一个用户名,登录后方可下载TouchGFX Designer。下面是下载地址和详情页面。

) R# U0 D& f# S( J* J8 U
TouchGFX Designer下载地址:
https://www.st.com/content/st_com/en/products/development-tools/software-development-tools/stm32-software-development-tools/stm32-configurators-and-code-generators/touchgfxdesigner.html
* @! w: s9 \: z7 `2 T) b1 Y% D$ y
步骤2:安装TouchGFX
本文针对的是TouchGFX 4.10版,其他版本的TouchGFX的安装与此类似。只需要运行TouchGFX MSI安装程序TouchGFX-4.10.0.msi,并遵循标准安装步骤,即可安装TouchGFX。
4 P5 V6 k3 B2 S
按Next进入下一步。

; V. i9 y+ ^% z
阅读并接受许可协议。按下一步。
8 Z1 G# ^3 u5 q, u3 s
安装目录推荐使用默认路径。注意:路径不能带空格。

7 f* E" f4 C5 m4 Y" K, x
按Finish以完成安装。

' i) h5 h) a0 ?# [/ S
默认情况下TouchGFX将安装在C:\touchgfx\4.10.0中。您可以并行安装较早的版本,也可以将早期版本放置在 C:\touchgfx\下。
0 E' l3 t3 ?, k6 ^6 e. J
TouchGFX Designer应用程序位于designer文件夹中,但安装程序可能已在“开始”菜单中创建了TouchGFX Designer快捷菜单。TouchGFX C ++框架位于touchgfx文件夹中,TouchGFX环境位于env文件夹中。

. y( ]- X2 K$ u" t1 f0 F
当您启动TouchGFX Designer时,您将看到此“Create New Application”(创建新应用程序)窗口:
创建一个新项目
( s" H  X1 L# R3 Q0 V
该窗口允许您创建新项目或加载现有项目。

- C3 ]1 E8 ^) N' ?
步骤3:在模拟器上运行模板
TouchGFX Designer提供了许多UI模板。这些模板可以帮助您了解有关TouchGFX的更多信息。您可以直接使用这些模板,或是用作项目参考。

" w: {, }9 A3 i- Z0 M+ Y
在TouchGFX Designer中启动一个新项目。单击“ UI TEMPLATE”部分中的“CHANGE”按钮或矩形框:
选择UI模板

8 m1 h" t  r, P8 Z. z0 S
TouchGFX Designer现在将为您显示一个带有可用UI模板的窗口。单击“Matching UI Template”标签,然后选择一个模板。在这里,我们选择AnimatedImage模板。选择后,单击底部的蓝色“SELECT”按钮。
选择AnimatedImage模板
  r2 y$ w) R' B: R
单击“SELECT”后,TouchGFX Designer即可为您创建一个项目。在这里,我们给项目命名为“ MyAnimatedImageExample”。
创建项目
: A: R2 ]% y$ `" U% d2 |
单击“CREATE”创建项目。现在,TouchGFX Designer会将您选择的UI模板与默认的应用程序模板组合在一起,以创建一个完整的项目。模板是从ST的服务器上下载的,此过程大概需要10到20秒。
3 R3 [: f( {* o6 u: x8 d0 \/ j. B
TouchGFX Designer现在正在显示组合项目。要运行Windows模拟器,请单击右上角的“Run Simulator”按钮。
项目准备就绪
6 z& c3 J6 O$ B; v
Windows模拟器显示为正常的Windows应用程序。标题栏显示应用程序名称。
Windows模拟器
- O. o, v6 Z0 r* S' {0 A
其他可用的模板可以用相同的方式尝试。

5 _. u6 G  ^0 u* J
步骤4:在STM32板上运行模板
在这一步骤中,您将学习如何为STM32F746-Disco开发板创建项目,以及如何在开发板上运行TouchGFX模板。
$ X: E) ^% A  U) N& F( Q
通过单击菜单中的“File”->“New”或键盘上的CTRL-n,在TouchGFX Designer中启动新项目。

4 a" q5 ?4 E  A% K8 s
选择“AnimatedImage”作为您的UI模板(如果尚未选择)。单击“APPLICATION TEMPLATE”部分选择应用程序模板。默认的应用程序模板仅允许您在Windows上运行。
选择应用程序模板
, Y# i- w, w9 D5 ~  a9 K8 X
单击“ STM32F746G Discovery Kit”,然后单击“SELECT”。
选择开发板
# d0 T1 u1 s# C! N0 e/ B+ s
现在您可以创建项目了。您可以根据需要更改应用程序名称。在这里,我们将其更改为MyAnimatedImageExample746。单击蓝色的“CREATE”。
创建最终项目

6 G. \, X8 e; e  w0 k
该项目的外观与我们在上一步中看到的相似。唯一的区别是,我们现在在“Run Simulator”按钮旁边还有一个“Run Target”按钮。当您按下该按钮时,TouchGFX Designer将使用GNU ARM C编译器编译您的项目,并将应用程序烧写到目标开发板上。此过程最多需要一分钟,具体取决于您的计算机速度。
项目准备就绪

6 l( w7 i% J/ d, m1 T' j
烧写完成后,TouchGFX Designer会在底部状态栏中写“ Flashing Done”。现在,您应该可以看到应用程序在开发板上运行。
如果单击右下角的浏览代码,TouchGFX Designer将打开一个文件浏览器,显示新项目所在的目录。导航到“ build \ bin”,您可以看到以下文件:
项目的二进制文件
! N/ z0 e: o. W7 u+ s9 K, M% Q( @% v' \
“ simulator.exe”文件是Windows模拟器应用程序。

  X8 G3 A- Q) ^* s7 S
“ target.hex”文件是您开发板上的STM32应用程序。这是TouchGFX Designer刚刚编译到您开发板上的文件。
好了,第一部分的基础教程就分享到这里。欢迎大家留言交流~

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复

使用道具 举报

1

主题

4

帖子

29

积分

新手上路

Rank: 1

积分
29
发表于 2019-12-10 17:39:03 | 显示全部楼层
沙发
回复

使用道具 举报

0

主题

1

帖子

6

积分

新手上路

Rank: 1

积分
6
发表于 2019-12-10 18:36:49 | 显示全部楼层
不错的教程,适合新手!
回复

使用道具 举报

0

主题

1

帖子

4

积分

新手上路

Rank: 1

积分
4
发表于 2020-1-17 08:33:02 | 显示全部楼层
刚准备学习GUI设计,谢谢分享
回复

使用道具 举报

0

主题

1

帖子

14

积分

新手上路

Rank: 1

积分
14
发表于 2020-2-19 08:38:42 | 显示全部楼层
支持楼主 很不错
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

保留所有权利 @ 2019 TouchGFX 使用条款 | 销售条款和条件 | 隐私政策 | Cookies管理 | 行使您的权利 | 沪ICP备18033411号-2

快速回复 返回顶部 返回列表