📚 课程目录第1章课程导入

1. 课程导入

各位同学，欢迎来到《TouchGFX多语言界面实现》的第一章。在正式开始之前，我想先聊聊我自己的一个经历。几年前我接手一个海外项目，UI 已经做完了，客户突然说要加法语和阿拉伯语支持。当时我用的还是老办法——把所有字符串复制一遍，硬编码到代码里。结果呢？改了一个月，还漏了十几个地方没翻译。从那以后，我就彻底转向了 TouchGFX 的多语言方案。

说白了，多语言这件事，如果你从一开始就规划好，后面会省掉 80% 的麻烦。这一章我们就先把地基打牢。

1.1 TouchGFX 框架概览

TouchGFX 是 ST 旗下的一套嵌入式 GUI 框架，专门跑在资源受限的 MCU 上。它不像 Android 那样动辄几百 MB 内存，而是能在几百 KB 的 RAM 里跑出流畅的动画效果。

它的核心架构可以概括为三层：

硬件抽象层（HAL）：负责和 LCD、触摸屏、帧缓冲打交道。你换一块屏，只需要改 HAL 的配置。
核心引擎层：处理渲染、事件分发、动画调度。这部分你基本不用动。
应用层：你在 TouchGFX Designer 里拖出来的界面、写的交互逻辑，都在这一层。

我个人的习惯是，拿到一个新项目，先花半天把 HAL 调通，确保屏幕能点亮、触摸能响应。这一步稳了，后面做多语言才有意义。

关键点：TouchGFX 的多语言支持是框架原生集成的，不是后期打补丁。这意味着你可以在 Designer 里直接管理所有语言的字符串，代码层面几乎不需要额外处理。

1.2 多语言、国际化与本地化

这三个词经常被混用，但它们的区别其实很清楚。我画了一张图，帮你快速建立概念。

你看，国际化是「让代码支持多语言」，本地化是「把内容翻译成具体语言」。TouchGFX 帮我们搞定了国际化这一层，我们只需要关注本地化——也就是准备不同语言的字符串资源。

我的经验：很多新手一上来就急着翻译，结果发现代码里到处是硬编码的字符串，改起来痛不欲生。记住：先做 i18n 架构，再做 l10n 翻译。顺序不能反。

1.3 TouchGFX Designer 中的多语言支持

TouchGFX Designer 是 ST 提供的可视化界面设计工具。它的多语言支持做得相当成熟，我简单列一下核心功能：

功能	说明	我常用的场景
语言管理器	添加/删除语言，设置默认语言	项目启动时先加好中英文，后面再补其他语种
文本数据库	集中管理所有字符串，按 ID 索引	所有文本都走这里，绝不硬编码
自动排版	根据语言自动调整控件宽度	德语单词特别长，这个功能救了我好几次
RTL 支持	阿拉伯语、希伯来语从右向左布局	做中东项目时必须开启
字体子集化	只嵌入用到的字符，节省 Flash	中文项目至少省 50% 字体空间

嗯，这里要特别提一下字体子集化。我记得第一次做中文项目时，直接嵌入了全量中文字体，结果 Flash 直接爆了。后来才发现 TouchGFX Designer 可以自动分析你用到了哪些汉字，只打包这些字符。这个功能在「Texts → Fonts」选项卡里，默认就是开启的。

1.4 多语言项目的文件结构

当你创建一个支持多语言的 TouchGFX 项目后，它的文件结构大概是这样的：

MyProject/
├── assets/
│   ├── fonts/          # 字体文件（每个语言可能不同）
│   ├── images/         # 图片资源
│   └── texts/          # 文本数据库（核心！）
│       ├── TextKeysAndLanguages.xml   # 语言和文本 ID 定义
│       ├── en-GB.xml                  # 英语（英国）
│       ├── zh-CN.xml                  # 中文（简体）
│       └── ar-SA.xml                  # 阿拉伯语（沙特）
├── generated/
│   └── texts/          # 自动生成的文本资源代码
├── TouchGFX/
│   └── app/            # 你的应用代码
└── simulator/          # 模拟器相关

你看，所有语言文件都放在 assets/texts/ 目录下，每个语言一个 XML 文件。TouchGFX Designer 会自动解析这些文件，生成对应的 C++ 代码。你不需要手动写任何字符串加载逻辑。

注意：千万不要手动修改 generated/ 目录下的文件！每次在 Designer 里点「Generate Code」，这些文件都会被重新生成。如果你改了，下次生成就丢了。所有文本修改都应该在 Designer 的文本编辑器里完成。

1.5 一个小例子：在 Designer 中添加多语言

光说不练假把式。我们快速走一遍在 TouchGFX Designer 里添加多语言的流程：

打开 Designer，新建一个项目（选择你用的 MCU 型号）。
在左侧面板找到「Texts」选项卡。
点击「Languages」旁边的「+」按钮，添加你需要的语言（比如中文）。
在文本列表里，为每个文本 ID 填写不同语言的翻译。
点击「Generate Code」，框架会自动生成多语言支持代码。

就这么简单。你不需要写一行 C++ 代码，多语言的基础就已经搭好了。后面我们会在模拟器里直接看到效果。

核心结论：TouchGFX 把多语言中最繁琐的部分——字符串管理和代码生成——都封装好了。你要做的，就是规划好文本 ID，然后填翻译。这也是为什么我推荐所有嵌入式 UI 项目都用 TouchGFX 的原因之一。