Per iniziare

Installazione

Puoi usare il nostro setup assistito dall'IA per installare il plugin. Aggiungi le skill Capgo al tuo strumento di IA usando il seguente comando:

npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Poi usa il seguente prompt:

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-auto` plugin in my project.

Se preferisci la configurazione manuale, installa il plugin eseguendo questi comandi e segui le istruzioni specifiche per piattaforma qui sotto:

1. Installa il pacchetto

   npm i @capgo/capacitor-auto

2. Sincronizza i progetti nativi

   npx cap sync

3. Imposta il template auto principale

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

4. Gestisci le azioni dell'auto

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

5. Monitora lo stato della connessione

   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);
   });

Avvio rapido

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

const result = await Auto.isAvailable();
console.log(result);

Esempio: setRootTemplate

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

await Auto.setRootTemplate({
  title: 'Hello from Capacitor',
  sections: [
    {
      items: [
        {
          id: 'id-123',
          title: 'Hello from Capacitor',
        },
      ],
    },
  ],
});

Esempio: setState

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

await Auto.setState({
  key: 'key-123',
  value: {},
});

Errori comuni

• Listener: rimuovi gli handle quando gli schermi vengono smontati.
• Sync nativo: esegui npx cap sync dopo gli aggiornamenti dei plugin.
• Fonte di verità: fidati src/definitions.ts nel repo GitHub.

Le UI per auto sono soggette a policy

CarPlay e Android Auto non consentono il mirroring arbitrario di WebView. Mantieni le azioni in auto brevi, sicure per il conducente e coerenti con la categoria di app approvata da Apple o Google.

Stato vuoto

Imposta emptyText quando il template non contiene righe:

await Auto.setRootTemplate({
  title: 'Garage',
  emptyText: 'No actions are available right now.',
  sections: [],
});

Invia messaggi al bridge

Usa sendMessage per i messaggi del bridge nativo definiti dall'app:

await Auto.sendMessage({
  type: 'status',
  payload: { online: true },
});

Configurazione della piattaforma

• Segui la Setup iOS pagina per le note su CarPlay scene ed entitlement.
• Segui la Configurazione Android Pagina per la categoria Android Auto e note sul manifest.

Continua da Getting Started

Se stai usando Per iniziare per pianificare il lavoro sui plugin nativi, collegalo a Utilizzo di @capgo/capacitor-auto per la funzionalità nativa in Utilizzo di @capgo/capacitor-auto, Directory dei plugin di Capgo per il workflow del prodotto nella Capgo Plugin Directory, Plugin Capacitor di Capgo per i dettagli di implementazione in Capacitor Plugins di Capgo, Aggiunta o aggiornamento dei plugin per i dettagli su come aggiungere o aggiornare i plugin, e Alternative ai plugin Ionic Enterprise per il workflow del prodotto in Alternative ai plugin Ionic Enterprise.