【问题标题】:Is there a Flutter StreamBuilder which allows me to listen to multiple streams?是否有 Flutter StreamBuilder 可以让我收听多个流?
【发布时间】:2020-02-21 10:29:55
【问题描述】:

是否有允许我收听多个流的 StreamBuilder? 类似:

   body: MultiStreamBuilder(
        streams: [bloc.state.stream, bloc.kind.stream],
        builder: (context) {

我不需要像 Flutter StreamBuilder 中那样的快照,因为我可以从 bloc 中读取数据

【问题讨论】:

标签: flutter dart


【解决方案1】:

只要其中一个流获得更新,就会更新 UI(调用 build)。我不使用 snapshot.data,因为我直接从 bloc 读取数据,而 snapshot.data 只包含一个布尔值,而不是流的真实数据。

class _RemoteDebuggingScreenState extends State<RemoteDebuggingScreen> {
  @override
  Widget build(BuildContext context) {
    RemoteDebugBlog bloc = BlocProvider.of(context).remoteDebugBloc;

    return Scaffold(
      body: StreamBuilder(
        stream: Observable.combineLatest2(bloc.state.stream, bloc.kind.stream,
            (b1, b2) => b1 != null || b2 != null),
        builder: (context, snapshot) {
          if (!snapshot.hasData) return Container();

          return Column(...

有关combineLatest 的一些漂亮图形的更多信息,请查看: https://www.burkharts.net/apps/blog/rxdart-magical-transformations-of-streams/

现在知道了上面的内容,我把它移到了一个小部件中:

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

class DoubleStreamBuilder extends StatelessWidget {
  @override
  DoubleStreamBuilder(
      {@required this.stream1, @required this.stream2, @required this.builder});

  final Stream stream1;
  final Stream stream2;
  final Widget Function(BuildContext) builder;

  Widget build(BuildContext context) => StreamBuilder(
      stream: Rx.combineLatest2(
          stream1, stream2, (b1, b2) => b1 != null || b2 != null),
      builder: (context, snapshot) => builder(context));
}


现在的用法很简单,如下所示:

 return DoubleStreamBuilder(
    stream1: settingsBloc.uiVin.stream,
    stream2: settingsBloc.isPseudoVin.stream,
    builder: (context) {
   => this updates when stream 1 or 2 have new values
   }

【讨论】:

  • snapshot.data == null 不是必需的,因为 !snapshot.hasData 是相同的。
  • Observable 在 RxDart 0.23.1 中已弃用您现在可以使用抽象类 Rx,例如 Rx.combineLatest2
猜你喜欢
  • 2019-12-06
  • 2019-10-23
  • 1970-01-01
  • 1970-01-01
  • 2018-08-17
  • 2021-01-07
  • 1970-01-01
  • 2020-10-21
  • 1970-01-01
相关资源
最近更新 更多