Zum Hauptinhalt springen
Zurück zu den Plugins
@capgo/capacitor-live-aktivitäten
Anleitung
@capgo/capacitor-live-aktivitäten

Live-Aktivitäten

Verwalten Sie iOS-Live-Aktivitäten und Dynamic Island-Anordnungen mit JSON-getriebenen Vorlagen über Capacitor

Anleitung

Tutorial zu Live-Aktivitäten

Verwendung von @capgo/capacitor-live-aktivitäten

Capacitor-Live-Aktivitäten-Plugin-Interface zur Verwaltung von iOS-Live-Aktivitäten.

Installieren

bun add @capgo/capacitor-live-activities
bunx cap sync

iOS-Einrichtung

Die Installation und Synchronisierung des Plugins erzeugt keine native Live-Aktivitäts-Oberfläche. Bevor Sie startActivity, konfigurieren Sie ActivityKit in Xcode:

  1. Ausführen bunx cap open ios.
  2. Hinzufügen eines Widget-Erweiterung Ziel und die Verwendung von Live Aktivität.
  3. Setzen Sie die App und die Widget-Erweiterung auf iOS 16.1 oder höher fest.
  4. Stellen Sie sicher, dass die Erweiterung im Hauptapp integriert ist.
  5. Bleiben Sie bei einer ActivityConfiguration in der Erweiterung WidgetBundle, mit Bildschirmschutz und allen Dynamic Island-Anzeigen.
  6. Hinzufügen NSSupportsLiveActivities zur Hauptanwendung Info.plist.
<key>NSSupportsLiveActivities</key>
<true/>

Die Hinzufügung des Ziels allein ist nicht ausreichend. Die native App oder das Plugin müssen die ActivityKit-APIs request, update und end aufrufen. Der Widget-Erweiterung muss SwiftUI code enthalten, die die gleichen Daten dekodieren und rendern können. ActivityAttributes und den Zustand der Inhalte, die von diesen Aufrufen verwendet werden. Fügen Sie die gemeinsamen ActivityKit-Modelle in beiden Hauptanwendung und Widget-Erweiterungszieldarstellungen ein. Die vom Xcode generierte Live-Aktivitätsvorlage rendernt die JSON-Layouts, die diesem Plugin übergeben werden, nicht automatisch; der Erweiterung ist auch ein kompatibles native Layout-Renderer erforderlich.

Geteilte Bilder

Wenn Sie die Methoden zur Bildverwaltung verwenden, fügen Sie die App-Gruppen Die Fähigkeit zur Hauptanwendung und der Widget-Erweiterung hinzufügen. Aktivieren Sie die gleiche Gruppe auf beiden Zielen, indem Sie den genauen Identifier verwenden, der von dem Plugin erwartet wird:

group.<MAIN_APP_BUNDLE_ID>.liveactivities

Live-Aktivitäts-Erweiterungen können nicht auf das Netzwerk zugreifen. Laden Sie remote Bilder in der Hauptanwendung herunter, speichern Sie sie in der gemeinsamen App-Gruppe mit saveImageund referenzieren Sie dann das gespeicherte Bild aus der Layout. Bundelte Assets müssen auch der Zielgruppe der Widget-Erweiterung zugeordnet sein.

Tiefe Links und Push-Updates

  • Registrieren Sie jede benutzerdefinierte URL-Scheme, die behavior.widgetUrl oder tapUrl unter der Hauptanwendungsziel Info > URL-Typen Einstellungen.
  • Fügen Sie für servergetriebene Updates die Fähigkeit "Benachrichtigungen" hinzu und implementieren Sie die ActivityKit-Push-Token-Verwaltung mit APNs. Hinzufügen
  • nur, wenn die Anwendung häufige ActivityKit-Push-Updates benötigt. NSSupportsLiveActivitiesFrequentUpdates Die Aktivierung der Fähigkeit "Benachrichtigungen" reicht allein nicht aus; servergetriebene Updates erfordern eine native Token-Verwaltung und einen APNs-Hintergrunddienst.

ActivityKit beschränkt die kombinierte statische und dynamische Live-Aktivitätsdaten auf 4 KB. Die Dynamic Island ist nur auf unterstützten Gerätemodellen sichtbar; andere Geräte verwenden die Anzeige auf dem Bildschirm des Schlosses.

