Mit @capgo/capacitor-auto

@capgo/capacitor-auto verbindet eine Capacitor-App mit genehmigten CarPlay- und Android-Auto-Vorlagenoberflächen. Ihre App sendet eine kleine Liste von Vorlagen an den Fahrzeugdisplay, und der Fahrzeugdisplay sendet ausgewählte Aktionen zurück an JavaScript.

Es ist für sicherheitsrelevante, durch Richtlinien gesteuerte Workflows konzipiert. Es spiegelt Ihren WebView nicht in das Auto.

Installieren und synchronisieren

npm install @capgo/capacitor-auto
npx cap sync

Eine Vorlage an das Auto senden

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' },
        },
      ],
    },
  ],
});

Fahreraktionen abrufen

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

Zustand der Verbindung überwachen

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-Anforderungen

CarPlay erfordert eine von Apple genehmigte Berechtigung für Ihre App-Kategorie. Fügen Sie die CarPlay-Szenenkonfiguration hinzu, wie sie in den iOS-Einrichtungsanleitungen beschrieben ist und halten Sie Ihre Fahrzeug-UI innerhalb von Apple-genehmigten Vorlagen.

Android-Anforderungen

Android Auto verwendet die AndroidX Car App Library. Der Plugin enthält ein CarAppServiceerklärt die template Fähigkeit und verwendet standardmäßig die IOT Kategorie. Überprüfen Sie die Android-Einrichtungsanleitungen wenn Ihre App eine andere Android Auto-Kategorie benötigt.

Entwurfshinweise

Verwenden Sie die Fahrzeugoberfläche für kurze, vorhersehbare Aktionen:

Statuszeilen
Einzeltastenbefehle
Fahrer-sichere Bestätigungen
Einfache Zustandsübergabe vom Telefon-App

Halten Sie komplexe Flüsse in der Telefon-UI und verwenden Sie carAction Ereignisse als native Intent-Auslöser.

Halten Sie weiter bei Verwendung von @capgo/capacitor-auto

Wenn Sie @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-auto verwenden Using @capgo/capacitor-auto @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-auto Für die Implementierungsdetails in @capgo/capacitor-auto, for the implementation detail in @capgo/capacitor-auto, Für die Implementierungsdetails in Anleitung zum Starten, Verwendung von @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-live-activities Verwendung von @capgo/capacitor-live-activities Für die native Fähigkeit in @capgo/capacitor-live-aktivitäten, @capgo/capacitor-live-aktivitäten Für die Implementierungsdetail in @capgo/capacitor-live-aktivitäten und Mit @capgo/capacitor-video-player Für die native Fähigkeit in Mit @capgo/capacitor-video-player.

Auto

Anleitung zu Auto