利用 CarPlay 车载让您的 App 一日千里

大家好 欢迎来到 “利用 CarPlay 车载让您的 App 一日千里” 我是André 今天的讲座将由我为大家介绍

众所周知 CarPlay 车载是在车内使用 iPhone 更智能 更安全的方式 今天的讲座主要是关于您的 App 如何在 CarPlay 车载中使用 首先 我们将快速回顾一下 CarPlay 车载所支持的 App 类别 然后 谈谈我们今年正在启用的 新的 App 类别 最后 介绍一个支持 App开发的新工具 并以导航 App 的重要新功能 作为今天的收尾 话不多说 我们开始吧

为驾驶员而设计是 CarPlay 车载 最基础的特性之一 在开发您的 App 时 应该首要考虑 经常开车人群的需求 因此 驾驶相关的使用场景 是唯一需要考虑的 与驾驶无关的使用场景 都应忽略 如一次性配置 登录 App 或阅读条款 最好都在驾驶前后完成 而不应出现在您 App 的 CarPlayUI 界面中

App 在 CarPlay 车载中显示 需要获得相应的资质 您可以在 Apple CarPlay 车载 开发者网站上 根据 App 的类别申请资质 这是我们目前 CarPlay 车载中 支持的 App 类别 这些 App 涵盖了大多 驾驶期间可能会执行的操作 但很多用户反馈 希望有更多驾驶相关的 App 我在此宣布 我们今年 将增加两种新的 App 类别 加油和驾驶任务 App 我们稍后会详细讨论这些内容 但首先 我们先谈谈开发模板 开发模板决定了 CarPlay 车载中 App 的 UI 界面如何呈现 您的 App 提供数据 系统负责把 UI 绘制到 车辆显示屏上 这个模板的系统使用简便 并且有很多好处 包括帮助改善您的 App 使其更适用驾驶场景 您不必担心字体大小等问题 模板可帮助你们 建立简单的 UI 及最后确保您 App 的 UI 与 CarPlay 车载中其它 App 一致 使用户在需要时 操作更快捷 这些模板可确保 App 的 UI 在所有支持 CarPlay 车载的 车型上正常运行 这也是同样重要的一点 无论汽车搭载的输入设备 是哪种屏幕类型 您可能还想在不同的配置中 测试自己的 App 我们稍后将会讨论更多 关于测试的内容 但可以说 开发模板 已为您做了大部分的工作 在构建 App 时 有多个模板可供选择 从数组按钮形式的网格模板 到表格形式的列表模板 开发人员和 iOS 用户 应该都很熟悉了 最重要的是 这些模板 与整个 CarPlay 车载系统一致 您的用户也了然于心 之前我们谈到了 CarPlay 车载 所支持 App 的类别 有些模板与特定类别的 相关性更高 此图表可帮助您了解 根据您 App 的类别 可以选择哪些模板 我知道这表格看起来 像 DMV 视力表 不过不用担心 您可以在我们的在线开发者文档中 找到这个表格 这里需要注意的是 App 可以使用的模板 取决于它的类别 仅允许使用与 App 类别相关 且适用的模板 现在我们已经讨论了模板 我们再来仔细看看 iOS16 推出的新 App 类别 首先看下新的加油 App

在 iOS14 中 我们推出了 支持电动汽车充电的 App 这些 App 不仅可查找 电动汽车充电站的位置 它们的功能还不止于此 例如 它们可帮助用户连接到 正确的充电站并启动充电 我们听许多开发人员说 这种类型的功能将 不仅适用于电动汽车 无论是传统的汽油车 还是替代燃料汽车 这个新类别都可以让您的 加油 App 支持 CarPlay 车载 许多用户使用导航 App 来查找 并驾驶到特定的位置 因此您的加油 App 应在 其 CarPlayUI 中启用更多功能 而不仅仅是查找位置 关于 App 可以启用的功能 其中一个很好的例子 就是启动加油 现在 我们谈谈驾驶任务 App 驾驶任务是一款新型 CarPlay 车载 App 旨在支持各种非常简单的App 请记住 这些 App 的主要目的 必须是实现人们 驾驶时需要完成的操作 要对驾驶有实际帮助 而不仅是一项任务

这类 App 包括帮助 控制汽车配件的应用 提供驾驶或道路 状态和信息的应用 以及帮助完成驾驶前后 操作的应用 让我们看一些更具体的例子

首先 我们有一个路况 App 可以通知用户 重要的道路信息 这个应用程序是使用 CPPointOfInterestTemplate 搭建的 请记住 使用此 App 的用户正在驾驶 因此这样的 App 应在 用户位置附近提供 非常简短的重要项目列表 这并不是帮助用户在驾驶前 做完整的路线规划

在这个 App 中 这是用户 在选择位置时看到的内容 要注意控制文本长度 从而信息可以一目了然 因此 此处语言应尽量简洁