Was diese Erweiterung offenlegt

- Überprüfen Sie, ob Live-Aktivitäten auf diesem Gerät unterstützt werden. Erfordert iOS 16.1+ und Geräteunterstützung.

  • areActivitiesSupported - Überprüfen Sie, ob Live-Aktivitäten auf diesem Gerät unterstützt werden. Erfordert iOS 16.1+ und Geräteunterstützung.
  • startActivity - Eine neue Live-Aktivität mit der angegebenen Layout und Daten starten.
  • updateActivity - Eine bestehende Live-Aktivität mit neuen Daten aktualisieren.
  • endActivity - Eine Live-Aktivität beenden.

- Beispielverwendung

areActivitiesSupported

- Überprüfen Sie, ob Live-Aktivitäten auf diesem Gerät unterstützt werden. Erfordert iOS 16.1+ und Geräteunterstützung.

import { CapgoLiveActivities } from '@capgo/capacitor-live-activities';

const { supported, reason } = await CapgoLiveActivities.areActivitiesSupported();
if (supported) {
  console.log('Live Activities are supported!');
} else {
  console.log('Not supported:', reason);
}

startActivity

- Eine neue Live-Aktivität mit der angegebenen Layout und Daten starten.

import { CapgoLiveActivities } from '@capgo/capacitor-live-activities';

const { activityId } = await CapgoLiveActivities.startActivity({
  layout: {
    type: 'container',
    direction: 'horizontal',
    children: [
      { type: 'text', content: 'Order #{{orderNumber}}', fontSize: 16, fontWeight: 'bold' },
      { type: 'text', content: '{{status}}', fontSize: 14, color: '#666666' }
    ]
  },
  dynamicIslandLayout: {
    expanded: {
      leading: { type: 'image', source: 'sfSymbol', value: 'box.truck' },
      trailing: { type: 'text', content: '{{eta}}' },
      center: { type: 'text', content: '{{status}}' },
      bottom: { type: 'progress', value: 'progress' }
    },
    compactLeading: { type: 'image', source: 'sfSymbol', value: 'box.truck' },
    compactTrailing: { type: 'text', content: '{{eta}}' },
    minimal: { type: 'image', source: 'sfSymbol', value: 'box.truck' }
  },
  data: {
    orderNumber: '12345',
    status: 'On the way',
    eta: '10 min',
    progress: 0.6
  }
});
console.log('Started activity:', activityId);

updateActivity

- Eine bestehende Live-Aktivität mit neuen Daten aktualisieren.

import { CapgoLiveActivities } from '@capgo/capacitor-live-activities';

await CapgoLiveActivities.updateActivity({
  activityId: 'abc123',
  data: {
    status: 'Arrived!',
    eta: 'Now',
    progress: 1.0
  },
  alertConfiguration: {
    title: 'Delivery Update',
    body: 'Your order has arrived!'
  }
});

endActivity

- Eine Live-Aktivität beenden.

import { CapgoLiveActivities } from '@capgo/capacitor-live-activities';

await CapgoLiveActivities.endActivity({
  activityId: 'abc123',
  data: { status: 'Delivered' },
  dismissalPolicy: 'after',
  dismissAfter: Date.now() + 3600000 // 1 hour from now
});

- Vollständige Referenz

Weitermachen von @capgo/capacitor-live-aktivitäten

Wenn Sie @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-live-aktivitäten verwenden Verwenden Sie @capgo/capacitor-live-aktivitäten Um native Medien und Schnittstellenverhalten zu planen, verbinden Sie es mit @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-live-aktivitäten Verbinden Sie @capgo/capacitor-live-aktivitäten Um die Implementierungsdetails in @capgo/capacitor-live-aktivitäten zu erhalten Zum Starten Um die Implementierungsdetails in Zum Starten zu erhalten Verwenden Sie @capgo/capacitor-video-player Um die native Fähigkeit in Verwenden Sie @capgo/capacitor-video-player zu erhalten Verwenden Sie @capgo/capacitor-video-player Um die Implementierungsdetails in Verwenden Sie @capgo/capacitor-video-player zu erhalten Mit @capgo/capacitor-native-Navigation Für die native Fähigkeit in Mit @capgo/capacitor-native-Navigation.