时间戳

首页 > 解决方案 > 当键盘打开警报对话框中的文本字段时隐藏

flutter - 当键盘打开警报对话框中的文本字段时隐藏

问题描述

我在按下按钮时创建了警报对话节目。在警报对话框中有一个文本字段，当键盘打开时会隐藏。我在下面添加了代码片段。

横向视图中的输出： 在此处输入图像描述

 class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          home: _MyAppState(),
        );
      }
    }
    class _MyAppState extends StatelessWidget {
      TextEditingController _textFieldController = TextEditingController();
    
      _displayDialog(BuildContext context) async {
        return showDialog(
            context: context,
            barrierDismissible: true,
            builder: (context) {
              return AlertDialog(
                title: Text('AlertDialog with TextField'),
                content: SingleChildScrollView(
                  child: TextField(
                    controller: _textFieldController,
                    decoration: InputDecoration(
                      hintText: "ENTER A TEXT",
                    ),
                    autofocus: true,
                  ),
                ),
                actions: <Widget>[
                  FlatButton(
                    child: Text('SUBMIT'),
                    onPressed: () {
                      Navigator.of(context).pop();
                    },
                  )
                ],
              );
            });
      }
    
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          home: Scaffold(
            appBar: AppBar(
              title: Text('AlertDialog with TextField '),
            ),
            body: Center(
              child: FlatButton(
                child: Text(
                  'Show Alert Dialogue',
                ),
                color: Colors.deepOrange,
                onPressed: () => _displayDialog(context),
              ),
            ),
          ),
        );
      }
}

标签： flutter

解决方案

删除 singlechildscriollview 并将文本字段包装在具有一定高度的容器内。当您将滚动项放入警告框中时，在某些情况下，键盘打开可能会产生问题。

   showDialog(
        context: context,
        barrierDismissible: true,
        builder: (context) {
          return AlertDialog(
            title: Text('AlertDialog with TextField'),
            content: Container(
              height: 35,  
              child: TextField(
                controller: _textFieldController,
                decoration: InputDecoration(
                  hintText: "ENTER A TEXT",
                ),
                autofocus: true,
              ),
            ),
            actions: <Widget>[
              FlatButton(
                child: Text('SUBMIT'),
                onPressed: () {
                  Navigator.of(context).pop();
                },
              )
            ],
          );
        });

推荐阅读