接下来 我们看一个 控制汽车配件的App 在这个案例中是 该 App 使用 CPInformationTemplate 提供所连接配件的基本信息 以及供用户操作的几个按钮 注意 在本例中 这是 App 在 CarPlay 车载中的整个UI 没有其它画面了 当然 这款 App 还有 很多其它功能 比如管理配对的附件 但任何驾驶无关的功能 都不包括在该 App 的 CarPlay UI 中 用户下车时 最好在 iPhone 上使用 该 App 主 UI 进行 非驾驶相关任务

最后 让我们看几个 使用 CPGridTemplate 的例子 这是一个极其简单的 App 只有两个按钮 其它没了 用户可以记录 个人或商务里程 这款 App 完全符合 新的驾驶任务 App 类别 因为它让用户可以在驾驶时 执行所需的非常简单操作 而无需启用任何其它 非关键操作 简单 切中要害 通过该例可以看到 这种风格的 UI 可以服务于多种类别的 App 这里有另一个例子 它的 UI 基本一样 这是一个快速通道 收费应答器 App 使用 CPGridTemplate 用户可选择车内有多少乘客 它与前面案例的目标完全相同 是另一个完美的驾驶任务 App

简而言之 在设计驾驶任务 App 时 一定要考虑制作单屏 App 可供用户进行驾驶期间 最少的必要操作 且在数秒内就能完成 应该避免启用复杂 或不常见的使用场景 一个很好的例子就是 首次设置或详细配置 最后 您的 App 不应 添加驾驶时不需要的功能 即使是与汽车有关的 这不是大杂烩 以上就是驾驶任务 App 现在我们换一个话题 谈谈如何测试 CarPlay 车载 App 我们将回顾当前的 不同测试方式 之后我会介绍一个新的工具 CarPlay 车载模拟器 开发人员可以使用 不同的工具测试 支持 CarPlay 车载的 App 首先 大家可以使用内置 CarPlay 车载 窗口的 Xcode 模拟器 如果您已经在使用 Xcode 模拟器 来测试其它 App 这也是快速测试 CarPlay UI 的 好方法 其次 如果您想在实际的 iPhone 上 测试自己的 App 当然可以把自己的手机连接到 支持 CarPlay 车载的车辆 或售后市场车载主机 直到最近 这还是在 iPhone 上 测试 CarPlay UI 中 运行 App 的唯一方法 但我很高兴地告诉您 我们现在为提供了第三种选择 可能会成为大家最倾向的选择 CarPlay 车载模拟器 我们详细了解下 这是什么呢 CarPlay 车载模拟器是一个 独立的 Mac 应用程序 可以复制一个 CarPlay 车载环境 您只需在 Apple 开发者网站上下载 “Additional Tools for Xcode”套件 运行 App 然后用数据线连接您的 iPhone 和 Mac CarPlay 车载将在手机上 启动并运行 和连接到真正的汽车上一样 这有什么特别的呢 为什么要用这个模拟器呢 有以下几个好处

首先 使用 CarPlay 车载模拟器时 CarPlay 车载在 iPhone 上运行的方式 和在汽车上一样 这意味着您可以在手机上 测试自己 App 而不需要经常往返于停车位 或购买售后车载主机 另一个好处是 当使用 CarPlay 车载模拟器时 您的手机与 Mac 连接 您可以同时使用 Mac 上 所有其它强大的开发人员工具 无论是在 Xcode 中调试 还是在 Instruments 中调整性能 在 iOS 方面也是如此 因为您的 App 是在真正的 iPhone 上运行的 所以可以访问完整的 iPhone 功能 如果没有真正的 CarPlay 车载系统 或者现在的 CarPlay 车载模拟器 有些场景是无法测试的

一个很好的例子是测试 导航 App 的语音指令 是否与汽车的原生音频源正确融合 如 FM 收音机 现在 您可以在办公桌上 方便地进行测试

最后 您还可以使用 CarPlay 车载模拟器 来测试多种不同配置的汽车 例如不同显示尺寸的汽车 我们来看看 CarPlay 车载模拟器 是怎么运行的 好了 如您所见 连接 iPhone 的 CarPlay 车载显示屏 与几个控制按钮一起 出现在 App 中 我们来看看有什么功能 屏幕底部是模拟汽车中 各种快捷键和控制旋钮

您也可以在 CarPlay 车载视图中 直接点击 来模拟触摸屏车辆

在窗口顶部有一些快捷控制 仅有的几个 UI 按钮 可以模拟汽车行驶过程中 CarPlay 车载显示的限制 例如 可以缩短音频 App 中的 列表内容

接下来的两个按钮分别用于 模拟汽车何时请求 UI 和地图外观颜色的深浅

最后一个按钮可以快速模拟 手机与 CarPlay 车载的 断开和重连 因为当你们使用这个按钮时 手机仍然与 Mac 保持连接 您可以用它在 App 中 使用Xcode 调试 CarPlay 车载重连的场景

但我刚刚跳过的 第一个按钮是什么呢 您可能已经猜到了 这将弹出一个 高级功能的辅助窗口 我们来看看有哪些高级功能

