如何在ListView的顶部插入小部件？

Question

简要说明：

在我的所有代码示例中，您将看到像material.Widget而不仅仅是Widget之类的东西。这是因为我喜欢这样命名我的导入，例如：

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

我的问题：

我试图让ListView在列表顶部显示新添加的小部件。我有一个简单的有状态窗口小部件，它只包含一个模型列表（包含构建进入ListView的窗口小部件的必要信息的类），并且应该根据该列表构造ListView的子窗口。

class Page extends material.StatefulWidget {
  final List<CardModel> cardModels;
  Page(this.cardModels);

  @override
  _PageState createState() => new _PageState(cardModels);
}

class _PageState extends material.State<Page> {
  List<CardModel> cardModels;

  _PageState(this.cardModels);

  @override
  material.Widget build(material.BuildContext context) {
    return new material.ListView(
      children: cardModels.map((cardModel) => new Card(cardModel.cardID)).toList(),
    );
  }
}

我期望的行为是，每当调用构建方法（并正确使用setState）时，ListView应该正确重建并按列表的顺序包含子窗口小部件。如果我只是按顺序向cardModels添加新模型，它会成功执行此操作：

cardModels.add(new CardModel(nextID++));

您可以看到小部件按顺序添加，其ID正确递增：

但是，我希望在顶部插入较新的小部件（在顶部会显示较高的ID）。为了实现这一点，我尝试在列表的开头插入新模型：

cardModels.insert(0, new CardModel(nextID++));

不幸的是，我没有看到正确的小部件，而是一次又一次地获取id为0的小部件：

我知道模型列表正在正确更新，因为我可以将其打印出来并按降序查看ID。我假设有一些关于flutter如何检测导致此行为的小部件的更改，但经过大量阅读后，我仍然无法弄明白。任何帮助将非常感激。此外，我在小部件中调用set state，最终构建页面（包含ListView的小部件）作为其子代之一：

btn = new FloatingActionButton(
          onPressed: () => setState(_pageController.addCard),
          tooltip: 'Upload File',
          child: new Icon(Icons.file_upload),
        );

_pageController是修改模型列表的对象。如果这还不够，请告诉我，我很乐意提供更多代码或回答任何问题。