Flutter：如何在点击 ListTile 后使用 showDialog 提示用户输入，然后使用输入答案

【问题标题】：Flutter: how to prompt user for input using showDialog after tapping on ListTile, then using the inputFlutter：如何在点击 ListTile 后使用 showDialog 提示用户输入，然后使用输入
【发布时间】：2021-05-04 16:21:55
【问题描述】：

假设我有以下代码，

 Widget _myListView(BuildContext context) {
  return ListView(
    children: <Widget>[
      ListTile(
        title: Text('Sun'),
        onTap:() async{
           await showDialog<String>(
                    context:context,
                    --- not sure how to proceed from here --
                 }
        }
           Navigator.pop(context); //this code makes sure it go back to another page after done with the input processing.
      ),
      ListTile(
        title: Text('Moon'),
      ),
      ListTile(
        title: Text('Star'),
      ),
    ],
  );
}

如何使用输入 onTap ListTile，运行一些方法来使用输入，然后弹回上一页。

【问题讨论】：

标签： flutter dart

【解决方案1】：

您需要在 Dialog 内部创建一个TextField，并在弹出 Dialog 时传递其值。

更新你的点击方法如下：

onTap: () async {
  final inputData = await showDialog(
    context: context,
    barrierDismissible:
        false, // prevent user from closing the dialog by pressing outside the dialog
    builder: (_) {
      String userData;
      return AlertDialog(
        title: new Text("Enter your detail"),
        content: new TextField(
          onChanged: (value) {
            userData = value;
          },
        ),
        actions: <Widget>[
          FlatButton(
            child: Text('Ok'),
            onPressed: () {
              Navigator.of(context).pop(userData);
            },
          )
        ],
      );
    },
  );
  Navigator.of(context).pop(inputData); // pass data back to the previous page
}

【讨论】：