ガイド
Capacitor で Auto を使用する方法
@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承認済みのentitlementが必要です。以下の iOSセットアップドキュメントに従って CarPlay sceneの設定を追加し、車両用UIはApple承認済みのテンプレート内に収めてください。
Androidの要件
Android AutoはAndroidX Car App Libraryを使用します。このプラグインは CarAppServiceを含み、 template 機能を宣言し、デフォルトで IOT カテゴリに設定されます。詳細は Android セットアップドキュメント アプリに別の Android Auto カテゴリが必要な場合。
デザインガイドライン
短く予測可能な操作には、車載画面を使用してください：
- ステータス行
- ワンタップコマンド
- 運転中でも安全な確認操作
- スマホアプリからのシンプルな状態引き継ぎ
複雑なフローはスマホのUIで行い、 carAction イベントをネイティブの Intent トリガーとして使用します。
「Using @capgo/capacitor-auto」から続ける
使用している場合 @capgo/capacitor-auto の使用方法 ネイティブメディアとインターフェースの挙動を計画するには、次と連携させてください @capgo/capacitor-auto @capgo/capacitor-auto の実装詳細については、 スタートガイド スタートガイドの実装詳細については、 @capgo/capacitor-live-activities の使用 @capgo/capacitor-live-activities の使用におけるネイティブ機能については、 @capgo/capacitor-live-activities @capgo/capacitor-live-activities の実装の詳細については、 @capgo/capacitor-video-playerの使用方法 「@capgo/capacitor-video-player. の使い方」のネイティブ機能については