I am working on a chat screen. This is my current code for the starting UI:

class ChatOtroUsuario extends StatefulWidget {
  const ChatOtroUsuario({Key key,  this.usuario, this.otroUsuario}) : super(key: key);

  final Usuario usuario;
  final OtroUsuario otroUsuario;

  @override
  _ChatOtroUsuarioState createState() => _ChatOtroUsuarioState();
}

class _ChatOtroUsuarioState extends State<ChatOtroUsuario> {

  @override
  void initState() {
    // TODO: implement initState
    super.initState();

  }

  @override
  Widget build(BuildContext context) {

    print("usuario " widget.usuario.username);
    print("otor usuario " widget.otroUsuario.username);

    final bottom = MediaQuery.of(context).viewInsets.bottom;

    return Scaffold(
      resizeToAvoidBottomInset: true,
      resizeToAvoidBottomPadding: false,

      
      body: SingleChildScrollView(
        reverse: true,
        child: Padding(
          padding: EdgeInsets.only(bottom: bottom),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              Container(
                width: MediaQuery.of(context).size.width,
                height: 60.0,
                color: AppColors.blancoMovMap,
                child: Row(
                  children: [
                    GestureDetector(
                      onTap: () {
                        Navigator.of(context).pop();
                      },
                      child: Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Container(
                          height: 30,
                          width: 30,
                          decoration: BoxDecoration(
                            shape: BoxShape.circle,
                            color: AppColors.rojoMovMap,
                          ),
                          child: Icon(
                            Icons.arrow_back_rounded,
                            color: Colors.white,
                          ),
                          alignment: Alignment.center,
                        ),
                      ),
                    ),
                    GestureDetector(
                      onTap: () {
                        Navigator.of(context).pushNamedAndRemoveUntil(
                            '/muro', (Route<dynamic> route) => false);
                      },
                      child: Container(
                        height: 30,
                        width: 30,
                        decoration: BoxDecoration(
                          shape: BoxShape.circle,
                          color: AppColors.rojoMovMap,
                        ),
                        child: Icon(
                          Icons.home,
                          color: Colors.white,
                        ),
                        alignment: Alignment.center,
                      ),
                    ),
                    SizedBox(
                      width: 5,
                    ),
                    CircleAvatar(
                      radius: 25,
                      backgroundImage: NetworkImage(
                          widget.otroUsuario.profile_image),
                    ),
                    SizedBox(
                      width: 5,
                    ),
                    Text("${widget.otroUsuario.username}",style: TextStyle(fontSize: 16,fontWeight: FontWeight.bold),),


                  ],
                ),
              ),
              Container(
                color: Colors.amber,
                width: MediaQuery.of(context).size.width,
                height: MediaQuery.of(context).size.height -110 ,
                child: Text("hola"),
              ),


              Container(
                color: Colors.green,
                height: 50,
                child: TextField(
                  decoration: InputDecoration(
                    hintText: "Escribe tu mensaje...",
                    hintStyle: TextStyle(color: Colors.black,fontSize: 16)
                  ),
                ),
              )
            ],
          ),
        ),
      ),

    );
  }
}

The issue is that as it is now, when entering the textfield to write a message, the keyboard appears hidding the textfield. As you may see, I have tried inserting all known solutions: wrapping the Column with a SingleChildScrollView widget, adding

resizeToAvoidBottomInset: true,
resizeToAvoidBottomPadding: false,

but keyboard is hidding the textfield, the view doesn't scroll together with the keyboard.

CodePudding user response：

Try these

1. Remove both resizeToAvoidBottomInset: true, and resizeToAvoidBottomPadding: false,

2. Remove these lines padding: EdgeInsets.only(bottom: bottom), and change the Padding widget to a Container widget

`

print("usuario " widget.usuario.username);
print("otor usuario " widget.otroUsuario.username);

final bottom = MediaQuery.of(context).viewInsets.bottom;

return Scaffold(
  resizeToAvoidBottomInset: true,
  resizeToAvoidBottomPadding: false,

  
  body: SingleChildScrollView(
    reverse: true,
    child: Padding(
      padding: EdgeInsets.only(bottom: bottom),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [
          Container(
            width: MediaQuery.of(context).size.width,
            height: 60.0,
            color: AppColors.blancoMovMap,
            child: Row(
              children: [
                GestureDetector(
                  onTap: () {
                    Navigator.of(context).pop();
                  },
                  child: Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: Container(
                      height: 30,
                      width: 30,
                      decoration: BoxDecoration(
                        shape: BoxShape.circle,
                        color: AppColors.rojoMovMap,
                      ),
                      child: Icon(
                        Icons.arrow_back_rounded,
                        color: Colors.white,
                      ),
                      alignment: Alignment.center,
                    ),
                  ),
                ),
                GestureDetector(
                  onTap: () {
                    Navigator.of(context).pushNamedAndRemoveUntil(
                        '/muro', (Route<dynamic> route) => false);
                  },
                  child: Container(
                    height: 30,
                    width: 30,
                    decoration: BoxDecoration(
                      shape: BoxShape.circle,
                      color: AppColors.rojoMovMap,
                    ),
                    child: Icon(
                      Icons.home,
                      color: Colors.white,
                    ),
                    alignment: Alignment.center,
                  ),
                ),
                SizedBox(
                  width: 5,
                ),
                CircleAvatar(
                  radius: 25,
                  backgroundImage: NetworkImage(
                      widget.otroUsuario.profile_image),
                ),
                SizedBox(
                  width: 5,
                ),
                Text("${widget.otroUsuario.username}",style: TextStyle(fontSize: 16,fontWeight: FontWeight.bold),),


              ],
            ),
          ),
          Container(
            color: Colors.amber,
            width: MediaQuery.of(context).size.width,
            height: MediaQuery.of(context).size.height -110 ,
            child: Text("hola"),
          ),


          Container(
            color: Colors.green,
            height: 50,
            child: TextField(
              decoration: InputDecoration(
                hintText: "Escribe tu mensaje...",
                hintStyle: TextStyle(color: Colors.black,fontSize: 16)
              ),
            ),
          )
        ],
      ),
    ),
  ),

);

CodePudding user response：

Please try to wrap with SingleChildScrollView, or give bottom insets padding.

 SingleChildScrollView(
child: Column(
  children: <Widget>[
    TextField(),
    TextField(),
    TextField(),
  ],),
),

OR

MediaQuery.of(context).viewInsets.bottom