利用 Xcode 11 打造出色的本地化体验

好的

早上好

谢谢你来参加这次演讲 我是Kulpreet 我是本地化的一名软件工程师 我将和我的同事Vivian 和Arthur一起来做本场演讲

本场演讲中 我会介绍一些我们平台上的 非常棒的本地化新功能 Vivian和Arthur将介绍 Xcode 11上的一些新工具 包含一些本地化工作流程的提升 本地化图片 以及如何使用测试来 为你的app创建多语言截图

今天 我们预估超过70%的用户 在美国以外 本地化是扩展app新市场 的好机会

在Apple 我们非常关注为全球的 用户带来优质的用户体验 今年 我们为多语种和全球用户 提升了用户体验和引入了新功能 举几个例子 在iOS 13上 我们的键盘 现已支持38种语言了 我敢确定你的母语是其中之一 你一定很激动吧 我们也创建了一些新的设置流程 来引导多语种用户正确设置语言

现在其中之一的功能是 我特别想要和你们分享的 我们来深入了解一下

在iOS 13 你可以在app中 为多语种用户设计一个新的设置页面 我很高兴告诉大家 用户现在可以 在系统语言之外单独 设置app的语言了

如果一个用户 有一个已连接的Watch 设置也会同步到相应的 Watch应用中 相似地 在macOS 用户也能通过语言和地区偏好 在app中设置语言了

这很重要 因为在多语种地区 用户会偏爱在不同的 上下文中使用不同的语言 比如在香港地区 一些人可能习惯阅读中文新闻 即使他们用英文来处理银行业务

在印度 一个学生会在学校学习英语 即使他们回家和家人们说北印度语 app是我们每天都会 使用的交互窗口 这个新设置允许用户选择一个 他们使用你app时偏爱的语言

现在 如果你的本地化使用的 是我们标准基础API库 你马上就能实现这个功能 但你要留意一些事情 来让用户更好地使用你的app

首先 不要尝试手动在代码中 配置app语言 我们的API为保证用户获取到 正确的语言和字体回退做了很多工作 如果你需要在你的app添加 切换语言的选项 我们推荐你在设置中添加 用户能在那里切换你app的语言

接下来 当用户改变了 你app的语言

你的app会重启 切换到目标语言 现在 为了让用户 能无缝实现语言切换 我们推荐你使用 状态恢复API

在iOS 13 NSUserActivity 有了新的状态恢复API 想要了解如何使用它们的更多信息 你可以参加周五的演讲

最后 在你的app中将所有的内容 连贯地用一种语言表示很重要 如果你要加载客户端或服务端的资源 一些有用的API会帮你判定 加载哪种语言 我们来看看其中的一些

本地的API对于获取用户的 语言和地区偏好非常有用 Locale.PreferredLanguages 会返回用户偏好的 语言列表 现在 这个列表可能对你有用 如果你需要创建一个处理多语种 内容的app 以及需要获取 所有语言的一些字体等资源文件 另一个需要注意的点是 Locale.PreferredLanguages 它会返回一个用户偏爱的语言列表 不论是否是你应用程序包支持的语言 所以它并不适用于获取 当前app运行的语言 为了获取当前app运行的语言 我们可以使用Bundle API Bundle API适用于 语言匹配 Bundle.main.preferredLocalizations 兼顾用户偏爱的语言 和app程序包支持的语言 会根据用户的偏好 返回一个 你的app程序包 需要支持的语言列表

现在 如果你有一个外部列表 例如你从服务器上加载了 一些远程文件 你的服务器有 不同语言支持的安装远程文件 使用Bundle.preferredLocalizationsfrom 的类方法 它会包含你服务器的第三种语言

现在 为了帮助你了解这些功能 以及它能为你的app带来什么 我来用一个示例讲解

好的 去年 我们开发了Vacation Planet 的示例版本 这是第一个星际旅行预订app 我们已经完善了这个app 完整预订旅行的功能体验 我们有这个发现标签页 里面的集成页面展示了 一些我们提供的很棒的缩略图 比如这个去往浪漫的Pluto 或Moon Yoga空间巡航项目

