Flutter未定义功能插件dash的使用

Dash简介

Dash是一个简单但高效的库，它提供和释放BloCs类而无需担心复杂的配置问题。

重要提示：使用此包需要Dart2。

安装

1. 添加dash到你的pubspec.yaml文件中的依赖项部分：

dependencies:
  dash: ^latest_version

2. 添加build_runner和dash_generator到你的pubspec.yaml文件中的开发依赖项部分：

dev_dependencies:
  build_runner: ^2.0.3
  dash_generator: ^latest_version

使用方法

1. 创建一个提供者类，该类将收集所有带有BlocProvider注解的类：

重要提示：不要忘记添加part 'provider.g.dart';。

import 'package:dash/dash.dart';

part 'provider.g.dart';

@BlocProvider.register(MySampleBloc)
@BlocProvider.register(MyOtherBloc)
abstract class Provider {}

2. 所有的Bloc类都应继承自Bloc。这将允许你重写dispose方法。

重要提示：所有的Bloc类必须有一个instance()函数，返回Bloc类的实例，如下所示。

class MySampleBloc extends Bloc {

  @override
  dispose() {
    //关闭所有流
  }

  static Bloc instance() => MySampleBloc();
  
}

class MyOtherBloc extends Bloc {

  @override
  dispose() {
    //关闭所有流
  }

  static Bloc instance() => MyOtherBloc();
}

3. 运行build_runner，它将生成你在提供者类中作为部分添加的provider.g.dart类。

在项目目录下运行以下命令：

• 对于普通Dart项目：

  pub run build_runner build
  

• 对于Flutter项目：

  flutter packages pub run build_runner build
  

注意： 如果遇到冲突错误，请向命令中添加--delete-conflicting-outputs参数：

flutter packages pub run build_runner build --delete-conflicting-outputs

4. 最后，你可以从任何地方获取Bloc类的实例，例如：

  @override
  Widget build(BuildContext context) {
    final _bloc = $Provider.of<MyOtherBloc>();

    return Container();
  }

  @override
  void dispose() {
    $Provider.dispose<MyOtherBloc>();
    super.dispose();
  }

示例代码

以下是完整的示例代码，展示了如何使用Dash来管理状态：

import 'package:dash/dash.dart';
import 'package:flutter/material.dart';
import 'package:rxdart/rxdart.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Dash Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter and Dash Home Page'),
    );
  }
}

// Bloc 类
class MyHomeBloc extends Bloc {
  static MyHomeBloc instance() => MyHomeBloc();

  final _counter = BehaviorSubject<int>.seeded(0);
  Stream<int> get counter => _counter.stream;
  Function(int) get updateCounter => _counter.sink.add;

  void increment() => updateCounter((_counter.value ?? 0) + 1);

  @override
  void dispose() {
    _counter.close();
  }
}

// 提供者类
part 'provider.g.dart';

@BlocProvider.register(MyHomeBloc)
abstract class Provider {}

// 主页
class MyHomePage extends StatefulWidget {
  MyHomePage({required this.title});

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final _bloc = $Provider.of<MyHomeBloc>();

  @override
  void dispose() {
    $Provider.dispose<MyHomeBloc>();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
            ),
            StreamBuilder<int>(
              stream: _bloc.counter,
              builder: (context, snap) => snap.hasData
                  ? Text(
                      '${snap.data}',
                      style: Theme.of(context).textTheme.headline6,
                    )
                  : Text('loading...'),
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _bloc.increment,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}

通过上述步骤和示例代码，你应该能够成功地在Flutter项目中集成并使用Dash库进行状态管理。