listview - Flutter中ListView中显示多个文档数据

Question

这是我使用的代码。我试图实现的是在 RadioItem 内的 ListView 中显示来自每个容器的不同驱动程序。目前它只重复显示一个名称，如所附照片所示。我的输出

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:cloud_firestore/cloud_firestore.dart';

class BeepListView extends StatefulWidget {
  @override
  _BeepListViewState createState() => _BeepListViewState();
}

class _BeepListViewState extends State<BeepListView> {
  List<RadioModel> beepUnits = new List<RadioModel>();

  @override
  void initState() {
    super.initState();
    beepUnits.add(new RadioModel(false, 'Unit 1'));
    beepUnits.add(new RadioModel(false, 'Unit 2'));
    beepUnits.add(new RadioModel(false, 'Unit 3'));
    beepUnits.add(new RadioModel(false, 'Unit 4'));
    beepUnits.add(new RadioModel(false, 'Unit 5'));
    beepUnits.add(new RadioModel(false, 'Unit 6'));
    beepUnits.add(new RadioModel(false, 'Unit 7'));
    beepUnits.add(new RadioModel(false, 'Unit 8'));
    beepUnits.add(new RadioModel(false, 'Unit 9'));
    beepUnits.add(new RadioModel(false, 'Unit 10'));
    beepUnits.add(new RadioModel(false, 'Unit 11'));
    beepUnits.add(new RadioModel(false, 'Unit 12'));
    beepUnits.add(new RadioModel(false, 'Unit 13'));
    beepUnits.add(new RadioModel(false, 'Unit 14'));
    beepUnits.add(new RadioModel(false, 'Unit 15'));
    beepUnits.add(new RadioModel(false, 'Unit 16'));
    beepUnits.add(new RadioModel(false, 'Unit 17'));
    beepUnits.add(new RadioModel(false, 'Unit 18'));
    beepUnits.add(new RadioModel(false, 'Unit 19'));
    beepUnits.add(new RadioModel(false, 'Unit 20'));
  }

  @override
  Widget build(BuildContext context) {
    double defaultScreenWidth = 400.0;
    double defaultScreenHeight = 810.0;

    ScreenUtil.instance = ScreenUtil(
      width: defaultScreenWidth,
      height: defaultScreenHeight,
      allowFontScaling: true,
    )..init(context);
    return Container(
      margin: EdgeInsets.symmetric(vertical: 20.0),
      height: 100.0,
      child: ListView.builder(
        scrollDirection: Axis.horizontal,
        itemCount: beepUnits.length,
        itemBuilder: (BuildContext context, int index) {
          return new InkWell(
            splashColor: Colors.blue,
            onTap: () {
              setState(() {
                beepUnits.forEach((element) => element.isSelected = false);
                beepUnits[index].isSelected = true;
              });
            },
            child: new RadioItem(beepUnits[index]),
          );
        },
      ),
    );
  }
}

class RadioItem extends StatelessWidget {
  final RadioModel _item;
  RadioItem(this._item);
  @override
  Widget build(BuildContext context) {
    return StreamBuilder<QuerySnapshot>(
        stream: Firestore.instance
            .collection('driver')
            .where('status', isEqualTo: 'On Duty')
            .limit(1)
            .snapshots(),
        builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
          if (snapshot.hasError) return new Text('Error: ${snapshot.error}');
          switch (snapshot.connectionState) {
            case ConnectionState.waiting:
              return new Text(' ');
            default:
              return Container(
                margin: new EdgeInsets.all(5.0),
                child: new Row(
                  mainAxisSize: MainAxisSize.max,
                  children: <Widget>[
                    new Container(
                      height: 100.0,
                      width: 160.0,
                      child: Row(
                        children: <Widget>[
                          Container(
                            child: Padding(
                              padding: const EdgeInsets.only(
                                  left: 10.0, right: 10.0),
                              child: new Text(
                                'ETA',
                                style: TextStyle(
                                  color: _item.isSelected
                                      ? Colors.grey[200]
                                      : Colors.black,
                                  fontSize: ScreenUtil.instance.setSp(29.0),
                                  fontWeight: FontWeight.bold,
                                ),
                              ),
                            ),
                          ),
                          Padding(
                            padding: const EdgeInsets.only(top: 15.0),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: <Widget>[
                                Container(
                                  child: Row(
                                    children: <Widget>[
                                      Container(
                                        child: Icon(
                                          Icons.directions_bus,
                                          color: _item.isSelected
                                              ? Colors.grey[200]
                                              : Colors.black,
                                          size: ScreenUtil.instance.setSp(19.0),
                                        ),
                                      ),
                                      Container(
                                        child: new Text(
                                          _item.buttonTitle,
                                          style: new TextStyle(
                                            color: _item.isSelected
                                                ? Colors.grey[200]
                                                : Colors.black,
                                            fontSize:
                                                ScreenUtil.instance.setSp(15.0),
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                                Container(
                                  child: Row(
                                    children: <Widget>[
                                      Container(
                                        child: Icon(
                                          Icons.swap_calls,
                                          color: _item.isSelected
                                              ? Colors.grey[200]
                                              : Colors.black,
                                          size: ScreenUtil.instance.setSp(19.0),
                                        ),
                                      ),
                                      Container(
                                        child: new Text(
                                          'Distance',
                                          style: new TextStyle(
                                            color: _item.isSelected
                                                ? Colors.grey[200]
                                                : Colors.black,
                                            fontSize:
                                                ScreenUtil.instance.setSp(15.0),
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                                Container(
                                  child: Row(
                                    children: <Widget>[
                                      Container(
                                        child: Icon(
                                          Icons.face,
                                          color: _item.isSelected
                                              ? Colors.grey[200]
                                              : Colors.black,
                                          size: ScreenUtil.instance.setSp(19.0),
                                        ),
                                      ),
                                      Column(
                                        children: snapshot.data.documents
                                            .map((DocumentSnapshot document) {
                                          return Container(
                                            child: new Text(
                                              '${document['fname']}',
                                              style: new TextStyle(
                                                color: _item.isSelected
                                                    ? Colors.grey[200]
                                                    : Colors.black,
                                                fontSize: ScreenUtil.instance
                                                    .setSp(15.0),
                                              ),
                                            ),
                                          );
                                        }).toList(),
                                      ),
                                    ],
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ],
                      ),
                      decoration: new BoxDecoration(
                        color:
                            _item.isSelected ? Colors.blue : Colors.transparent,
                        border: new Border.all(
                          width: 0.5,
                          color: _item.isSelected ? Colors.blue : Colors.grey,
                        ),
                        borderRadius:
                            const BorderRadius.all(const Radius.circular(10.0)),
                      ),
                    ),
                  ],
                ),
              );
          }
        });
  }
}

class RadioModel {
  bool isSelected;
  final String buttonTitle;

  RadioModel(this.isSelected, this.buttonTitle);
}

我已经尝试删除限制，但它所做的只是在一个容器中显示所有名称，并且仍会继续重复并从所有容器中显示相同的名称

标签： listviewflutterdartstream-builder