使用 @capgo/capacitor-live-activities

Capacitor Live Activities 插件用于管理 iOS Live Activities。

安装

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

iOS 配置

安装和同步插件不会创建原生 Live Activity UI。请在调用 startActivity, 在 Xcode 中配置 ActivityKit:

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

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

仅仅添加目标是不够的。 native 应用或插件必须调用 ActivityKit 的 request、update 和 end API。 Widget 扩展必须包含 SwiftUI code 以解码和渲染相同的 ActivityAttributes 和内容状态由这些调用使用。在主应用和 Widget 扩展目标中包括共享的 ActivityKit 模型。 Xcode 生成的 Live Activity 模板不会自动渲染传递给此插件的 JSON 布局; 扩展还需要兼容的 native 布局渲染器。

共享图片

当使用图片管理方法时，添加 应用组 能力到主应用和 Widget 扩展目标。在两个目标上启用相同的组，使用插件期望的exact标识符:

group.<MAIN_APP_BUNDLE_ID>.liveactivities

Live Activity 扩展无法访问网络。在主应用中下载远程图片，保存到共享的应用组中， saveImage然后从布局中引用保存的图片。打包的资产也必须属于 Widget 扩展目标。

深度链接和推送更新

注册任何自定义 URL 方案由 behavior.widgetUrl 或 tapUrl 在主应用目标下 信息 > URL 类型 设置。
为了实现服务器驱动的更新，添加 推送通知 capability并实现ActivityKit推送令牌处理与APNs。
添加 NSSupportsLiveActivitiesFrequentUpdates 仅当应用程序需要频繁的ActivityKit推送更新时。

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

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

此插件暴露

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

- 示例用法

`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 获取更多信息获取更多信息使用@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 教程