iOS 组件开发教程——手把手轻松实现灵动岛

1、先在项目里创建一个Widget Target

2.

2、一定要勾选 Include live Activity,然后输入名称,点击完成既可。

在这里插入图片描述

3、在 Info.plist 文件中声明开启,打开 Info.plist 文件添加 NSSupportsLiveActivities,并将其布尔值设置为 YES。

4、我们创建一个IMAttributes,

struct IMAttributes: ActivityAttributes {
    public typealias IMStatus = ContentState

    public struct ContentState: Codable, Hashable {
        var callName: String
        var imageStr : String
        var callingTimer: ClosedRange<Date>
    }
    
    var callName: String
    var imageStr : String
    var callingTimer: ClosedRange<Date>
}

5、灵动岛界面配置

struct IMActivityWidget: Widget {
    var body: some WidgetConfiguration {
        ActivityConfiguration(for: IMAttributes.self) { context in
            // 创建显示在锁定屏幕上的演示,并在不支持动态岛的设备的主屏幕上作为横幅。
            // 展示锁屏页面的 UI

        } dynamicIsland: { context in
            // 创建显示在动态岛中的内容。
            DynamicIsland {
                //这里创建拓展内容(长按灵动岛)
                DynamicIslandExpandedRegion(.leading) {
                    Label(context.state.callName, systemImage: "person")
                        .font(.caption)
                        .padding()
                }
                DynamicIslandExpandedRegion(.trailing) {
                    Label {
                        Text(timerInterval: context.state.callingTimer, countsDown: false)
                            .multilineTextAlignment(.trailing)
                            .frame(width: 50)
                            .monospacedDigit()
                            .font(.caption2)
                    } icon: {
                        Image(systemName: "timer")
                    }
                    .font(.title2)
                }
                DynamicIslandExpandedRegion(.center) {
                    Text("\(context.state.callName) 正在通话中...")
                        .lineLimit(1)
                        .font(.caption)
                        .foregroundColor(.secondary)
                }

            }
            //下面是紧凑展示内容区(只展示一个时的视图)
            compactLeading: {
                Label {
                    Text(context.state.callName)

                } icon: {
                    Image(systemName: "person")
                }
                .font(.caption2)
            } compactTrailing: {
                Text(timerInterval: context.state.callingTimer, countsDown: true)
                    .multilineTextAlignment(.center)
                    .frame(width: 40)
                    .font(.caption2)
            }
            //当多个Live Activities处于活动时,展示此处极小视图
            minimal: {
                VStack(alignment: .center) {
                    Image(systemName: "person")
                    
                    
                }
            }
            .keylineTint(.accentColor)
        }
    }
}

6、在需要的地方启动的地方调用,下面是启动灵动岛的代码

        let imAttributes = IMAttributes(callName: "wqd", imageStr:"¥99", callingTimer: Date()...Date().addingTimeInterval(0))
        
        //初始化动态数据
        let initialContentState = IMAttributes.IMStatus(callName: name, imageStr: "ia.imageStr", callingTimer: Date()...Date().addingTimeInterval(0))
                                                  
        do {
            //启用灵动岛
            //灵动岛只支持Iphone,areActivitiesEnabled用来判断设备是否支持,即便是不支持的设备,依旧可以提供不支持的样式展示
            if #available(iOS 16.1, *) {
                if ActivityAuthorizationInfo().areActivitiesEnabled == true{
                    
                }
            } else {
                // Fallback on earlier versions
            }
            let deliveryActivity = try Activity<IMAttributes>.request(
                attributes: imAttributes,
                contentState: initialContentState,
                pushType: nil)
            //判断启动成功后,获取推送令牌 ,发送给服务器,用于远程推送Live Activities更新
            //不是每次启动都会成功,当已经存在多个Live activity时会出现启动失败的情况
            if deliveryActivity.activityState == .active{
                _ = deliveryActivity.pushToken
            }
//            deliveryActivity.pushTokenUpdates //监听token变化
            print("Current activity id -> \(deliveryActivity.id)")
        } catch (let error) {
            print("Error info -> \(error.localizedDescription)")
        }
6.此处只有一个灵动岛,当一个项目有多个灵动岛时,需要判断更新对应的activity

   func update(name:String) {
        Task {
         
            let updatedDeliveryStatus = IMAttributes.IMStatus(callName: name, imageStr: "ia.imageStr", callingTimer: Date()...Date().addingTimeInterval(0))
            
            for activity in Activity<IMAttributes>.activities{
                await activity.update(using: updatedDeliveryStatus)
            }
        }
    }

7、停止灵动岛

func stop() {
    Task {
        for activity in Activity<IMAttributes>.activities{
            await activity.end(dismissalPolicy: .immediate)
        }
    }
}

相关推荐:

更多技术文章:https://www.imgeek.net/

注册环信:http://easemob.cn/42f39f

  • 6
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值