现在 一些季节限定的产品比如 WWDC Afterparty 因为这个季节限定产品 的内容是从我们的服务器拉取的 所以 这张图片和这个很棒的关于 首个Interstellar Bash 的描述 以及我们如何在船上… 我们将要在船上的一个海鲜餐厅 Codable 都是完全从服务器上下载的 现在 读完这些介绍后 我认为很棒 我想要预订 但是 你知道的 WWDC的出席者来自世界各地 他们可能想要用不同的语言 来预定行程 所以 我么接下来要做的是在下面的 个人标签页面 这里有一个表视图单元格 展示了现在app运行的语言 当我点击它 它会带我进入设置界面 我点击来查看一个 我app所支持的所有语言列表 我来将它改变为法语 当我返回后 你看 System UI还是英语 但当我返回到 Vacation Planet app会重启 它现在变成法语了

现在 你会注意到 它回到了我离开时候的界面 这是因为我使用了状态修复的API 你能看到所有我们的字符串 和日期格式 都是法语 很好 但当我回到服务端下载的内容 我看到它还是英语 这样是有问题的 因为我们希望我们app的 内容都是一致的 我们想要他们的app是同一种语言 所以 我们来看一下接下来要做什么

这里 在我们的几何视图控制器里 我有这个方法 localDiscoverItems 从服务器下载内容 当我们下载内容时 我们需要传language的值 因为服务器需要知道 我们下载内容的语言 你在这能看到我传递的语言是 Locale.preferredLanguages.first 我之前提到过的 Locale.preferredLanguages 不管我app支持的语言 会返回一个用户偏爱的语言 所以 这可能是我app 不怎么支持的波斯语

现在 我最好考虑 服务端支持的语言 我的应用包支持的语言 用户偏爱的顺序 所以 我要开始从服务器支持的语言 下载 你能在这里看到 接着当我使用包API时 那个类方法来自 Bundle.preferredLocalizations 我会传给 availableServerLocalizations 针对那段内容 现在的第一个元素是 向服务器请求的 最佳语言

所以 我来重新构建它

等几秒钟重启 你现在会看到图片和所有内容 都是法语了 这样很棒吧？ 很酷 我们可以准备预订 我等不及在Interstellar Bash上 看到你们了

好的 来总结一下 app语言设置能运行用户 在你app中选择的语言

启动设置 是让你的用户来切换你app语言的 最好的方法

使用状态修复为用户 带来无缝切换语言的体验 最后 如果你要自定义或在服务端 加载资源 请确定使用正确的包或 你本地的用户案例API

对于所有的这些新功能 我都很兴奋 我们今年做出了提升 我期待看到你在app中 会为国际用户带来什么 现在我们已经简化了实现方法 有请Vivian Vivian？

谢谢Kulpreet 现在 我们来聊一下Xcode 中的一些本地化工具的提升功能 今年 我们根据大家的需求 做了很多事情 所以这会像是阅读一份愿望清单 首先 性能

我非常兴奋地宣布 导出很多本地化 的用户界面构建器文件项目 比之前平均快了15倍

所以 这意味着 如果导出 你的项目需要一分钟 现在只需4秒了

我们是通过重新设计了 字符串提取进程来实现的 所以你的用户界面构建器文件越多 你会看到越大的改进效果 同时也加快了你的工作流程 无需再为直接调用genstrings 或btool而烦恼 我们使用xcodebuild exportlocalizations 和importlocalizations 取代了原有的方法 来创建你所有的字符串文件 接下来 Mac上的iPad app 你可能已经很兴奋能在Mac上 使用你的iPad app 但可能有一些字符串不被支持 或其他一些事情 比如 点击这里 但用户现在需要使用 一个有着光标的鼠标 没有人会点击 或在新闻中 你能控制Siri在设置中的推荐 当你使用iPad时 但app是Mac的偏好设置 当然 你会想要使用代码中已有的 NSLocalizedString 所以 为了实现它 我们为特定设备的字符串引入了一个 新的stringsdict规则 这个规则结合了复数 和可变的宽度规则 你可以在你已有的 字符串中使用它 甚至stringsdict文件中 已经存在的文件也可以

所以 新规则是 NSStringDeviceSpecificRuleType 支持的设备是Apple TV、 Apple Watch、iPad iPhone、iPod和Mac 所以 它不仅能在Mac的 iPad app中使用

你的stringsdict 会像这样： 上面的已有字符串关键字 接下来的新规则 NSStringDeviceSpecificRuleType 和在一个通过设备关键字的所有 特殊设备的字符串序列的字典内部 想要了解Mac上的 iPad app的更多内容 请观看接下来的演讲 将Mac的iPad app 提升到一个新高度 接下来 设置包

你现在可以在Xcode本地化目录 中设置包 所以在项目中本地化将 变得非常简单

