Flutter 键盘使文本字段隐藏 [英] Flutter Keyboard makes textfield hide

问题描述

我是 Flutter 的新手.我添加了一个带有文本字段的表单，当我单击文本字段并且键盘出现时，文本字段会上升.

I'm new to flutter. I've added a form with a text field and when I clicked the textfield and keyboard comes, the textfield goes up.

这是我的代码:

Widget build(BuildContext context) {

MediaQueryData mediaQuery = MediaQuery.of(context);
return new Scaffold(
  body:  new Container(
      color: Colors.purple,
      constraints: new BoxConstraints.expand(),
      padding: EdgeInsets.only(top: 10.0,left: 10.0,right: 10.0, bottom: mediaQuery.viewInsets.bottom, ),
      child: SingleChildScrollView(
        child: Container(
            child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  SizedBox(height: 12.0),
                  Text(
                    'What is your Business Name?',
                    style: TextStyle(fontSize: 24.0),
                  ),
                  AppForm(),
                ],
              ),
            padding: EdgeInsets.only(left: 10.0,right: 10.0, bottom: mediaQuery.viewInsets.bottom),
            decoration: BoxDecoration(
              borderRadius: BorderRadius.all(Radius.circular(30.0)),
              color: Colors.white,
                ),
              )
          )
      ),
    );
  }

这是不打开键盘的结果:无键盘图像

This is the result without opening the keyboard: Image without keyboard

这是打开键盘后的图像:打开键盘后的图片

This is the image after opening the keyboard: Image after opening the keyboard

这是我的颤振医生输出.

Here is my flutter doctor output.

Doctor summary (to see all details, run flutter doctor -v): [√] Flutter 
(Channel beta, v0.5.1, on Microsoft Windows [Version 10.0.17134.165], locale 
en-US) [√] Android toolchain - develop for Android devices (Android SDK 
28.0.0) [√] Android Studio (version 3.1) [!] VS Code, 64-bit edition (version 
1.25.1) [!] Connected devices ! No devices available ! Doctor found issues in 
2 categories.

知道如何解决这个问题吗?

any idea how to fix this?

推荐答案

我就是这种情况.您肯定是将一个脚手架包裹在另一个脚手架内.您的 flutter 应用程序中应该只有一个脚手架小部件，即主布局.简单地移除您拥有的所有祖先脚手架并只保留一个脚手架.不要将脚手架包裹到另一个脚手架中.尽管如此，您可以将脚手架包裹在容器中.

This was the case with me . You are definitely wrapping a scaffold inside another scaffold . there should be only one scaffold widget inside your flutter app i.e the main layout . Simple remove all the ancestor scaffolds you have and keep only one scaffold . dont wrap a scaffold into another scaffold .inspite of that you can wrap a scaffold inside a container .

确保在您的 main.dart 文件中您没有这样做:-

Make sure in your main.dart file you are not doing this :-

✖✖

return Scaffold(
body : YourNewFileName(),
);

尽管上面的代码这样做:-✔✔

Inspite of the above code do this:- ✔✔

return YourNewFileName();

这篇关于Flutter 键盘使文本字段隐藏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！