Flutter TextField 溢出键盘底部向上

如何解决Flutter TextField 溢出键盘底部向上

问题来了： 我有一个网格（填字游戏）和它下面的问题列表。我需要从网格中独立滚动的问题列表。当我点击网格输入答案并且键盘出现时，我收到溢出错误并且网格不会移动，因此我用来输入答案的焦点文本字段不可见（如果它在网格上足够低以被键盘盖住）。 我尝试了 ListView 和 Expanded 小部件的各种组合......没有解决方案......我不能使用 resizeToAvoidBottomInset: false 因为我需要网格向上移动并保持聚焦的 TextField 可见。 代码如下：

Widget build(BuildContext context) {
    return Scaffold(
     appBar: AppBar(
        title: Text(widget.title),),body: Column(
        children:[
          FutureBuilder(
          future: grid,builder: (context,snapshot) {
            if (snapshot.hasData) {
              return  Align(
                    alignment: Alignment.topCenter,child: Container(
                    width: MediaQuery.of(context).size.width-8,margin: EdgeInsets.zero,padding: EdgeInsets.zero,child: GridView.count(
                      padding: EdgeInsets.only(left:0.0,top:5.0,right:0.0,bottom: 0.0),shrinkWrap: true,crossAxisCount: 15,mainAxisSpacing: 2,crossAxisSpacing: 2,children: List.generate(snapshot.data.length,(index) {
                        if(gridFilled.length < snapshot.data.length) {
                          gridFilled.add(snapshot.data[index]);
                        }
                        return FocusScope(
                            node: _node,child: Container(
                              decoration: BoxDecoration(
                                  color: snapshot.data[index] == "#" ? Colors.black : Colors.white,border: Border.all(color: Colors.black)),child:
                              snapshot.data[index] == "#"
                                  ? Text('#')
                                  : _isTextField(gridFilled[index],index),));
                      }),);
            } else if (snapshot.hasError) {
              return Text("${snapshot.error}");
            }
            return CircularProgressIndicator();
          },SizedBox(width: MediaQuery.of(context).size.width,height: 15.0,Expanded(
            child: QPanel(dir: widget.dir,dbName: widget.xwordnumber),//this is a ListView with the questions
            ),]),drawer: Drawer(
        child: ListView(
            padding: EdgeInsets.zero,children:<Widget>[
              //just menu items
            ]
        ),);
  }

不幸的是，我还不允许发布图片......没有足够的声誉......请，任何帮助将不胜感激！

解决方法

将您的 Column 包裹在 SingleChildScrollView 中。

例如：

SingleChildScrollView(
    child:Column(
  crossAxisAlignment: CrossAxisAlignment.start,mainAxisAlignment: MainAxisAlignment.start,children: <Widget>[
    Text('We move under cover and we move as one'),Text('Through the night,we have one shot to live another day'),Text('We cannot let a stray gunshot give us away'),Text('We will fight up close,seize the moment and stay in it'),Text('It’s either that or meet the business end of a bayonet'),Text('The code word is ‘Rochambeau,’ dig me?'),],)
 )

,

您可以将整列包裹在 SingleChildScrollView() 中