我们做的非常重要地提升之一是 Xcode的本地化工具 是你能使用的本地化资源 所以 到现在 为了本地化一张图片 它需要成为你项目的一个独立文件 这意味着在你的资产目录 会有一些 四处分散的本地化的文件 所以 我很兴奋来宣布现在开始 你能直接在资产目录 本地化图片了

所以 你现在能本地化你的图片集 观察并发状况 Apple TV图像栈 雪碧图集 Game Center控制面板 和排行榜 以及新的符号集 我们来看一下如何实现

在资产目录编辑器中 当你在属性检查器 选择了一个支持类型 你就会发现一个本地化按钮 点击它 我们为内容.JSON的资产添加 本地化属性 你可以导出一个 Xcode本地化目录

不过 如果你是多语种 你自己本地化了一些文件 或你移动一些已经本地化的图片 到资产目录 当你点击这个按钮 它会显示你项目中所有 本地化过文件的复选框 检查其中的一些

它会在资产目录编辑器 创建wells 所以你能拖拽本地化的图片到 你想要的其他资产中 那么 新的符号们会怎样呢？ SF系统符号已经被本地化了 你无需再做其他工作 自定义符号也能被本地化 你能设置方向 或者你只需要它们 为从右到左的语言翻转 比如阿拉伯语和希伯来语 或者你能在相同图片 工作流做一个完整的本地化循环 你会发现在属性检查器有 同样的本地化按钮 了解符号的更多内容 可以今天晚些时候参加 SF符号介绍演讲

接下来 我想要在示例中向你展示实际操作

现在 你可能留意到 在Kulpreet的示例中 我们并没有完全本地化剩余的图片 现在我们来完成它 如果我进入Xcode 我能找到我的资产目录 我们来修复这张瑜伽图片 这是月球上非常棒的瑜伽疗养所 你能感觉心理和身体上 都比以前轻了

所以 我只需打开属性检查器 点击本地化 保存 就好了 我已经为我其他的旅行指南 完成了本地化 但我有一张已经被本地化的图片 我想要把它移到我的资产目录 利用资产目录所有很棒的功能 比如来指定一个不同的外观 来适配深色模式 这超级简单 我只需将我的旧图片拖入到资产目录 Xcode已经为相同名字的旧资源 创建了一个新的图片集 所以我甚至不需要在故事板 做任何修改 它就能工作 现在 我也想要将我的本地化文件 一起拖进去 我点击本地化

核对当前的语言 将它拖入正确的位置 然后保存 现在 我能删除我的项目 和硬盘里的旧文件 好了 一切都准备好了 我现在能导出一个 Xcode本地化目录 这和Xcode 10工作流程一样 我选择项目 来到编辑器 为本地化导出

我们现在来完成法语 我不需要其他多余的 好的 导出

我们来看看我们得到了什么

好的 这是我的Xcode的 本地化目录 我能将它发送到我的本地化工具 我找到了我的本地化工具 我将它打开 我知道我能访问本地化文件 开始工作 所以 我们在这里得到了xliff 我知道怎么做 我知道它包含项目所有的字符串 但还有什么呢？ 我们有一个资产目录 这是一个完整的资产目录 我能将它拖到另一个 Xcode项目 使用它 但本地化工具不关心这个文件 这个文件已被过滤掉了 所以 它是唯一的本地化内容 只针对这个语言环境 现在 当前情况下 我们还没有任何的法语图片 现在这里只有英文的复制文件 这是为了让本地化工具能更方便工作 它们能直接使用 开始编辑 为了节省时间 我已经有一些 本地化工具完成的文件了 我们来看看它们返回了什么 打开我最喜爱的本地化工具的目录

我们能看到一边是所有图片

的英文版本 另一边是法语版本 这是瑜伽 对的 我们来将它导入到项目中 回到Xcode 还是和Xcode 10一样的 工作流程 选择项目 来到编辑器 倒入本地化 选择它 完成Xcode本地化目录 选择导入 很棒 那么 现在 我要来到我的资产目录

我看到 现在我的图片有两个版本 都在一个地方

但是 它有点小 我们再次运行一下app 现在我们看到大了一点点

所以 这次当我们回到app 我们现在应该能看到 我们法语标题的旅行指南了

看吧 真好看

我们回到幻灯片

我们刚看到了Xcode的 本地化工具的新功能 用户界面构建器文件的导出和导入 现在更快了

这有一则新stringsdict规则 针对特定设备设定的

现在设置包本地化更简单了

