Flutter自定义Widget构建插件widget_kit_plugin的使用

简介

widget_kit_plugin是一个用于与WidgetKit交互的小型库，仅能通过平台通道访问WidgetKit的非常有限的部分。API基于flutter_widgetkit。该库仅支持iOS和macOS。

可访问的方法

注意：此库不用于创建小部件用户界面，而是帮助与WidgetKit时间线进行一些交互，并通过UserDefaults和应用程序组传递任意数据。获取这些数据并将其应用于小部件UI必须在平台级别完成，这无法通过Flutter实现。

使用方法

UserDefaults

UserDefaults用于共享iOS应用和小部件扩展之间的数据，可以使用app groups来实现。以下是使用示例：

import 'package:widget_kit_plugin/widget_kit_plugin.dart';

void foo() async {
  // 保存数据到用户偏好设置
  await UserDefaults.setString('key', 'value', 'group.tv.gameflow');

  // 检查键是否存在
  bool contains = await UserDefaults.contains('key'); // true

  // 获取（类型化）值
  String value = await UserDefaults.getString('key'); // 'value'

  // 移除键值对
  bool removed = await UserDefaults.remove('key'); // true
}

WidgetKit

WidgetKit提供了重新加载时间线的功能：

import 'package:widget_kit_plugin/widget_kit_plugin.dart';

void bar() async {
  // 重新加载所有时间线
  await WidgetKit.reloadAllTimelines();

  // 重新加载特定时间线
  await WidgetKit.reloadTimelines('foo');
}

创建一个小部件扩展

虽然文档中缺少关于如何创建小部件扩展的具体步骤，但可以通过查看示例应用来了解参考实现。

示例Demo

以下是一个完整的示例demo，展示了如何使用widget_kit_plugin：

import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:widget_kit_plugin/widget_kit_plugin.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String _value = 'N/A';

  [@override](/user/override)
  void initState() {
    super.initState();
    syncUserDefaults();
  }

  Future<void> syncUserDefaults() async {
    String value;
    try {
      if (!await UserDefaults.contains('ExampleData', 'group.tv.gameflow')) {
        await UserDefaults.setString(
          'ExampleData',
          jsonEncode(ExampleData('Hello, world!').toJson()),
          'group.tv.gameflow',
        );
      }

      value = await UserDefaults.getString('ExampleData', 'group.tv.gameflow') ?? 'N/A';

      setState(() {
        _value = value;
      });
    } on PlatformException {
      value = 'Failed to get platform version.';
    }

    if (!mounted) return;

    setState(() {
      _value = value;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('WidgetKit'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text('Current value: $_value'),
              const SizedBox(height: 16),
              Padding(
                padding: const EdgeInsets.all(16.0),
                child: TextField(
                  decoration: const InputDecoration(
                    filled: true,
                    label: Text('Enter a value:'),
                  ),
                  onChanged: (value) async {
                    await UserDefaults.setString(
                      'ExampleData',
                      jsonEncode(ExampleData(value).toJson()),
                      'group.tv.gameflow',
                    ).then((_) {
                      WidgetKit.reloadAllTimelines();
                    });

                    syncUserDefaults();
                  },
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class ExampleData {
  final String text;

  ExampleData(this.text);

  ExampleData.fromJson(Map<String, dynamic> json) : text = json['text'];

  Map<String, dynamic> toJson() => {'text': text};
}