在 General (常规) 选项卡中 您可以选择 CarPlay 车载的显示尺寸 如果您的 App UI 仅由模板组成 那可以尝试不同尺寸的 UI 查看该 UI 在不同的汽车中 如何显示 但正如我们之前谈到的 系统将确保一切正常运行 然而 如果您的 App 是用于导航的 那么尝试不同的尺寸和纵横比 以确保地图绘制代码 正确运行是非常重要的 这里有一些推荐的显示尺寸 可以在 App 中进行测试 我们看看 Cluster Display (群集信息) 选项卡 可以看到 您可以通过 仪表盘中的第二个显示器 来模拟汽车 只需勾选该选项 重新启动会话 就会在主显示屏旁出现 仪表盘的第二个窗口 同样 这是与导航 App 最为相关的 仪表盘显示器用于 在汽车仪表盘可视角度中 为驾驶员显示地图或转向卡 我们稍后会详细了解 关于仪表盘的内容 这里可以快速浏览下 新的 CarPlay 车载模拟器界面 希望您也和我们一样 认为这非常有用 我们刚刚看到 CarPlay 车载 如何在仪表盘中绘制实时地图 但是您的导航 App 呢 如何添加并测试仪表盘 是否支持您的 App 呢 我们一起来看看 你可能还记得 在 iOS 13 中 我们添加了 APIs 使导航 App 显示在 CarPlay 车载仪表盘中 要做到这一点 您需要编辑 App 的 Info.plist 文件 以声明对仪表盘的支持 并进行所需的代理委托 当它在仪表盘中出现和消失时 代理会通知您的 App 并将 UIWindow 传到 App 以在其中绘制地图内容 很简单 如果你已经完成了 那么有一个好消息 添加仪表盘支持将是小菜一碟 因为它遵循完全相同的模式 看看我是如何在我的导航测试 App Space Roads中实现此操作的 我编辑了我的 Info.plist 文件 声明对仪表盘导航场景的支持 并添加了所需的 然后进行了我的 CPTemplateApplicationInstrumentCluster 场景委托 以及我的 CPInstrumentClusterControllerDelegate 这将提供一个窗口 在其中绘制自己的内容 并在仪表盘启动和结束时通知您 使仪表盘视图可见 这就是地图实时显示在 汽车仪表盘中的全部内容 虽然这与实现仪表盘支持非常相似 但还有一些针对仪表盘的注意事项 首先 仪表盘可允许用户 放大或缩小地图 您要负责用 在自己的 App 中实现这一点 类似地 如果您的 App 包含指南针或限速 相应的代理将告知 您的 App 何时适合绘制 最后 注意您的仪表盘视图 可能会被汽车仪表盘中的 其它元素遮挡 当然 iOS 已经有了一流的机制 来处理这类情况 安全区域 您可以覆盖 view controller 上的 viewSafeAreaInsetsDidChange 以了解安全区域的变化 并在仪表盘视图上使用 来保证视图区域中的 关键内容是可见的 例如 如果有一条蓝色的路线 显示用户的位置 就要确保关键部分 在安全区域内 我们为搭建 CarPlay 车载 App 的 开发者启用了一些新功能 有一个测试 App 的新工具 我们来看看它的实际应用 首先 我将从我的 Mac 开始 展示 CarPlay 车载模拟器 App 已运行 我只需连接我的手机

看 它正在运行 CarPlay 车载 我们看看 CarPlay 车载模拟器 如何测试您的 App 即使你们的 App 主要是基于模板 也可以使用它 来确保 App 外观 在深色和浅色背景中都适用 我来运行 Express Lane App

我可以使用工具栏上的按钮 在浅色和深色外观之间切换 我的 App 为这两种风格 提供了不同的视觉效果 看起来不错 现在我们切换到我编写的 导航测试 App Space Roads

我将使用主配置面板 尝试在不同的屏幕尺寸上 绘制地图代码

最后 我将启用仪表盘显示 以测试仪表盘的支持

显示出来了 效果很好 早些时候 我在 CarPlay 车载模拟器中 对我的 App 进行了全面测试 所以现在 我有充分的信心 App 在汽车上能完美运行 我们来试下吧 好了 现在在我的车里 正如你所看到的 我把手机连接到车上 运行 CarPlay 车载

首先 我们试着运行我 连接的Trailer Controller App 这样可以向您展示 模板如何使 App 在启用旋钮的车辆中正常运行

这款车既有触摸屏 也有旋钮控制器 但许多用户喜欢在驾驶时 使用旋钮控制器 所以 App 用旋钮良好运行 也非常重要 如您所见 我的 App 可以正常 使用旋钮操作 最好的是 我不需要其它特别的操作 模板已全部涵盖了

接下来 我们切换到 我的导航 App Space Roads 我们启动 App 开始导航 然后我点击 Go 好了 我的 App 同时在 中控台和仪表盘上 都显示了实时地图视图 实时地图正好在驾驶视线内 真是太棒了 我相信使用您导航 App 的司机 也会喜欢的 好了 这就是我今天的 全部内容 要了解更多信息 请查看 CarPlay 开发者门户网站 developer.apple.com/CarPlay 谢谢你们 祝大家旅途愉快