符号和图片能在资产目录下本地化了 现在 当然 只要你本地化了你的app 你会想要测试所有本地化的功能 我们也简化了步骤 有请Arthur来为大家讲解

谢谢Vivian （使用XCTest来本地化截屏） 现在 我们来了解如何利用UI测试 的优势来测试本地化

测试是开发周期一个重要的部分 它耗费时间和资源 但是当你添加新功能时 和检测问题 协助回归测试很重要 在你发布你产品给用户之前

如果你的app支持超过一种语言 你必须测试所有语言特征的问题 剪辑的字符串 截断的内容

重叠的布局 或甚至从右到左特定的语言 比如阿拉伯语和希伯来语

现在 如果你想要测试 你支持的所有设备

你支持的所有语言

你的测试度量会重复探索

你很容易就会遇到 成千上万种测试场景 你的测试人员手动覆盖所有的 测试场景会非常难 所以 最重要的是在你项目中 引入测试 来减轻质保的体力劳动负荷

在Xcode 11

覆盖所有的测试计划 的自动化测试变得简单了

测试计划通过使用不同的配置 是一种非常简单的方法 来多次跑相同的测试

我今天不会讲测试计划的很多细节 要了解更多内容 请参加周四早上的 使用Xcode测试演讲

我们要讲的是如何在你的 本地化工作流程中使用测试计划

首先 我们会讲如何将你的本地化测试过程 变得容易

接下来 我们会讲到 如何使用测试计划 来集成本地化截屏

最后 我们会了解一些截屏的使用案例 因为它们不仅可以用来测试

首先 我们来了解我们如何确保 测试你使用的每种语言

这么做 你需要使用可访问性标识符 这些标识符都是特殊的 稳定的 我们会保证能在任意语言 环境下进行你的测试

它们配置起来简单 在代码中设置相同名字的属性

如果你使用了界面构建器 创建你的UI元素 你能在标识符检查器定义它们

这样就可以了 所以 现在 你的本地化测试 很容易 我们来看看你如何使用它们来 创建本地化截图

我在之前的测试计划中提到过 你能创建多个配置

在每个配置中 你能设置一个不同的语言 和一个不同的地区来运行你的测试

接着 启用本地化截屏幕选项 在UI测试部分 你的屏幕截图将持续 你能用它们做很多事情

在模式编辑器里 有这些选项 我们已经知道如何使用 以防你还没在测试计划中标注它

现在你的测试设置完成 可以开始本地化截屏了 我们来看看如何使用它们 它们是很棒的扩展市场的资源 你可以发送它们给市场团队 或甚至上传至App Store 来展示你最新的设计

你可以在你的文档或 你的教程中使用它们

但是 最重要的是 它们能帮你的本地化工具 获取它们需要的内容 给你提供高质量的本地化

我们来快速看一个例子

一个简单的词语 比如英文中的start 它有作为动词开始的意思 它也可以是一个名词 表示一个事件的开始 在英文中 这个差异可能很细微 但它在其他语言本地化过程中 会产生很大的差异

这里 我们知道它是一个名词 因为它表示了开始的日期

根据本地化工具中的视觉内容 我们减少了歧义 来保证你得到了最准确地本地化翻译

去年 我们介绍了 Xcode的本地化目录

它是基于一个地方的资源 处理本地化字符串和非字符串 的一个非常通用地方法

在里面 我们包含了Notes目录 特别是包含了你的上下文信息 比如你本地化工具的截屏

今年 我非常高兴 我们支持在Xcode本地化目录 中自动地为你包括这些截图

所有的这些 你只需在你 使用过的导出本地化 工作流中点击一下

如果你使用自动化 创建你的本地化目录 你只需简单地添加 IncludeScreenshots参数 至你的xcodebuildexportLocalizations 命令中

你也能自定义导出的截屏 我们为你简化了指定测试目标 设备和导出至本地化目录中的语言

但你的本地化工具要通过很多个 截图来查看UI上展示的字符串 所以 我们创建的每个本地化截图 都有一个 metadata.plist 映射至截图上确定位置上的字符串

这个文件包括了字符串的ID 你能在xliff找到 还有框架构造 就是截图中字符串的具体位置 这让本地化工具能简单地 映射字符串到xliff 并直接在截图上高亮它们

只要你导出了你的本地化目录 这个新内容就在Notes目录下被 有序地组织起来了 这个metadata.plist 为了测试目标和设备 合并为了一个 在Xcode 11和测试计划直接 使用本地化截图非常简单

