2、第一个TouchGFX项目：创建空白项目、理解工程结构、屏幕与容器概念、模拟器运行与调试
好，咱们正式开始动手了。这一章的目标很简单——让你亲手创建第一个TouchGFX项目，然后把它跑起来。别小看这一步，很多新手就是卡在“项目建好了但不知道下一步该点哪”这个环节上。我带你走一遍，你跟着做就行。
2.1 创建空白项目
打开TouchGFX Designer，你会看到一个欢迎界面。别慌，点左上角的“Create New”按钮。弹出来的对话框里，有几个选项需要你填：
- Project Name：给你的项目起个名字，比如
MyFirstApp。别用中文，也别带空格。 - Location：选择项目存放路径。我个人习惯放在
D:/TouchGFX_Projects/下面，方便管理。 - Screen Size：这里选你目标硬件的分辨率。如果你手头有开发板，就按板子的规格来；如果没有，先选
480x272，这是最常见的入门尺寸。 - Application Type：选
Blank UI。我们就是要从零开始，别选那些带模板的。
点完“Create”，等几秒钟，项目就生成了。嗯，这里要注意：第一次创建项目时，TouchGFX Designer 可能会联网下载一些依赖包。如果你的网络环境不太好，可能会卡住。我曾经在客户现场遇到过这种情况，最后是提前把依赖包离线下载好才解决的。
TouchGFX Framework 安装包，手动安装即可。
2.2 理解工程结构
项目创建完成后，你会看到左侧有一个文件浏览器。这里面的东西，说白了就是整个项目的骨架。我带你捋一遍关键目录：
| 目录/文件 | 作用 | 你需要注意什么 |
|---|---|---|
src/ |
存放 C++ 源代码文件 | 你的业务逻辑主要写在这里 |
include/ |
存放头文件 | 别把头文件和源文件混在一起放 |
generated/ |
TouchGFX Designer 自动生成的代码 | 千万别手动修改！改了也会被覆盖 |
assets/ |
存放图片、字体、文本等资源 | 图片格式建议用 PNG，别用 BMP |
TouchGFX/ |
TouchGFX 框架核心库 | 一般不需要动，除非你要改底层 |
.touchgfx |
项目配置文件 | 双击它可以用 Designer 重新打开项目 |
你想想看，这个结构其实很清晰：src 和 include 是你自己写代码的地方，generated 是工具帮你生成的，assets 是放素材的。各司其职，互不干扰。
generated/ 目录下的任何文件。我曾经有个同事，为了改一个按钮的位置，直接改了生成的代码，结果下次 Designer 一刷新，全没了。白忙活半天。
2.3 屏幕与容器概念
在 TouchGFX 里，有两个核心概念你必须搞明白：Screen（屏幕） 和 Container（容器）。
Screen 就是整个显示界面。一个应用通常有多个 Screen，比如主菜单屏幕、设置屏幕、数据显示屏幕。每个 Screen 对应一个完整的画面。
Container 是 Screen 里面的“小盒子”。你可以把按钮、图片、文字框这些控件放进 Container 里。Container 的好处是：你可以把一组控件打包成一个整体，方便复用和移动。
举个例子：你做了一个“温度显示”的 Container，里面包含一个数字文本和一个温度图标。这个 Container 可以放在主屏幕，也可以放在详情屏幕，甚至可以在多个 Screen 之间共享。这就是 Container 的价值。
为了让你更直观地理解，我画了一张图：
2.4 模拟器运行与调试
项目建好了，概念也懂了，接下来就是跑起来看看效果。TouchGFX 自带了一个模拟器，可以在你的电脑上直接运行 UI，不需要硬件板子。这一点非常方便，我平时做原型验证时，基本都在模拟器上搞定。
运行模拟器的步骤很简单：
- 在 TouchGFX Designer 界面右上角，找到 “Run Simulator” 按钮（一个绿色的播放图标）。
- 点击它，系统会自动编译项目并启动模拟器窗口。
- 第一次编译可能会慢一些，因为要生成一些中间文件。耐心等一等。
- 模拟器窗口出现后，你就能看到你的空白屏幕了。虽然现在什么都没有，但至少证明你的环境是通的。
cl.exe 看看能不能找到编译器。找不到的话，去安装 Visual Studio Build Tools 就行。
模拟器跑起来之后，你还可以做一些简单的调试：
- 查看日志输出：在 Designer 底部的
Output面板里，可以看到编译信息和运行时日志。如果 UI 有异常，这里通常会给出提示。 - 修改 UI 并实时预览：在 Designer 里拖拽一个按钮或图片，保存后模拟器会自动刷新。不需要重新编译，这一点很省时间。
- 模拟触摸事件：用鼠标点击模拟器窗口，就相当于用手指触摸屏幕。你可以测试按钮的点击响应、滑动效果等。
我记得有一次，我在模拟器上调试一个滑动列表，发现列表滚动时总是卡顿。后来通过查看输出日志，发现是图片资源加载太慢导致的。换成压缩后的 PNG 图片，问题就解决了。所以，别小看模拟器的调试功能，它能帮你发现很多问题。
好了，到这里，你已经完成了第一个 TouchGFX 项目的创建、理解了工程结构、搞清了屏幕和容器的关系，并且成功在模拟器上跑了起来。这一步走稳了，后面的路就好走了。