uniapp widgetkit插件如何使用

如何在uniapp中正确使用widgetkit插件？我按照官方文档配置后仍然无法正常显示小组件，求详细的使用教程或常见问题解决方法。

2 回复

uniapp中使用WidgetKit插件需先安装插件，在manifest.json中配置。然后创建widget扩展，编写widget页面代码，通过uni.getWidgetData获取数据并渲染。最后打包为原生应用，在手机桌面添加小组件即可。


UniApp WidgetKit 插件用于在 iOS 主屏幕添加小组件（Widget）。以下是基本使用步骤和示例代码：

1. 安装插件

  • 在 UniApp 项目的 manifest.json 中，选择“App 原生插件配置”，添加 WidgetKit 插件（需先购买或获取插件包）。
  • 或通过 HBuilderX 直接导入插件。

2. 配置 iOS 设置

在 manifest.json 的 "ios" 部分添加：

"widgetkit" : {
    "enabled" : true
}

3. 创建小组件配置文件

在项目根目录创建 widget 文件夹，包含：

  • Info.plist：定义小组件属性（如尺寸、名称）。
  • ViewController.swift：Swift 代码处理小组件逻辑和 UI。
  • 资源文件（如图标）。

4. 编写小组件代码（示例）

在 ViewController.swift 中，使用 SwiftUI 定义小组件界面：

import SwiftUI
import WidgetKit

struct SimpleWidget: Widget {
    let kind: String = "uniAppWidget"
    
    var body: some WidgetConfiguration {
        StaticConfiguration(kind: kind, provider: Provider()) { entry in
            VStack {
                Text("UniApp 小组件")
                    .font(.headline)
                Text(entry.date, style: .time)
            }
        }
        .configurationDisplayName("我的小组件")
        .description("展示 UniApp 数据")
    }
}

5. 数据传递

  • 使用 App Groups 共享数据（需在 Xcode 中配置 Group ID）。
  • 在 UniApp 中通过原生插件将数据写入 UserDefaults(suiteName: "group.yourAppGroup")。

6. 调试与发布

  • 在 Xcode 中配置小组件 Target，并运行测试。
  • 使用 HBuilderX 云打包或离线打包生成 IPA。

注意事项

  • 仅支持 iOS 14+ 系统。
  • 小组件需遵循苹果设计规范（如静态/动态类型）。
  • 定期更新数据需配置时间线（TimelineProvider）。

通过以上步骤，即可在 UniApp 中集成 WidgetKit 实现 iOS 小组件功能。

回到顶部