Mit @capgo/capacitor-live-aktivitäten

Capacitor Live-Aktivitäten-Plugin-Schnittstelle für die Verwaltung von iOS-Live-Aktivitäten.

Installieren

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

iOS-Einrichtung

Die Installation und Synchronisierung des Plugins erstellt keine native Live-Aktivitäts-Oberfläche. Bevor Sie die Funktion aufrufen, startActivityKonfigurieren Sie ActivityKit in Xcode:

Ausführen bunx cap open ios.
Hinzufügen eines Widget-Erweiterung Ziel und aktivieren Lebendige Aktivität einschließen.
Stellen Sie das Ziel für die App und die Widget-Erweiterung auf iOS 16.1 oder höher ein.
Stellen Sie sicher, dass die Erweiterung im Hauptapp integriert ist.
Behalten Sie ein ActivityConfiguration in der Erweiterung des WidgetBundle, mit Bildschirmschoner und allen dynamischen Inseln-Anzeigen.
Hinzufügen NSSupportsLiveActivities zum Ziel des Hauptapps Info.plist.

<key>NSSupportsLiveActivities</key>
<true/>

Die Hinzufügung des Ziels allein ist nicht ausreichend. Die native App oder das Plugin muss die APIs von ActivityKit aufrufen, aktualisieren und beenden. Die Widget-Erweiterung muss SwiftUI code enthalten, die die gleichen Daten dekodieren und darstellen können. ActivityAttributes und den Inhalt verwenden, der von diesen Aufrufen verwendet wird. Fügen Sie die gemeinsamen ActivityKit-Modelle sowohl in der Hauptanwendung als auch in der Widget-Erweiterungszielgruppe hinzu. Das vom Xcode generierte Live-Aktivitäts-Template renderiert die JSON-Layouts, die an diesen Plugin übergeben werden, nicht automatisch; Die Erweiterung benötigt auch einen kompatiblen nativen Layout-Renderer.

Geteilte Bilder

Wenn Sie die Methoden zum Bildmanagement verwenden, fügen Sie die App-Gruppen Fähigkeit zu den Hauptanwendungszielgruppen und Widget-Erweiterungszielgruppen hinzu. Aktivieren Sie die gleiche Gruppe auf beiden Zielgruppen mit dem genauen Identifier, 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 saveImage, und referenzieren Sie dann das gespeicherte Bild von der Layout. Verpackte Assets müssen auch der Zielgruppe der Widget-Erweiterung zugeordnet sein.

Tiefe Links und Push-Updates

Registrieren Sie jede benutzerdefinierte URL-Scheme, die von behavior.widgetUrl oder tapUrl unter der Hauptanwendungszielgruppe Info > URL-Typen Einstellungen.
Fügen Sie für servergetriebene Updates die Push-Nachrichten Fähigkeit hinzu und implementieren Sie die ActivityKit-Push-Token-Verwaltung mit APNs.
Hinzufügen NSSupportsLiveActivitiesFrequentUpdates Nur dann, wenn das App häufig ActivityKit-Push-Updates benötigt.

Die Aktivierung der Push-Nachrichten-Fähigkeit allein reicht nicht aus; servergetriebene Updates erfordern native Token-Verwaltung und einen APNs-Hintergrund.

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

Was diese Erweiterung enthüllt

areActivitiesSupported - Überprüfen Sie, ob Live-Aktivitäten auf diesem Gerät unterstützt werden. Erfordert iOS 16.1+ und Geräteunterstützung.
startActivity - Starten Sie eine neue Live-Aktivität mit der angegebenen Layout- und Datenkonfiguration.
updateActivity - Aktualisieren Sie eine bestehende Live-Aktivität mit neuen Daten.
endActivity - Ende einer Live-Aktivität.

Beispiel für die Verwendung

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

Starten Sie eine neue Live-Aktivität mit der angegebenen Layout und Daten.

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`

Aktualisieren Sie eine bestehende Live-Aktivität mit neuen Daten.

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`

Ende einer Live-Aktivität.

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

GitHub: https://github.com/Cap-go/capacitor-live-aktivitäten/
Dokumentation: /docs/plugins/live-aktivitäten/

Fortsetzen Sie von Using @capgo/capacitor-live-aktivitäten

Wenn Sie Live-Aktivitäten verwenden Mit @capgo/capacitor-live-aktivitäten um native Medien und Schnittstellenverhalten zu planen, es mit @capgo/capacitor-live-aktivitäten für die Implementierungsdetails in @capgo/capacitor-live-aktivitäten Einstieg für die Implementierungsdetails in Einstieg Mit @capgo/capacitor-video-abspielen für die native Fähigkeit in Mit @capgo/capacitor-video-abspielen @capgo/capacitor-video-abspielen für die Implementierungsdetails in @capgo/capacitor-video-abspielen und Mit @capgo/capacitor-native-navigieren für die native Fähigkeit in Mit @capgo/capacitor-native-navigieren

Live-Aktivitäten

Tutorial zu Live-Aktivitäten