Flutter - 当键盘打开时它会阻塞我的文本字段

标签 flutter dart

当我在表单中选择我的文本字段时,键盘会弹出,但它会阻止我输入或转到下一个项目。

我添加了一个 Inkwell 只是为了摆脱它。

此页面是从我的主页加载的,我的 Scaffold 所在的主页有一个底部导航栏,当您单击导航栏时,它会将此页面加载到正文中。

我尝试将 resizeToAvoidBottomPadding: false 添加到脚手架,然后将我的代码包装在 SingleChildScrollView 中,但没有成功。

@override
  Widget build(BuildContext context) {
    return Center(
      key: scaffoldKey,
      child: InkWell(
          splashColor: Colors.transparent,
          onTap: (){
            FocusScope.of(context).requestFocus(FocusNode());
          },
          child: ListView(
            shrinkWrap: false,
            children: <Widget>[
              Container(
                width: MediaQuery.of(context).size.width,
                height: 150,
                decoration: BoxDecoration(
                  image: DecorationImage(
                    fit: BoxFit.fill,
                    image: AssetImage("assets/images/prayer.png"),
                  ),
                ),
              ),
              Container(
                padding: EdgeInsets.all(15.0),
                child: Text(
                  "Share Your Prayer Request",
                  style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold),
                ),
              ),
              Container(
                padding: EdgeInsets.fromLTRB(15, 0, 15, 0),
                child: Text(
                  "We’d love to pray with you! Please complete the form below to submit your prayer request and our staff will pray for you this week.",
                  style: TextStyle(
                    fontSize: 14,
                  ),
                ),
              ),
              SizedBox(
                height: 10,
              ),
              Form(
                key: _formKey,
                child: Column(
                  children: <Widget>[
                    Container(
                      padding: EdgeInsets.fromLTRB(15, 0, 15, 0),
                      child: Column(
                        children: <Widget>[
                          TextFormField(
                            onSaved: (val) {
                              if (val == '') {
                                newPrayer.name = "Name Not Entered";
                              } else {
                                newPrayer.name = val;
                              }
                            },
                            cursorColor: Colors.lightGreen,
                            keyboardType: TextInputType.text,
                            decoration: InputDecoration(
                                labelText: 'Name',
                                //labelStyle: TextStyle(color: myFocusNode.hasFocus ? Colors.black : Colors.grey),
                                hintText: 'Enter Your First and Last Name',
                                focusedBorder: OutlineInputBorder(
                                    borderSide: BorderSide(color: Colors.lightGreen)),
                                border: OutlineInputBorder(borderSide: BorderSide())),
                          ),
                        ],
                      )

                    ),

...

当我选择一个文本字段时,我真的很想看到页面向上滚动,这样人们就可以看到它并到达提交按钮。

最佳答案

脚手架不是包含其他页面的页面。每个页面都需要自己的脚手架。因此,如果这是它自己的页面,那就是您的问题。将您的 Center 小部件包装到它自己的脚手架中。

关于Flutter - 当键盘打开时它会阻塞我的文本字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56431531/

相关文章:

javascript - 如何从 JSON API 获取到表的 HTTP 请求

dart - 将 ListTile 图标左对齐

flutter - GoogleAuthProvider - 选择帐户的选项

dart - 为自定义组件提供回调

flutter - 如何在 flutter 的 ListView 中设置卡片的宽度?

dart - 一个如何更新ListView子级?

android - “元素”是从 2 个包中导入的

dart - 如何在 VSCode 中移动 dart 文件并保持导入正确

android - Android 9上的Flutter WebView插件错误

flutter - 我迁移到空安全,我不能在没有抛出错误的情况下运行 "flutter pub run build_runner build"