Flutter高级通知变更管理插件advanced_change_notifier的使用

Flutter高级通知变更管理插件advanced_change_notifier的使用

主要目的

该插件帮助你确保你的服务和小部件在发生任何变更时都能及时收到正确的值通知，从而避免不必要的请求和方法调用。

特性

为了避免不必要的方法调用来获取新值，该插件类似于已知的“ChangeNotifier”，但不同之处在于新的值会通过通知器传递给监听器。

使用方法

你可以选择从基类扩展或将其作为混入类使用。基类接受一个泛型类型参数，并确保在任何事件发生时都提供变更信息。

class ChatService extends AdvancedChangeNotifier<String> {
  sendMessage(String text) {
    print("He said: '$text'");
    notifyListeners(value: text); // 通知监听器，传递新值
  }
}

额外信息

当在小部件或其服务中使用此包时，它特别有用。它可以减少冗余或不必要的代码，避免每次事件发生时重新请求数据，而是通过监听器本身传递数据。

完整示例

示例代码

import 'package:advanced_change_notifier/advanced_change_notifier.dart';

// 定义一个聊天服务类，继承自AdvancedChangeNotifier
class ChatService extends AdvancedChangeNotifier<String> {
  // 发送消息的方法
  sendMessage(String text) {
    print("He said: '$text'"); // 打印发送的消息
    notifyListeners(value: text); // 通知监听器，传递新值
  }
}

void main() {
  // 创建一个ChatService实例
  var service = ChatService();
  
  // 添加一个监听器
  service.addListener(
    (value) async {
      print("This listener was called and received '$value'"); // 打印接收到的值
    },
  );

  // 调用sendMessage方法发送一条消息
  service.sendMessage("A test of this package");
}

更多关于Flutter高级通知变更管理插件advanced_change_notifier的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter高级通知变更管理插件advanced_change_notifier的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


advanced_change_notifier 是一个用于 Flutter 的状态管理插件，它是对 Flutter 原生 ChangeNotifier 的增强版本，提供了更多的功能和灵活性。使用 advanced_change_notifier，你可以更高效地管理应用的状态，并减少不必要的重建。

1. 安装插件

首先，你需要在 pubspec.yaml 文件中添加 advanced_change_notifier 插件的依赖：

dependencies:
  flutter:
    sdk: flutter
  advanced_change_notifier: ^1.0.0  # 请使用最新版本

然后运行 flutter pub get 来安装依赖。

2. 基本用法

advanced_change_notifier 的核心是 AdvancedChangeNotifier 类，它继承自 ChangeNotifier，并添加了一些额外的功能。

创建状态管理类

你可以通过继承 AdvancedChangeNotifier 来创建一个状态管理类。例如：

import 'package:advanced_change_notifier/advanced_change_notifier.dart';

class CounterModel extends AdvancedChangeNotifier {
  int _count = 0;

  int get count => _count;

  void increment() {
    _count++;
    notifyListeners(); // 通知监听者状态已变更
  }
}

在 UI 中使用

在 Flutter 的 UI 中，你可以使用 AdvancedChangeNotifierProvider 来提供状态，并使用 AdvancedChangeNotifierBuilder 来监听状态的变化。

import 'package:flutter/material.dart';
import 'package:advanced_change_notifier/advanced_change_notifier.dart';
import 'counter_model.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: AdvancedChangeNotifierProvider(
        create: (_) => CounterModel(),
        child: HomePage(),
      ),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('AdvancedChangeNotifier Example')),
      body: Center(
        child: AdvancedChangeNotifierBuilder<CounterModel>(
          builder: (context, model, child) {
            return Text('Count: ${model.count}');
          },
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          var model = AdvancedChangeNotifierProvider.of<CounterModel>(context);
          model.increment();
        },
        child: Icon(Icons.add),
      ),
    );
  }
}

3. 高级功能

advanced_change_notifier 提供了许多高级功能，例如：

  • 选择性重建：AdvancedChangeNotifierBuilder 允许你只监听特定的状态变化，从而减少不必要的重建。
  • 状态持久化：你可以轻松地将状态持久化到本地存储中。
  • 状态合并：支持将多个 AdvancedChangeNotifier 合并为一个，简化复杂状态的管理。

选择性重建示例

AdvancedChangeNotifierBuilder<CounterModel>(
  selector: (model) => model.count, // 只监听 count 的变化
  builder: (context, count, child) {
    return Text('Count: $count');
  },
);

状态持久化示例

class CounterModel extends AdvancedChangeNotifier {
  int _count = 0;

  int get count => _count;

  CounterModel() {
    loadState();
  }

  Future<void> loadState() async {
    _count = await SharedPreferences.getInstance().then((prefs) => prefs.getInt('count') ?? 0);
    notifyListeners();
  }

  void increment() {
    _count++;
    SharedPreferences.getInstance().then((prefs) => prefs.setInt('count', _count));
    notifyListeners();
  }
}
回到顶部