27、打造全球化与无障碍的移动应用及拓展 Apple Watch 支持

最新推荐文章于 2025-11-23 03:35:39 发布

肥宅快乐水901

最新推荐文章于 2025-11-23 03:35:39 发布

阅读量10

点赞数

CC 4.0 BY-SA版权

分类专栏： Swift实战：跨平台应用开发文章标签：全球化本地化国际化

本文链接：https://blog.youkuaiyun.com/websocket5live/article/details/155143386

Swift实战：跨平台应用开发专栏收录该内容

31 篇文章 ¥499.90

订阅专栏¥69.90

会员秒杀 ¥9.9 重磅福利

超级会员免费看

打造全球化与无障碍的移动应用及拓展 Apple Watch 支持

1. 应用运行与图像查看

运行应用时，查看图像附件，其下方会显示三个不同版本的图像。点击这些版本，可查看经过过滤的更大尺寸图像。

2. 全球应用支持

并非所有用户都使用同一种语言，开发者应让应用支持多语言，这主要包括国际化和本地化两个部分。
- 国际化
- 概念：为应用的本地化做准备，将应用中的文本与应用本身分离，在运行时根据用户语言偏好加载面向用户的语言资源，并调整用户界面以适应不同长度的文本。同时，要考虑文本显示方向（从左到右或从右到左）。
- 任务：
- 用加载本地化文本的方法调用替换代码中的所有文本。例如在 Notes 应用中，打开 DocumentViewController.swift ，在 addAttachment 方法顶部将设置标题的代码替换为：

let title = NSLocalizedString("Add attachment", comment:"Add attachment title")

NSLocalizedString 函数有两个参数，第一个是键，指示系统所需的字符串；第二个是注释，向翻译人员解释字符串的用途。该函数会在应用中搜索针对用户当前语言的字符串表，若找到键对应的条目则返回该字符串，否则返回键字符串。
- 测试和调整界面，以支持应用文本宽度与开发语言不同的情况。Xcode 提供了双长度伪语言和从右到左伪语言测试选项：
1. 打开 Product 菜单，选择 Scheme→Edit Scheme。
2. 进入 Run 部分，选择 Options 标签。
3. 打开 Application Language 菜单。
4. 选择 Double Length Pseudolanguage 或 Right to Left Pseudolanguage。
5. 点击 Close 并运行应用。

以下是国际化步骤的 mermaid 流程图：

graph LR
    A[开始] --> B[分离文本与应用]
    B --> C[使用NSLocalizedString替换文本]
    C --> D[测试界面]
    D --> E[选择伪语言测试]
    E --> F[运行应用]
    F --> G[结束]

本地化
- 准备工作 ：添加新的 Strings 文件，命名为 Localizable.strings 。
- 本地化步骤 ：
  1. 选择 Localizable.strings 文件，在 File Inspector 中点击 Localize 按钮，选择 Base 并点击 Localize。
  2. 前往 Project info 页面，在 Localizations 列表中点击 + 按钮，选择 “French (fr)”，点击 Finish。
  3. 打开 Localizable.strings (Base) 文件，添加 "Add attachment" = "Add attachment"; 。
  4. 打开 Localizable.strings (French) 文件，添加 "Add attachment" = "Ajouter une pièce jointe"; 。
  5. 打开 Product 菜单，选择 Scheme→Edit Scheme，进入 Run 部分的 Options 标签，将 Application Language 改为 French，关闭窗口并运行应用，测试本地化效果。

3. 无障碍访问支持

不同用户的视力和阅读能力不同，iOS 和 macOS 支持 VoiceOver 屏幕阅读器。应用的组件（按钮、标签等）已基本支持 VoiceOver，但需测试应用对视力障碍用户的可用性。
- 设置 VoiceOver ：
1. 打开 iOS 设备的 Settings 应用。
2. 进入 General→Accessibility→Accessibility Shortcut。
3. 打开 VoiceOver 并关闭其他功能。
4. 打开应用，三次点击主页按钮开启 VoiceOver。
- 解决访问问题 ：若测试中发现无法打开文档，需为文档单元格提供无障碍信息：
1. 打开 Main.storyboard ，进入文档列表视图控制器。
2. 找到文档集合视图中的 FileCell 。
3. 选择包含图像视图的视图。
4. 进入 Identity Inspector，滚动到 Accessibility 部分，选择 Accessibility Enabled、User Interaction Enabled 和 Button 复选框。
5. 重新运行应用。

