Question

我正在尝试创建一个应用程序，以便能够从Cloud Firestore获取数据并使用该数据创建多个自定义小部件。

自定义窗口小部件为eventCardWidget

import 'package:flutter/material.dart';
import 'package:do_and_stuff/settings/theme.dart';

class EventCardWidget extends StatelessWidget {
  EventCardWidget(this.eventImage, this.eventTitle, this.eventDescription,
      this.eventAddress, this.eventDate, this.eventTime, this.peopleRequired);

  String eventTitle;
  String eventAddress;
  String eventDate;
  String eventImage;
  String eventTime;
  String eventDescription;
  int peopleRequired;

  @override
  Widget build(BuildContext context) {
    return Material(
      child: GestureDetector(
        child: InkWell(
          splashColor: ThemeSettings.CardInkwell,
          onTap: () {},
          child: Card(
            elevation: 1.0,
            margin: const EdgeInsets.symmetric(vertical: 8.0, horizontal: 14.0),
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Container(
                  margin: const EdgeInsets.only(right: 19.0),
                  width: 100.0,
                  height: 100.0,
                  child: Image.asset(this.eventImage, scale: .5),
                ),
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      Row(
                        children: <Widget>[
                          Expanded(
                            child: Container(
                              margin: const EdgeInsets.only(
                                  top: 12.0, bottom: 10.0),
                              child: Text(
                                eventTitle,
                                style: TextStyle(
                                  fontSize: 18.0,
                                  color: Colors.black,
                                  fontWeight: FontWeight.bold,
                                ),
                              ),
                            ),
                          ),
                          Container(
                            margin: const EdgeInsets.only(right: 10.0),
                            child: Text(
                              this.eventAddress,
                              style: TextStyle(
                                  fontSize: 16.0,
                                  fontWeight: FontWeight.bold,
                                  color: Colors.grey[600]),
                            ),
                          ),
                        ],
                      ),
                      Container(
                        margin: const EdgeInsets.only(right: 10.0),
                        child: Text(
                          this.eventDescription,
                          style: TextStyle(
                            fontSize: 16.0,
                          ),
                          maxLines: 3,
                          overflow: TextOverflow.ellipsis,
                        ),
                      ),
                      Container(
                        padding: EdgeInsets.fromLTRB(0.0, 25.0, 0.0, 0.0),
                        margin: const EdgeInsets.only(top: 10.0),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: <Widget>[
                            Text(
                              this.eventDate,
                              style: TextStyle(
                                color: Colors.grey[500],
                                fontSize: 11.0,
                              ),
                            ),
                            Container(
                                margin: const EdgeInsets.only(right: 10.0),
                                child: Text(peopleRequired.toString())),
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

现在，在我的Widget build(BuildContext context) {上方我有 List<Widget> cards = [];

然后在Widget build(BuildContext context) {中，我有children: cards,

因此，在这一点上，此页面将打开，并且卡初始化为空。但是，我现在有

  void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((_) async {
      final List results = await db.getEvent(
        DateFormat("y-MM-dd").format(DateTime.now()),
        DateFormat("y-MM-dd").format(DateTime.now().add(Duration(days: 20))),
        2,
      );
      for (DocumentSnapshot result in results) {
        cards.add(EventCardWidget(
          "assets/flutter-icon.png",
          result.data.values
              .toList()[result.data.keys.toList().indexOf("name")],
          result.data.values
              .toList()[result.data.keys.toList().indexOf("description")],
          "1 mi",
          "2018-10-29",
//            result.data.values
//                .toList()[result.data.keys.toList().indexOf("eventDate")],
          "Time",
          result.data.values
              .toList()[result.data.keys.toList().indexOf("num")],
        ));
        setState(() {
          return cards;
        });
      }
    });
  }

现在，在Android Studio中，我可以在设置断点时看到cards具有更多元素，但是屏幕上没有任何更新。

现在奇怪的是，当我做类似

的操作时

  void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((_) async {
      final List results = await db.getEvent(
        DateFormat("y-MM-dd").format(DateTime.now()),
        DateFormat("y-MM-dd").format(DateTime.now().add(Duration(days: 20))),
        2,
      );
      for (DocumentSnapshot result in results) {
        setState(() {
          return cards = List.generate(
            3,
            (i) => new EventCardWidget(
                "assets/flutter-icon.png",
                "Title",
                "Description",
                "12 mi",
                "2018-10-29",
                "Time",
                5),
            growable: true,
          );
        });
      }
    });
  }

然后屏幕上的文本更新。

有什么想法吗？

这不是重复的，因为我尝试了解决方法Here，但仍然无法正常工作

  for (DocumentSnapshot result in results) {
    setState(() {
      cards = List.from(cards)
        ..add(EventCardWidget(
          "assets/flutter-icon.png",
          result.data.values
              .toList()[result.data.keys.toList().indexOf("name")],
          result.data.values
              .toList()[result.data.keys.toList().indexOf("description")],
          "1 mi",
          "2018-10-29",
          result.data.values.toList()[
              result.data.keys.toList().indexOf("peopleRequired")],
        ));
    });
  }

Answer 1

当我这样做时，您的代码就开始为我工作

  for (DocumentSnapshot result in results) {
    cards = List.from(cards)
      ..add(EventCardWidget(
        "assets/flutter-icon.png",
        result.data.values
            .toList()[result.data.keys.toList().indexOf("name")],
        result.data.values
            .toList()[result.data.keys.toList().indexOf("description")],
        "1 mi",
        "2018-10-29",
        "8:00pm",
        result.data.values
            .toList()[result.data.keys.toList().indexOf("peopleRequired")],
      ));
    setState(() {
      this.cards = cards;
    });
  }

setState（）仅使用List.generate更新

1 个答案: