首页 > 解决方案 > Flutter,如何在从详细视图更新内容后更新列表视图中项目中的文本?

问题描述

我正在点击此链接 https://medium.com/ .../developing-for-multiple-screen-sizes-a... 来创建主详细信息 ipad 应用程序。我有一个场景,详细页面中有一个文本字段和按钮。当我更改文本字段值并按下按钮时,该特定索引处的列表视图项(左侧)也应更新。有人可以建议解决方法吗?

标签: flutter

解决方案


您可以将编辑后的对象返回Navigator.pop(context,object)Navigator.push()调用者。我为您编写了一个示例应用程序。

数据类:

class Item {
  final String name;
  Item(this.name);
}

主页,我在其中显示项目:

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  Item item = Item('ali2236');

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Container(
        child: Center(
          child: Column(
            children: <Widget>[
              Text(item.name),
              FlatButton(
                child: Text('edit'),
                onPressed: () {
                  Navigator.of(context)
                      .push(MaterialPageRoute(builder: (context) {
                    return ItemEditingPage(
                      item: item,
                      callbackFunction: (editedItem){
                        setState(() {
                          item = editedItem;
                        });
                      },
                    );
                  }));
                },
              ),
            ],
          ),
        ),
      ),
    );
  }
}

和编辑页面:

class ItemEditingPage extends StatefulWidget {
  final Item item;
  final void Function(Item item) callbackFunction;

  const ItemEditingPage({Key key, this.item, this.callbackFunction}) : super(key: key);

  @override
  _ItemEditingPageState createState() => _ItemEditingPageState();
}

class _ItemEditingPageState extends State<ItemEditingPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: Center(
          child: FlatButton(
            child: Text('change name to aligator'),
            onPressed: () {
              ///
              /// if the name is [final], you create a new Item and pass it back
              ///
              Item item = Item('aligator');
              widget.callbackFunction(item);

              ///
              /// if the name is not final you can just change it on the current object
              ///
              //widget.item.name = 'aligator';
              //widget.callbackFunction(widget.item);
            },
          ),
        ),
      ),
    );
  }
}

编辑:使用回调函数而不是Navigator.pop()通知展示页面。


推荐阅读