はじめに

インストール

AIアシストセットアップを使ってプラグインをインストールできます。以下のコマンドで、お使いのAIツールに Capgo スキルを追加してください：

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

次に、以下のプロンプトを使用します：

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

手動セットアップを希望する場合は、以下のコマンドでプラグインをインストールし、下記のプラットフォーム別の手順に従ってください：

1. パッケージをインストール

   npm i @capgo/capacitor-auto

2. ネイティブプロジェクトを同期

   npx cap sync

3. ルートのcarテンプレートを設定

   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. carアクションを処理

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

5. 接続状態を追跡

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

クイックスタート

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

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

例: setRootTemplate

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

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

例: setState

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

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

よくある落とし穴

• リスナー: 画面のアンマウント時にハンドルを削除してください。
• ネイティブ同期: 実行 npx cap sync プラグインのアップグレード後。
• 信頼できる情報源: 信頼する src/definitions.ts GitHub リポジトリ内に

車載UIはポリシーによって制御されます

CarPlayやAndroid Autoでは、任意のWebViewミラーリングは許可されていません。車内での操作は簡潔かつ安全に行い、AppleやGoogleによって承認されたアプリカテゴリに準拠させてください。

空の状態

設定 emptyText テンプレートにデータがない場合：

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

Bridgeメッセージの送信

使用するのは sendMessage アプリケーション定義のネイティブBridgeメッセージについて：

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

プラットフォームの設定

• 詳細は以下の iOSセットアップ ページでCarPlayのシーンとentitlementに関する注意点を確認してください。
• 詳細は以下の Androidセットアップ Android Auto カテゴリとマニフェストに関する注意事項のページです。

Getting Started から続ける

以下を使用している場合： はじめに ネイティブプラグインの作業を計画するには、それを以下と連携させる @capgo/capacitor-auto の使用方法 @capgo/capacitor-auto を使用したネイティブ機能について Capgo プラグインディレクトリ Capgo プラグインディレクトリでのプロダクトワークフロー向けに、 Capgo による Capacitor プラグイン Capgo による Capacitor プラグインの実装詳細については、 プラグインの追加・更新 実装の詳細は Adding or Updating Plugins を、 Ionic Enterprise プラグインの代替案 製品ワークフローは Ionic Enterprise Plugin Alternatives を参照してください。