如何创建一个能够接受文本输入并在flutter中显示结果的对话框?

问题描述 投票:2回答:1

我想要一个能够允许用户输入信息并在对话框内的列表视图中显示它的对话框。

这是我用于listview的代码。

new ListView.builder(
            itemBuilder: (context, index) {
              return _infos.isNotEmpty
                  ? new ListTile(
                      title: new Text(_infos[index].toMap().toString()),
                    )
                  : null;
            },
            shrinkWrap: true,
          )

这是我在textfield中使用onchange的代码

setState(() {_infos= _result;});

dart flutter
1个回答
4
投票

对于你要求的东西,这是一个快速丑陋的例子,只是传递这个概念:

enter image description here

class DialogExample extends StatefulWidget {

  @override
  _DialogExampleState createState() => new _DialogExampleState();
}

class _DialogExampleState extends State<DialogExample> {
  String _text = "initial";
  TextEditingController _c;
  @override
  initState(){
    _c = new TextEditingController();
    super.initState();
  }
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new Center(
        child: new Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            new Text(_text),
            new RaisedButton(onPressed: () {
              showDialog(child: new Dialog(
                child: new Column(
                  children: <Widget>[
                    new TextField(
                        decoration: new InputDecoration(hintText: "Update Info"),
                        controller: _c,

                    ),
                    new FlatButton(
                      child: new Text("Save"),
                      onPressed: (){
                        setState((){
                        this._text = _c.text;
                      });
                      Navigator.pop(context);
                      },
                    )
                  ],
                ),

              ), context: context);
            },child: new Text("Show Dialog"),)
          ],
        )
      ),
    );
  }
}
© www.soinside.com 2019 - 2024. All rights reserved.