Discover Quick Look for spatial computing
Spatial Computing 进阶 20m

探索空间计算的 Quick Look

Discover Quick Look for spatial computing

2023年6月5日

在 Apple 官方观看视频

一句话判断

空间计算平台的 Quick Look 支持把文件拖出 App 在独立窗口中预览——3D 模型可以自由缩放放置，甚至支持 SharePlay 协作查看。App 只需要几行代码添加拖拽支持。

这场 Session 讲了什么

Session 介绍了 Quick Look 在空间计算平台上的全新能力。

Windowed Quick Look：

  • 文件可以从 App 中拖出，在独立窗口中预览。
  • 预览窗口与 App 窗口并存，关闭 App 后预览窗口仍然保留。
  • 3D 模型（USDZ/Reality 文件）支持自由缩放和放置。
  • 缩放 3D 模型时环境变暗，其他场景隐藏，专注查看模型细节。
  • 部分 3D 模型支持 SharePlay——在 FaceTime 中共享模型，同步旋转、缩放和动画。
  • 图片共享时支持多人协作 Markup。
  • App 端只需添加 onDrag 修饰符提供 URL，系统自动处理预览。

App 内 Quick Look：

  • 使用 SwiftUI 的 quickLookPreview 函数或 QLPreviewController。
  • 以 sheet 形式覆盖在 App 内容上方。
  • 现有 iOS App 的 Quick Look 代码自动适配空间计算平台。

Web 端 Quick Look：

  • 网站链接标记 rel="ar" 属性，Safari 自动在 Quick Look 窗口中打开 3D 内容。
  • iOS/iPadOS 上已有的 AR Quick Look 支持自动迁移到空间计算平台。
  • 支持自定义选项（如禁用内容缩放）。

文件类型支持：

  • 3D 模型：USDZ、Reality 文件。
  • 图片、PDF（支持 Markup）。
  • 视频等常规文件类型。

值得深挖的点

Windowed Quick Look 的”非阻塞”体验是空间计算平台的核心设计范式之一。在 2D 平台上，打开文件意味着切换到新界面或弹出一个遮盖全屏的模态窗口。在空间计算平台上，文件预览是一个独立的空间窗口——你可以同时看到 App 内容和预览文件，两者互不干扰。这对协作和参考类场景特别有价值。

SharePlay 集成让 3D 模型查看变成协作体验。共享一个 USDZ 模型时，所有参与者看到相同的旋转角度、缩放级别和动画状态。这比屏幕共享更进一步——每个人可以自由调整视角，但模型状态保持同步。对电商场景（“一起看看这个产品”）和教育场景（“大家看这个解剖模型”）都有很大价值。

几行代码接入的设计哲学降低了门槛。App 不需要理解 Quick Look 的渲染管线，只需要在 drag 事件中提供文件 URL。系统负责下载（如果是远程文件）、预览、编辑、分享的全部流程。

代码片段

App 中添加 Windowed Quick Look 支持：

// 给文件视图添加拖拽支持
struct FileView: View {
    let fileURL: URL

    var body: some View {
        // 文件展示内容
        VStack {
            Image(systemName: "doc")
            Text(fileURL.lastPathComponent)
        }
        // 添加拖拽支持——拖出 App 时自动在 Quick Look 窗口中打开
        .onDrag {
            NSItemProvider(object: fileURL as NSURL)
        }
    }
}

App 内展示 Quick Look 预览：

// SwiftUI 中使用 quickLookPreview
struct ContentView: View {
    @State var selectedURL: URL?

    var body: some View {
        FileListView()
            .quickLookPreview($selectedURL)
            // selectedURL 非 nil 时自动展示预览
    }
}

// 或使用 QLPreviewController（更多自定义选项）
// 现有 iOS App 的 QLPreviewController 代码自动适配空间计算平台

Web 端 AR Quick Look：

<!-- 在链接上标记 rel="ar" 属性 -->
<a href="model.usdz" rel="ar">
    <img src="model-thumbnail.jpg" alt="3D 模型">
</a>
<!-- 在空间计算平台上点击链接，Safari 自动在 Quick Look 窗口中打开 3D 模型 -->
<!-- iOS/iPadOS 上已有的 AR Quick Look 支持自动迁移 -->

最佳实践

  • 如果你的 App 展示文件列表，为每个文件项添加 onDrag 支持，让用户可以拖出预览。
  • 电商类 App 优先使用 Windowed Quick Look 展示 3D 产品模型，用户体验比 App 内预览更好。
  • 网站上的 3D 产品模型标记 rel="ar" 属性，覆盖 Safari 用户。
  • 图片和 PDF 支持 Markup 协作，适合团队审阅场景。
  • 远程文件的 URL 直接提供给拖拽——系统自动处理下载，不需要预先缓存。
  • 现有 iOS Quick Look 代码不需要改动，直接迁移到空间计算平台。

还有什么值得关注

  • “Advances in AR Quick Look”（WWDC19）介绍了 AR Quick Look 的自定义选项。
  • “Explore Materials in Reality Composer Pro” 介绍 3D 模型的材质制作。
  • Windowed Quick Look 的编辑（如 Markup）不会写回原始 URL，因为系统处理的是文件副本。
  • 3D 模型缩放到很大时，环境自动变暗以帮助聚焦——这是系统行为，不需要手动实现。
  • Quick Look 同时处理文件安全问题——不需要在 App 中打开不受信任的文件。
WWDC 2023