Build a productivity app for Apple Watch
System & Services 进阶 20m

构建 Apple Watch 生产力应用

Build a productivity app for Apple Watch

2022年6月6日

在 Apple 官方观看视频

一句话判断

如果你想做独立的 watchOS App，这场 Session 用一个完整的待办事项 App 示例，覆盖了从项目创建、列表展示、文本输入、导航结构到图表绘制和 Digital Crown 滚动的全流程。

这场 Session 讲了什么

watchOS 软件工程师 Anne Hitchcock 通过构建一个名为 “Reading Observatory” 的阅读追踪 App，手把手演示了 watchOS 独立 App 的开发要点。

内容涵盖：Xcode 14 中 Watch App 从双 Target 合并为单 Target 的变化；App 图标简化为单张 1024x1024 图片；SwiftUI List 和数据模型的使用；TextFieldLink（watchOS 9 新增）用于文本输入；Watch App 的导航策略选择（层级式 vs 页面式）；通过 ShareLink 和 Transferable 实现内容分享；使用 SwiftUI Charts 绘制趋势图表并用 Digital Crown 滚动。

值得深挖的点

单 Target 时代的到来。 Xcode 14 中新建的 Watch App 只有一个 Target，代码、资源、本地化、Siri Intent 和 Widget 扩展都归在这个 Target 下。这个变化支持回 watchOS 7。已有的双 Target 项目可以用 Xcode 14 的 “Validate Settings” 迁移。

TextFieldLink 是 watchOS 文本输入的新入口。 watchOS 9 新增的 TextFieldLink 让你用一个按钮触发文本输入选项（听写、手写、键盘），支持自定义 Label 和样式修饰符。它不是传统的 TextField，而是一个触发输入的链接按钮。

列表中的操作按钮放置策略。 短列表把操作按钮放在列表末尾（如世界时钟的添加城市按钮）；长列表用 toolbar item，避免用户每次都要滚到底部才能操作。

代码片段

// 使用 TextFieldLink 添加列表项
struct AddItemLink: View {
    @EnvironmentObject var model: TodoModel

    var body: some View {
        TextFieldLink {
            Label("添加任务", systemImage: "plus.circle")
        } onSubmit: { text in
            model.addItem(ListItem(description: text))
        }
    }
}
// Watch App 的导航结构选择
// 层级式导航：列表-详情关系，使用 NavigationStack
struct ContentView: View {
    var body: some View {
        NavigationStack {
            List(model.items) { item in
                NavigationLink(item.description) {
                    DetailView(item: item)
                }
            }
            .toolbar {
                ToolbarItem(placement: .bottomBar) {
                    AddItemLink()
                }
            }
        }
    }
}

// 页面式导航：平级关系，使用 TabView
// 适合数据录入、分步向导等场景
// SwiftUI Charts + Digital Crown 滚动
struct ChartView: View {
    var body: some View {
        ScrollView(showsIndicators: false) {
            Chart(weeklyData) { data in
                BarMark(
                    x: .value("日期", data.day),
                    y: .value("阅读时长", data.minutes)
                )
            }
            .frame(height: 200)
        }
        .focusable()  // 启用 Digital Crown 滚动
    }
}

最佳实践

  • Watch App 的核心原则：快速交互、关键信息易获取、功能聚焦。 不要把 iPhone App 的功能照搬到 Watch 上。
  • Watch-only App 适合功能聚焦、交互快速、数据有限的场景。 需要历史记录、详细分析、大量数据管理的功能应该放在 iPhone 端。
  • 使用 toolbar item 放置常用操作。 自动位置（.automatic）让系统决定最佳放置，通常在列表底部。
  • 迁移到 SwiftUI lifecycle。 如果还在用 Storyboard lifecycle，现在是用单 Target + SwiftUI 的好时机。

还有什么值得关注

  • App 图标现在只需要一张 1024x1024 的图片，系统自动缩放到所有尺寸
  • ShareLink 让 Watch App 首次支持分享功能，配合 Transferable 协议使用
  • watchOS 9 的键盘输入让独立 Watch App 的可用性大幅提升
  • 推荐观看 WWDC 相关的 SwiftUI Charts Session 了解图表功能
WWDC 2022