键盘在 Flutter 上隐藏文本字段

时间:2021-02-17 12:13:49

标签: flutter flutter-layout

我有一个带有 textformfield 的底部应用栏的应用,但是当用户尝试在那里插入数据时,键盘会隐藏正在输入的文本。

我尝试了“resizeToAvoidBottomInset:true”但没有奏效,还尝试在应用程序主体上放置一个 SingleChildScrollView 并得到“RenderBox 未布局:RenderRepaintBoundary#32f0arelayoutBoundary=up1 NEEDS-PAINT 'package:flutter/src /rendering/box.dart':断言失败:第 1785 行 pos 12:'hasSize'”。

我需要一种在用户输入时使底部“扩展”到键盘顶部的方法,或者一种在屏幕上显示正在输入的文本的方法。

我该如何解决?我尝试了很多方法,但似乎没有任何效果。

我的应用程序的结构是:

enter image description here

代码:

Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: true,
      appBar: AppBar(
        title: Text(
          "xx",
        ),
        //+ produtosList1[0].cod_produto),
        actions: <Widget>[
          Padding(
              padding: EdgeInsets.only(right: 20.0),
              child: GestureDetector(
                onTap: () {
                  showDialog(
                      //dialog content
                      );
                },
                child: Icon(
                  Icons.search,
                  size: 26.0,
                ),
              )),
        ],
      ),
      drawer: Drawer(
          elevation: 20.0,
          child: ListView(padding: EdgeInsets.zero, children: <Widget>[
          ]
           //appbar content
          )),
      body: Column(
        children: [
          Container(
            color: Colors.blue,
            child: Padding(
                padding: const EdgeInsets.only(top: 8.0),
                child: Column(
                  children: [
                    Row(children: [
                      Text(
                         "xxx",
                          style: TextStyle(
                            color: Colors.white,
                          ),
                          overflow: TextOverflow.ellipsis),
                    ]),
                    Row(children: [
                      Text(
                          "xxxx",
                        style: TextStyle(color: Colors.white),
                      )
                    ])
                  ],
                )),
          ),
          Container(
            color: Colors.blue,
            child: Padding(
                padding: const EdgeInsets.fromLTRB(0, 8.0, 0, 8.0),
                child: Row(
                  children: <Widget>[
                    Expanded(
                      flex: 2,
                      child: Text("xxxx",
                          style: TextStyle(fontWeight: FontWeight.bold),
                          overflow: TextOverflow.ellipsis),
                    ),
                    Expanded(
                        flex: 1,
                        child: Text(
                          "xxxxx",
                          style: TextStyle(fontWeight: FontWeight.bold),
                        )),
                    Expanded(
                        flex: 4,
                        child: Text(
                          "xxxx",
                          style: TextStyle(fontWeight: FontWeight.bold),
                        )),
                    Expanded(
                        flex: 4,
                        child: Text(
                          "xxxx",
                          style: TextStyle(fontWeight: FontWeight.bold),
                        )),
                  ],
                )),
          ),
          Divider(
            height: 5.0,
          ),
          Expanded(
            child: ListView.builder(
                itemCount: produtosList1.length,
                itemBuilder: (context, index) {
                  return Padding(
                    padding: const EdgeInsets.fromLTRB(0.0, 4.0, 0.0, 4.0),
                    child: Row(
                      children: <Widget>[
                        Expanded(
                          flex: 2,
                          child: Text(
                         "xxxx"
                          ),
                        ),
                        Expanded(
                          flex: 1,
                          child: Text(
                           "xxxxx",
                            style: TextStyle(fontWeight: FontWeight.bold),
                          ),
                        ),
                        Expanded(
                          flex: 4,
                          child: Text(
                              "xxxx",
                              style: TextStyle(fontWeight: FontWeight.bold),
                              overflow: TextOverflow.ellipsis),
                        ),
                        Expanded(
                          flex: 4,
                          child: Text(
                             "xxxxx",
                              style: TextStyle(
                                  fontWeight: FontWeight.bold, fontSize: 12),
                              overflow: TextOverflow.ellipsis),
                        ),
                      ],
                    ),
                  );
                }),
          )
        ],
      ),
      bottomNavigationBar: BottomAppBar(
        child: Form(
          child: Container(
            height: 180.0,
            color: Colors.blue[400],
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: ListView(children: [
                Container(
                  height: 50,
                  decoration: BoxDecoration(
                    color: Colors.white,
                  ),
                  child: DropdownButtonFormField(
                    hint: Text('Choose '),
                    onChanged: (value) {
                   //dropdown values
                    },
                    items: newFuncionariosList,
                  ),
                ),
                Divider(
                  height: 6.0,
                ),
                Row(
                  children: [
                    Expanded(
                      flex: 2,
                      child: TextFormField(
                        controller: _codprodController,
                        decoration: InputDecoration(
                          icon: Icon(Icons.add),
                        ),
                      ),
                    ),
                    Expanded(
                      flex: 1,
                      child: ElevatedButton(
                        
                       //button content
                      ),
                    )
                  ],
                ),
                Divider(
                  height: 8.0,
                ),
                Row(
                  children: [
                    Expanded(
                        flex: 6,
                        child: Text(produtoDesc == null ? "- - -" : produtoDesc,
                            overflow: TextOverflow.ellipsis)),
                    Expanded(
                      flex: 2,
                      child: TextFormField(
                        keyboardType: TextInputType.number,
                        controller: _qtdController,
                        decoration: InputDecoration(hintText: "qtd"),
                      ),
                    ),
                    Expanded(
                        flex: 2,
                        child: ElevatedButton(
                          //button content
                            ))
                  ],
                )
              ]),
            ),
          ),
        ),
      ),
    );
  }

2 个答案:

答案 0 :(得分:0)

修复问题文本字段被键盘隐藏

new Scaffold(
      appBar: new AppBar(
          ...
      resizeToAvoidBottomPadding: true,
      ....

答案 1 :(得分:0)

使用 MediaQuery.of(context).viewInsets.bottom 并将其添加到底部导航高度

        child: Form(
          child: Container(
            height: 180.0 + MediaQuery.of(context).viewInsets.bottom,
            color: Colors.blue[400],
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: ListView(children: [
                Container(
                  height: 50,
                  decoration: BoxDecoration(
                    color: Colors.white,
                  ),
                ),```

相关问题