我想请Vivian回到舞台 来向你们展示如何操作

谢谢Arthur 现在我们已经本地化我们的app了 我们想要测试本地化功能

好的 我已经为我的项目 创建了一些UI测试 我这里有一些 它们会截取我所有的屏幕 我觉得会对我的本地化 工具理解上下文非常有用 我有另一个测试 它是zip文件 我觉得会对扩大市场有用的 一些旅行指南图片

但我想在我支持的所有本地化 中运行所有的测试 它会耗费一些时间 测试计划这时就很有用了 你能在你的项目中的任何文件 添加一个测试计划 文件 新建 文件 这里有它可以使用的一个模版 我只需搜寻计划 在这里 你也能将你已有的测试 移动到测试计划中 为了节省时间 我已经做了一个 那么 我们来看看

好的 我这里有两个测试目标 我有一个能运行我所有的截图测试 另一个能截取市场需要的图片 我也设置了一些配置 这里最重要的是在分享设置中 启用本地化截屏

我已经配置了一个英文 美国 另一个瑞典语 瑞典 因为我已经得到了一些法语图片 我也添加一个法语 点击加号 我们称它为一个法语 法国

好的 我们设置app语言为法语 app的地区为法国 好的 现在 我来重新运行测试 来获得市场图片 我得到了一张新的本地化法语图片

我回到UI测试来运行它 现在 当我点击测试方块 它不会只运行我的测试一次 取而代之的是 它会使用我的配置来运行 我们能看到它 通过了所有的这些测试 它将会运行三次 英语 接下来是瑞典语 除非我的本地化工具没有完成 我们将会再一次看到一些英文字符串 接下来 最后一次是法语

我知道它会运行 因为我使用了Arthur提到的 可访问性标识符 所以我的测试会运行 所有配置的这三种语言 好的 我们再来一次

法语 好的

那么 我们看看我们得到了什么

如果我查看我刚才跑过的测试 好的 我能看到它在运作 在我的配置中 如果我检查法语 查看我的附件 很棒 所以 我用这一张作为市场宣传

但是我的本地化工具还等着 瑞典语的更新 这样它们就能结束了 所以我需要发送给它们一个新的 Xcode本地化目录 以及我想确认 它们能将棘手的“开始”字符串 处理正确 那么 我们来让它们获得一张截图 我早些时候运行过我的测试 让它来截取我所有的屏幕 那么 我来看瑞典语的这张

我们来看看能否找到 诡异的“开始”字符串 我觉得它在这里 是的 在这 好的 它们没有翻译开始或结束 以及旅行者 这里 我得到的包含框架信息的文件 应该会很有用 所以 现在我准备导出 一个Xcode本地化目录 选择项目 来到编辑器 导出本地化 这次 我来运行瑞典语 最重要的是 我会点击包含截屏 好的 Xcode找到了 19张可用的截屏 我们来看一下我们得到了什么 如果我点击自定义 我能看到我在iPhone 8 Plus 10R和10S跑过的测试 所以 如果有截取的 任何布局的问题 好的 我会保留所有这些

现在 我来导出

好的

现在 如果我来看我新的

本地化目录

现在在Notes目录下 我有截图 我能在这看到由测试目标和设备 组织的所有的截图 事实上 我将取出等下市场需要的 将剩余的发送至我的本地化工具

那么 我们看一下这里 我们看到我所有的截图都在这

好的 这是怪异的“开始”字符串 还有比开始更糟糕的 你看一下这张截图 这些字符串 预订 一 二 三次 所以 plist文件的 帧信息将会很有用 这就是合并的plist文件 它包含所有字符串的帧信息 截取了整个组的屏幕 所以 它们非常好用因为 现在当我在本地化工具里 我打开我最喜欢的本地化工具目录

现在 我能预览字符串在哪出现

我不仅能看到一个地方的字符出现了 它还会向我展示 截取到图片中的所有已知字符串

所以 我的本地化工具将会很开心

好的 我们来总结一下

今天我们看见了 用户能在你的app中 运行和系统不一样的语言 我们了解了Xcode中 本地化工具的很多提升改进的功能 包括更快地导出界面构建器文件 一则新的 stringsdict规则 本地化你的设置包是多么简单 以及 当然 如何在你的资产目录下本地化图片

以及如何在测试中 创建本地化截图 和一些截图的用途

了解更多的信息 请在developer.apple.com 访问我们的页面 如果你有任何疑问 你可以之后在实验室找到我们 谢谢大家 祝大家接下来的议程愉快