所以我正在一个项目中,我想要一个包含多个数据流的列表视图。我正在寻找的是这样的东西,但是所有这些都需要在一个列表视图中滚动。
我正在接收的数据流来自firebase,并且该变量myData是firebase集合的实例。我能够为单个流构建一个列表,所以我知道实例是正确的,我不想共享它,因为当前数据库规则处于测试模式。
myData
此代码使我可以ListView从单个流构建单个对象,并且可以按预期工作。
ListView
Container( child: StreamBuilder<QuerySnapshot>( stream: myData, builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) { if (snapshot.hasError) return new Text('Error: ${snapshot.error}'); switch (snapshot.connectionState) { case ConnectionState.waiting: return new Text('Loading...'); default: return new ListView( children: snapshot.data.documents.map((DocumentSnapshot document) { return Text(document['color']); }).toList(), ); } }, ), );
从这里开始,我觉得我有2种选择:1)构建并Column从StreamBuilder允许返回的a中返回a ListView。2)或将一个List空的列表放置在ListView的子级中,并使用StreamBuilder以外的其他内容从firebase添加到列表中,因为它需要返回的Widget。(除了StreamBuilder,我不知道其他方法)任何想法都将受到欢迎。
Column
StreamBuilder
List
这是我的第一个想法的代码。我希望您能看到它如何扩展。通过返回色谱柱,我可以建立一种流体ListView。问题在于它不会从Firebase获取数据,唯一的结果是CircularProgressIndicator。
CircularProgressIndicator
ListView( children: <Widget>[ StreamBuilder( stream: myData, builder: (context, snapshot) { if (!snapshot.hasData) return CircularProgressIndicator(); return Column( children: List<Widget>.generate(3, (index) { return Habit( habit: snapshot.data.documents['index']['habit'], icon: snapshot.data.documents['index']['icon'], text: "figure this out later", color: snapshot.data.documents['index']['color'], complete: false, // figure this out later ); }), ); } ), //Second Stream here ], )
如果可以的话,请帮忙,我已经解决了2到3天,并且没有任何朋友/同事要求理解飞镖/颤振。
您检查提供程序包了吗?你可以用多个Stream通过的StreamProvider有MultiProvider和消费的所有数据流的变化。
Stream
StreamProvider
MultiProvider
不知道细节,可能会想到这样的小部件:
Widget build(BuildContext context) { return MultiProvider( providers: [ StreamProvider.controller(builder: (_) => StreamController<CollectionA>()), StreamProvider.controller(builder: (_) => StreamController<CollectionB>()), ], child: Consumer2<CollectionA, CollectionB>( builder: (context, CollectionA collectionA, CollectionB collectionB, _) { }, ), ); }