使用 @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需要您的应用类别获得Apple批准的特权。添加CarPlay场景配置，描述在 iOS设置文档并将您的汽车UI保持在Apple批准的模板中。

Android 需求

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

在汽车面板上使用短、可预测的动作：

状态行

一键命令
驾驶员安全确认
Android Auto 使用 AndroidX Car App Library。该插件包含一个 AndroidX Car App Library 的依赖项，声明了 Android Auto 的能力，且默认为 Android Auto 类别。查看 Android 设置文档，如果您的应用需要另一个 Android Auto 类别。
简化手机应用与本地应用之间的状态传递

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

继续使用@capgo/capacitor-auto

如果您正在使用 使用@capgo/capacitor-auto 来规划本地媒体和界面行为，连接它与 @capgo/capacitor-auto 来实现@capgo/capacitor-auto中的细节 Getting Started 来实现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教程