多语言的 UI 适配

最近用 AI 适配了界面的多语言，还是有点折磨的，基本把所有页面都改了一遍，这里沉淀一下主要的问题及经验：

• 文本翻译的长度不一，有的语言很长，有的语言很短

多语言对 UI 提出了更严格的适配要求，尽量不要固定尺寸，而是使用流式布局（Wrap、Grid），如果是有尺寸限制的容器，搭配上 AutoSizeText 进行文本的自动缩放和溢出控制。

还有就是对于固定尺寸的文本显示区域，记得留足冗余，因为系统字体可以调的很大。

• RTL 布局兼容

有些语言（例如阿拉伯语）的阅读顺序是从右往左，包括界面 UI 布局也需要水平翻转。

所以要避免使用写死左右属性的组件，例如 EdgeInsets、Positioned，取而代之的是有方向属性的组件：EdgeInsetsDirectional、PositionedDirectional、Directionality、BorderDirectional、BorderRadiusDirectional、AlignmentDirectional 等。

当然，对于某些不希望 RTL 布局的 UI 也可以强制指定 Directionality 使用 LTR 布局。

注意对于某些图标（例如 ⬅️ ➡️），也需要左右镜像一下。

• 尽量使用标准组件或者第三方组件，不要自己发明轮子

我发现自己写的组件往往质量不佳，特别是对尺寸适配、语言特性适配、语义适配、无障碍适配、手势适配等等方面。

像多语言管理、主题管理这种也建议使用统一的框架（MaterialApp、Scaffold、Get），它们往往会自动适配各种情况，需要自己做的很少。

受限于成本因素，翻译的准确性暂时交给机器了，后续有机会人工校验一下。最后推荐一下 Azure 的翻译，对于界面文案的翻译特别智能，比如包含替换变量的文案，它也是能保留这个信息的：

@num 画

@num السكتات الدماغية

@num จังหวะ