在一个 Bloc 中合并流

Question

我的集团中有一些流。我不确定这是否是正确和正确的方法，因为我是 Flutter 和 Bloc 模式的新手。 但是我怎样才能将 Bloc 中的流合并为一个呢？

欢迎任何关于该主题的提示......

我的 Bloc 文件

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

class WelcomeBloc {
  final _controller = PublishSubject<PageController>();
  final _page = PublishSubject<int>();
  final _lastPage = PublishSubject<bool>();

  Stream<dynamic> get combinedStream =>
      CombineLatestStream.list([getController, currentPage, isLastPage]);

  Stream<PageController> get getController => _controller.stream;
  Stream<int> get currentPage => _page.stream;
  Stream<bool> get isLastPage => _lastPage.stream;

  updatePage(int page) {
    _page.sink.add(page);
  }

  updatePageState(bool state) {
    _lastPage.sink.add(state);
  }

  dispose() {
    _controller.close();
    _page.close();
    _lastPage.close();
  }
}

final welcomeBloc = WelcomeBloc();

消费者

import 'package:flutter/material.dart';
import '../../blocs/welcome_bloc.dart';
import './pages/page.dart';
import './pages/page2.dart';
import './pages/login.dart';

class ViewerWrapper extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return StreamBuilder(
        stream: welcomeBloc.combinedStream,
        builder: (context, AsyncSnapshot snapshot) {
          return PageView(
            children: <Widget>[
              Page1(),
              Page2(),
              Login(),
            ],
            onPageChanged: (page) {
              welcomeBloc.updatePage(page);
              print(snapshot.data._page);
              // welcomeBloc.updatePage(page + 1);
            },
            // controller: snapshot.data.getController,
          );
        });
  }
}

Answer 1

您可以使用Rx.combineLatest3 喜欢this link 合并流，但正如我从您的代码中理解的那样，最好定义一个这样的模型：

Class MyModel{

    PageController pageController;
    int currentPage;
    bool isLastPage;
...

}

然后有一个与之配合使用的流。

编辑：将模型应用于代码

我用两种方法更改了代码。

第一个

您可以定义一个模型并使用该模型，因此您不需要 3 个不同的流，如果您始终需要组合流版本而不是任何其他地方的每个流，这没关系。

我在一个文件中编写了代码。

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

class MyModel {
  PageController pageController;
  int currentPage;
  bool isLastPage;

  MyModel({this.currentPage, this.pageController, this.isLastPage});
}

class WelcomeBloc {
  var _myModel = PublishSubject<MyModel>();

  Stream<MyModel> get getModel => _myModel.stream;

  // updatePage(int page) {
  //   _page.sink.add(page);
  // }

  // updatePageState(bool state) {
  //   _lastPage.sink.add(state);
  // }
  void updateModel(MyModel model) {
    _myModel.sink.add(model);
  }

  dispose() {
    _myModel.close();
  }
}

final welcomeBloc = WelcomeBloc();

class ViewerWrapper extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return StreamBuilder<MyModel>(
        stream: welcomeBloc.getModel,
        builder: (context, AsyncSnapshot<MyModel> snapshot) {
          if (snapshot.hasData) {
            MyModel model = snapshot.data;
            return PageView(
              children: <Widget>[
                Page1(),
                Page2(),
                Login(),
              ],
              onPageChanged: (page) {
                model.currentPage = page;
                welcomeBloc.updateModel(model);
                print(model.currentPage);
                // welcomeBloc.updatePage(page + 1);
              },
              controller: model.pageController,
            );
          }
          return Center(child: CircularProgressIndicator());
        });
  }
}

第二个

如果你还需要其他地方的其他流等等，你可以组合流，你可以用任何你想要的方式组合它们，列表，映射，或者定义好的模型，我使用了一个模型（MyModel）。

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

class MyModel {
  PageController pageController;
  int currentPage;
  bool isLastPage;

  MyModel({this.currentPage, this.pageController, this.isLastPage});
}

class WelcomeBloc {
  final _controller = PublishSubject<PageController>();
  final _page = PublishSubject<int>();
  final _lastPage = PublishSubject<bool>();

  Stream<MyModel> get combinedStream =>
      Rx.combineLatest3(_page, _lastPage, _controller,
          (int page, bool isLast, PageController controller) {
        return MyModel(
          currentPage: page,
          isLastPage: isLast,
          pageController: controller,
        );
      });

  Stream<PageController> get getController => _controller.stream;
  Stream<int> get currentPage => _page.stream;
  Stream<bool> get isLastPage => _lastPage.stream;

  updatePage(int page) {
    _page.sink.add(page);
  }

  updatePageState(bool state) {
    _lastPage.sink.add(state);
  }

  dispose() {
    _controller.close();
    _page.close();
    _lastPage.close();
  }
}

final welcomeBloc = WelcomeBloc();

class ViewerWrapper extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return StreamBuilder<MyModel>(
        stream: welcomeBloc.combinedStream,
        builder: (context, AsyncSnapshot<MyModel> snapshot) {
          if (snapshot.hasData) {
            MyModel model = snapshot.data;

            return PageView(
              children: <Widget>[
                Page1(),
                Page2(),
                Login(),
              ],
              onPageChanged: (page) {
                welcomeBloc.updatePage(page);
                print(model.currentPage);
                // welcomeBloc.updatePage(page + 1);
              },
              controller: model.pageController,
            );
          }
          return Center(child: CircularProgressIndicator());
        });
  }
}

Answer 2

不要以为事情就是这样。尽管如果您想这样做，请尝试将您的流构建器作为另一个流构建器的子级。但我不会推荐这种方式。

您不会收听来自同一个 bloc 的多个流，一个好方法是每个 bloc 架构有一个流。

您可以阅读有关提供程序的更多信息，它们比 bloc 更简单，并且受到 Flutter 社区的推荐。