使用 @capgo/capacitor-auto

@capgo/capacitor-auto 连接一个 Capacitor 应用到已批准的CarPlay和Android Auto模板表面。您的应用发送一个小型列表模板到汽车显示屏，汽车显示屏发送选定的动作回JavaScript。

它是为安全驾驶、政策控制的工作流程而设计的。它不会将您的WebView镜像到汽车中。

安装和同步

npm install @capgo/capacitor-auto
npx cap sync

发送模板到汽车

import { Auto } from '@capgo/capacitor-auto';

await Auto.setRootTemplate({
  title: 'Garage',
  sections: [
    {
      header: 'Doors',
      items: [
        {
          id: 'open-main-door',
          title: 'Open main door',
          subtitle: 'Tap to send the action to the phone app',
          payload: { doorId: 'main' },
        },
      ],
    },
  ],
});

监听驾驶员动作

await Auto.addListener('carAction', async (event) => {
  if (event.id === 'open-main-door') {
    await openGarageDoor(event.payload?.doorId);
  }
});

监视连接状态

const status = await Auto.isAvailable();
console.log(status.available, status.connected, status.platform);

await Auto.addListener('connectionChanged', (event) => {
  console.log('Car connected:', event.connected, event.platform);
});

iOS要求

CarPlay需要为您的应用类别获取苹果批准的特权。添加CarPlay场景配置，描述在 iOS设置文档并且保持您的车载UI在Apple批准的模板中。

Android要求

Android Auto使用AndroidX Car App Library。该插件包含一个 CarAppService, 声明了 template 能力，并默认为 IOT 类别。查看 Android设置文档如果您的应用需要另一个Android Auto类别。

设计指南

在车载面板上使用短、可预测的动作:

状态行
一键命令
驱动安全确认
从手机应用中简单地传递状态

将复杂的流程保留在手机UI中，使用 carAction 事件作为本机意图触发器。

继续使用@capgo/capacitor-auto

如果您正在使用 使用@capgo/capacitor-auto 来规划本机媒体和界面行为，连接它与 @capgo/capacitor-auto 的实现细节在@capgo/capacitor-auto中开始使用为 Getting Started 中的实现细节使用 @capgo/capacitor-live-activities 为使用 @capgo/capacitor-live-activities 中的原生能力 @capgo/capacitor-live-activities 为 @capgo/capacitor-live-activities 的实现细节，以及使用 @capgo/capacitor-video-player 为使用 @capgo/capacitor-video-player 中的原生能力

自动

Auto 教程