使用 @capgo/capacitor-live-activities

Capacitor 实时活动插件接口，用于管理 iOS 实时活动。

安装

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

iOS 设置

安装和同步插件不会创建原生实时活动 UI。在调用之前，请在 Xcode 中配置 ActivityKit： startActivity运行

添加 bunx cap open ios.
小部件扩展一个设置目标和启用 包含实时活动.
将应用程序和小部件扩展部署目标设置为 iOS 16.1 或更高版本。
确保扩展嵌入在主应用程序中。
保留一个 ActivityConfiguration 已注册在扩展的 WidgetBundle,包括锁屏和所有动态岛屿演示。
添加 NSSupportsLiveActivities 到主应用程序目标的 Info.plist.

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

仅添加目标是不够的。原生应用程序或插件必须调用 ActivityKit 的 request、update 和 end API。小部件扩展必须包含 SwiftUI code，可以解码和呈现相同的 ActivityAttributes 和内容状态由这些调用使用。将共享的 ActivityKit 模型添加到主应用程序和小部件扩展目标中。Xcode 生成的实时活动模板不自动呈现传递给此插件的 JSON 布局；扩展还需要兼容的原生布局呈现器。

共享图像

使用图像管理方法时，添加 App 组 功能到主应用和小部件扩展目标中。使用插件期望的exact标识符在两个目标上启用相同的组：

group.<MAIN_APP_BUNDLE_ID>.liveactivities

Live 活动扩展无法访问网络。下载远程图像在主应用中，保存它们到共享的App组中 saveImage,然后从布局中引用保存的图像。捆绑资产也必须属于小部件扩展目标。

深度链接和推送更新

注册 behavior.widgetUrl 或 tapUrl 下应用目标的 信息> URL 类型 设置。
对于服务器驱动的更新，添加 推送通知 能力和实现ActivityKit推送令牌处理与APNs.
添加 NSSupportsLiveActivitiesFrequentUpdates 仅当应用程序需要频繁的ActivityKit推送更新时才添加。

仅仅启用推送通知能力是不够的; 服务器驱动的更新需要原生令牌处理和APNs后端。

ActivityKit限制了静态和动态Live活动数据的组合大小为4KB。动态岛屿仅在支持的设备模型上可见; 其他设备使用锁屏显示。

此插件暴露的内容

areActivitiesSupported - 检查是否在此设备上支持Live活动。需要iOS 16.1+和设备支持。
startActivity - 使用指定的布局和数据启动一个新的Live活动。
updateActivity - 使用新数据更新一个现有的Live活动。
endActivity - 结束一个Live活动。

示例用法

`areActivitiesSupported`

检查是否支持此设备上的实时活动。需要 iOS 16.1+ 和设备支持。

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`

使用指定的布局和数据启动一个新的实时活动。

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`

更新一个现有的实时活动的新数据。

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`

结束一个实时活动。

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

全参考

GitHub: https://github.com/Cap-go/capacitor-live-activities/
文档：/docs/plugins/live-activities/

继续使用 @capgo/capacitor-live-activities

如果您正在使用 使用 @capgo/capacitor-live-activities 来规划原生媒体和界面行为，连接它 @capgo/capacitor-live-activities @capgo/capacitor-live-activities的实现细节 Getting Started Getting Started的实现细节使用@capgo/capacitor-video-player @capgo/capacitor-video-player的原生功能 @capgo/capacitor-video-player @capgo/capacitor-video-player的实现细节,以及使用@capgo/capacitor-native-navigation @capgo/capacitor-native-navigation的原生功能

Live Activities

关于实时活动的教程