将项目动态附加到 ListView

Question

我是 Dart 和 Flutter 的新手，并尝试将新项目附加到我的 ListView。我创建了一个递增this.value但没有任何反应的按钮。我是否错过了 UI 上的更新调用，这是否是正确的方法？由于我将 的值ListView.builder直接返回给调用者，因此build我不确定如何获取列表以添加更多项目。非常感谢！

class MyList extends State<MyList> {

... 
int value = 2;

@override
Widget build(BuildContext context) {
return ListView.builder(
    itemCount: this.value,
    itemBuilder: (context, index) => this._buildRow(index)
);

TL;DR：调用setState正确的方法来触发 UI 更新吗？

Answer 1

调用setState是触发 UI 更新的正确方式。

从文档：

调用 setState 通知框架此对象的内部状态已更改，可能会影响此子树中的用户界面，这会导致框架为此 State 对象安排构建。

如果您只是直接更改状态而不调用 setState，则框架可能不会安排构建，并且此子树的用户界面可能不会更新以反映新状态。

这是一个ListView带有 a的小示例，Button它向其附加项目。

import 'package:flutter/material.dart';

void main() => runApp(new MaterialApp(home: MyList()));

class MyList extends StatefulWidget {
  @override
  _MyListState createState() => _MyListState();
}

class _MyListState extends State<MyList> {
  int value = 2;

  _addItem() {
    setState(() {
      value = value + 1;
    });
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: AppBar(
        title: Text("MyApp"),
      ),
      body: ListView.builder(
          itemCount: this.value,
          itemBuilder: (context, index) => this._buildRow(index)),
      floatingActionButton: FloatingActionButton(
        onPressed: _addItem,
        child: Icon(Icons.add),
      ),
    );
  }

  _buildRow(int index) {
    return Text("Item " + index.toString());
  }
}