flutter - Flutter：键盘隐藏的TextFormField

Question

我有一个像这样的身份验证屏幕：

  @override
  Widget build(BuildContext context) {
    final bottom = MediaQuery.of(context).viewInsets.bottom;

    return Scaffold(
      resizeToAvoidBottomInset: false,
      resizeToAvoidBottomPadding: false,
      body: SingleChildScrollView(
        reverse: true,
        child: Padding(
          padding: EdgeInsets.only(bottom: bottom),
          child: Column(
            children: <Widget>[
              SizedBox(height: 48),
              Image.asset(
                "assets/images/logo.png",
                width: 132,
              ),
              SizedBox(height: 48),
              Form(
                child: Column(
                  children: <Widget>[
                    AuthTextFormField(
                      icon: Icons.email_outlined,
                      labelText: 'Email',
                      keyboardType: TextInputType.emailAddress,
                    ),
                    AuthTextFormField(
                      icon: Icons.lock_outline,
                      labelText: 'Password',
                      obscureText: true,
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

我遵循了这个答案，但它仍然对我不起作用。键盘仍然覆盖了文本字段。任何想法？

谢谢你。

[更新] 我使用上面答案中编写的代码（由 Jay Jay 编写）。而且，这是屏幕截图：

它的覆盖是这样的：

Answer 1

这Code对我来说很好，我已经删除了image并Container在其位置添加了一些height.

我还对您的代码进行了一些更改，

Scaffold(
      resizeToAvoidBottomPadding: true,
      body: SingleChildScrollView(
        child: Padding(
          padding: EdgeInsets.only(bottom: bottom),
          child: Column(
            children: <Widget>[
              SizedBox(height: 48),
              Container(
                color: Colors.blue,
                height: 500,
              ),
              SizedBox(height: 48),
              Form(
                child: Column(
                  children: <Widget>[
                    TextFormField(
                      decoration: InputDecoration(
                          icon: Icon(Icons.email), labelText: 'Email'),
                      keyboardType: TextInputType.emailAddress,
                    ),
                    TextFormField(
                      decoration: InputDecoration(
                          icon: Icon(Icons.lock_outline),
                          labelText: 'Password'),
                      obscureText: true,
                    ),
                    TextFormField(
                      decoration: InputDecoration(
                          icon: Icon(Icons.email), labelText: 'Email'),
                      keyboardType: TextInputType.emailAddress,
                    ),
                    TextFormField(
                      decoration: InputDecoration(
                          icon: Icon(Icons.email), labelText: 'Email'),
                      keyboardType: TextInputType.emailAddress,
                    ),
                    TextFormField(
                      decoration: InputDecoration(
                          icon: Icon(Icons.email), labelText: 'Email'),
                      keyboardType: TextInputType.emailAddress,
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );

Answer 2

在尝试之后，我认为你应该只为你的 image.asset 添加一个高度，或者更好地使用一个容器并在其装饰属性中指定图像并给容器一个固定的高度。它应该都能正常工作。

这是我的有效代码：

return Scaffold(
  resizeToAvoidBottomInset: false,
  resizeToAvoidBottomPadding: false,
  body: SingleChildScrollView(
    reverse: true,
    child: Padding(
      padding: EdgeInsets.only(bottom: bottom),
      child: Column(
        children: <Widget>[
          SizedBox(height: 48),
          Container(
            height: 300,
            color: Colors.red,
          ),
          SizedBox(height: 48),
          Form(
            child: Column(
              children: <Widget>[
                TextFormField(
                  decoration: InputDecoration(
                    icon:Icon(Icons.email),
                    labelText: 'Email'
                  ),
                  keyboardType: TextInputType.emailAddress,
                ),
                TextFormField(
                  decoration: InputDecoration(
                    icon: Icon(Icons.lock_outline),
                    labelText: 'Password'
                  ),
                  obscureText: true,
                ),
              ],
            ),
          ),
        ],
      ),
    ),
  ),
);