Utilisation de @capgo/capacitor-live-activities

Capacitor Plugin d'Activités en Direct pour la gestion des Activités iOS.

Installer

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

Configuration iOS

L'installation et la synchronisation du plugin ne créent pas l'interface utilisateur native des Activités en Direct. Avant d'appeler startActivityConfigurez ActivityKit dans Xcode :

Exécuter bunx cap open ios.
Ajoutez un Extension de widget cible et activez Incluez l'activité en direct.
Définissez la cible d'application et d'extension de widget sur iOS 16.1 ou ultérieur.
Assurez-vous que l'extension est intégrée à l'application principale.
Gardez un ActivityConfiguration enregistré dans l'extension's WidgetBundleAjoutez
à la cible de l'application principale's NSSupportsLiveActivities L'ajout de la cible seule n'est pas suffisant. L'application native ou le plugin doit appeler les API d'activité de ActivityKit, mise à jour et fin. L'extension de widget doit contenir des __CAPGO_KEEP_0__ SwiftUI qui peuvent déchiffrer et afficher le même. Info.plist.

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

Adding the target alone is not sufficient. The native app or plugin must call ActivityKit's request, update, and end APIs. The Widget Extension must contain SwiftUI code that can decode and render the same ActivityAttributes et l'état de contenu utilisé par ces appels. Incluez les modèles ActivityKit partagés dans les deux cibles de l'application principale et de l'extension de Widget. Le modèle de Live Activity généré par Xcode ne rend pas automatiquement les layouts JSON transmis à ce plugin ; l'extension a également besoin d'un rendu de layout natif compatible.

Images partagées

Lors de l'utilisation des méthodes de gestion d'images, ajoutez la Groupe d'application capacité aux cibles de l'application principale et de l'extension de Widget. Activez le même groupe sur les deux cibles en utilisant l'identifiant exact attendu par le plugin :

group.<MAIN_APP_BUNDLE_ID>.liveactivities

Les extensions d'activité en direct ne peuvent pas accéder au réseau. Téléchargez les images distantes dans l'application principale, enregistrez-les dans le groupe d'application partagé avec saveImage, et référez ensuite à l'image enregistrée à partir de la mise en page. Les actifs embarqués doivent également appartenir à la cible de l'extension de Widget.

Liaisons profondes et mises à jour par push

Enregistrez tout schéma de lien personnalisé utilisé par behavior.widgetUrl ou tapUrl sous la cible de l'application principale pour Info > Types de URL settings.
Pour les mises à jour pilotées par le serveur, ajoutez la Notifications de Push capacité et implémentez le traitement de jeton d'activité ActivityKit avec APNs.
Ajoutez NSSupportsLiveActivitiesFrequentUpdates seulement lorsque l'application nécessite des mises à jour d'activité ActivityKit Push fréquentes.

Activer la capacité de Notifications de Push seule n'est pas suffisant ; les mises à jour pilotées par le serveur nécessitent un traitement de jeton natif et un backend APNs.

ActivityKit limite les données de Live Activity statiques et dynamiques combinées à 4 Ko. L'île dynamique n'est visible que sur les modèles de dispositifs pris en charge ; les autres appareils utilisent la présentation de la page de verrouillage.

Ce Plugin Expose

areActivitiesSupported - Vérifiez si les activités en direct sont prises en charge sur cet appareil. Exige iOS 16.1+ et support du dispositif.
startActivity - Démarrer une nouvelle activité en direct avec la disposition spécifiée et les données.
updateActivity - Mettre à jour une activité en direct existante avec de nouvelles données.
endActivity - Mettre fin à une activité en direct.

Exemple d'utilisation

`areActivitiesSupported`

Vérifiez si les activités en direct sont prises en charge sur cet appareil. Exige iOS 16.1+ et prise en charge de l'appareil.

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`

Démarrer une nouvelle activité en direct avec la disposition spécifiée et les données.

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`

Mettre à jour une activité en direct existante avec de nouvelles données.

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`

Mettre fin à une activité en direct.

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

Référence complète

GitHub: https://github.com/Cap-go/capacitor-activités-en-ligne/
Docs: /docs/plugins/activités-en-ligne/

Continuez à partir de l'utilisation de @capgo/capacitor-activités-en-ligne

Si vous utilisez Utiliser @capgo/capacitor-activités-en-vive pour planifier le comportement de médias et d'interface natifs, et le connecter avec @capgo/capacitor-activités-en-vive pour les détails d'implémentation dans @capgo/capacitor-activités-en-vive, Démarrage pour les détails d'implémentation dans Démarrage, Utiliser @capgo/capacitor-joueur-de-videos pour la capacité native dans Utiliser @capgo/capacitor-joueur-de-videos, @capgo/capacitor-joueur-de-videos pour les détails d'implémentation dans @capgo/capacitor-joueur-de-videos, et Utiliser @capgo/capacitor-navigation-native pour la capacité native dans Utiliser @capgo/capacitor-navigation-native.

Activités en direct

Tutoriel sur les Activités en Direct