键盘隐藏TextField-Flutter

时间:2020-05-26 18:31:48

标签: flutter keyboard widget

我创建了一个聊天页面,其中包含标题,一个MessagesStream和一个Row,其中包含TextFieldRaisedButton。我已经在GitHub和StackOverflow中检查了有关此问题的每个页面,但是找不到任何解决方案。当启动键盘时,该行不会上升,而是越过屏幕的底部,隐藏所有内容。

有人可以帮我解决这个问题吗?我真的尝试了一切。

这是我的Scaffold

  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: (){
        FocusScope.of(context).requestFocus(new FocusNode());
      },
      child: Scaffold(
        resizeToAvoidBottomInset: true,
        backgroundColor: Colors.lightGreenAccent,
        appBar: new AppBar(
          backgroundColor: Colors.lightGreenAccent,
          elevation: 0,
          leading: IconButton(
            icon: Icon(Icons.arrow_back_ios, color: Colors.white),
            onPressed: () => Navigator.of(context).pop(),
          ),
          centerTitle: true,
          title: Image(
            image: iconApp,
            height: 50,
            width: 50,
          ),
        ),
        body: SafeArea(
          child: Column(
            children: <Widget>[
              SizedBox(height: 10),
              Expanded(
                child: Container(
                  width: double.infinity,
                  decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.only(topLeft: Radius.circular(30.0),
                        topRight: Radius.circular(30.0)),
                  ),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: <Widget>[
                      Material(
                        borderRadius: BorderRadius.only(topLeft: Radius.circular(30.0),
                        topRight: Radius.circular(30.0)),
                        color: grayWhite,
                        elevation: 2,
                        child: Padding(
                          padding: const EdgeInsets.only(bottom:10),
                          child: Row(
                            children: <Widget>[
                              Padding(
                                padding: const EdgeInsets.only(top: 10.0, left: 15),
                                child: CircleAvatar(
                                  child: Image.network(
                                  ),
                                ),
                              ),
                              Container(
                                child: Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: <Widget>[
                                    Padding(
                                      padding: const EdgeInsets.only(top: 10, left: 15),
                                      child: Text(
                                        "Test",
                                        style: TextStyle(
                                            color: Colors.black54,
                                            fontSize: 20
                                        ),
                                      ),
                                    ),
                                    Padding(
                                      padding: const EdgeInsets.only(top: 3, left: 15),
                                      child: Text(
                                       "Test2",
                                        style: TextStyle(
                                            color: Colors.black54,
                                            fontSize: 15
                                        ),
                                      ),
                                    ),
                                    Container(
                                      height: 1,
                                      color: Colors.white70,
                                    )
                                  ],
                                ),
                              )
                            ],
                          ),
                        ),
                      ),
                      MensagensStream(),
                      Row(
                        children: <Widget>[
                          Expanded(
                            child: Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: TextField(
                                controller: textEditingController,
                                autofocus: true,
                                autocorrect: true,
                                onChanged: (value) {
                                  mensagem = value;
                                },
                                decoration: InputDecoration(
                                    border: OutlineInputBorder(
                                      borderRadius: BorderRadius.circular(30.0),
                                    ),
                                    hintText: "Digite a sua mensagem..."
                                ),
                              ),
                            ),
                          ),
                          ButtonTheme(
                            height: 55,
                            minWidth: 10,
                            child: RaisedButton(
                              shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(
                                    100,
                                  )
                              ),
                              color: Colors.lightGreenAccent,
                              child: Icon(Icons.send, color: Colors.white),
                              onPressed: () => {
                                textEditingController.clear(),
                                firestore.collection('mensagens').add({
                                  'Mensagem': mensagem,
                                  'Remetente': googleEmail,
                                  'Destinatario': "patio@teste.com",
                                  'DataHorario': FieldValue.serverTimestamp(),
                                })
                              },
                            ),
                          ),
                        ],
                      )
                    ],
                  ),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}```

2 个答案:

答案 0 :(得分:0)

Column包裹您SingleChildScrollView中的一个(可能是外面的)。问题在于,仅弹出键盘并不会突然告诉布局它需要能够滚动。您已经明确表示希望它能够滚动。

有关SingleChildScrollView的更多信息,请参见this

答案 1 :(得分:0)

您可以使用Scaffold并将文本字段放置为bottomSheet