在 iOS 模拟器中，可通过打开 Settings 应用中的 General→Accessibility→Accessibility Inspector 进行类似测试。

4. 分屏多任务支持

在特定硬件（如 iPad Air 2、iPad Mini 4 和 iPad Pro）上，可通过从屏幕右侧滑动选择应用来实现分屏多任务。由于应用使用了约束，界面会自动适应分屏布局。

5. 构建 watchOS 应用

要构建 watchOS 应用，必须同时构建和分发 iOS 应用，因为 watchOS 应用通过用户安装在 iPhone 上的应用提供给绑定的 Apple Watch。watchOS 与 iOS 有很多相似之处，我们将扩展 Notes 应用以支持 Apple Watch。
- 手表设计考虑
- 物理约束 ：
- 屏幕极小，限制了同时显示的内容量和用户交互区域。
- 触摸屏幕会遮挡大量可见内容，需使用 Digital Crown 滚动屏幕。
- 设备戴在手腕上，移动不够精确，用户可能同时进行其他活动，增加了操作难度。
- 技术约束 ：手表功率低，依赖与 iOS 设备的通信。

以下是构建 watchOS 应用需考虑因素的表格：
| 约束类型 | 具体约束 |
| ---- | ---- |
| 物理约束 | 屏幕小、触摸遮挡内容、设备移动不精确 |
| 技术约束 | 低功率、依赖通信 |

打造全球化与无障碍的移动应用及拓展 Apple Watch 支持

6. 设计 watchOS 应用的要点

在设计 watchOS 应用时，需充分考虑 Apple Watch 的特点，从视觉和软件层面进行优化。
- 利用 Glances 功能 ：Glances 是 watchOS 提供的一种快速查看应用关键信息的方式。用户无需打开整个应用，就能在一瞥之间获取所需数据。设计时，应突出最核心、最有价值的信息，确保在有限的屏幕空间内清晰展示。例如，对于 Notes 应用，可展示最新笔记的标题或摘要。
- 优化通信机制 ：watchOS 应用依赖与 iOS 应用的通信来获取数据。因此，要确保通信的高效性和稳定性。可以采用后台传输、数据缓存等技术，减少用户等待时间。例如，定期在后台同步笔记数据，当用户打开应用时能快速获取最新内容。

以下是设计 watchOS 应用的关键要点列表：
- 突出 Glances 关键信息
- 优化与 iOS 应用的通信
- 确保界面简洁易懂

以下是设计 watchOS 应用的 mermaid 流程图：

graph LR
    A[开始设计] --> B[确定 Glances 信息]
    B --> C[优化通信机制]
    C --> D[设计简洁界面]
    D --> E[测试与优化]
    E --> F[完成设计]

7. 构建简单 watchOS 应用的步骤

接下来，我们将通过具体步骤构建一个简单的 watchOS 应用，以 Notes 应用为例。
1. 创建项目 ：在 Xcode 中，选择创建新的 watchOS 项目，并关联已有的 iOS 应用。
2. 设计界面 ：根据 Apple Watch 的屏幕尺寸和交互方式，设计简洁直观的界面。可以使用 Interface Builder 进行可视化设计，添加必要的控件，如按钮、标签等。
3. 实现功能逻辑 ：编写 Swift 代码实现应用的核心功能。例如，从 iOS 应用获取笔记数据并展示在 watchOS 应用中。以下是一个简单的代码示例，用于获取笔记标题：

import WatchKit
import Foundation

class InterfaceController: WKInterfaceController {
    @IBOutlet weak var noteTitleLabel: WKInterfaceLabel!

    override func awake(withContext context: Any?) {
        super.awake(withContext: context)
        // 模拟从 iOS 应用获取笔记标题
        let noteTitle = "Sample Note Title"
        noteTitleLabel.setText(noteTitle)
    }
}