Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter keyboard done button causes textfield content to vanish

I have 2 textfields in a form. When i click on done button on keyboard in the second text field , keyboard hides and both the text fields get empty. The same happes when i closes the keyboard manually, then also the content of the textfields get lost. It looks like the screen gets refresh evertime this happens. why is it so?

@override
  Widget build(BuildContext context) {
    TextEditingController nameTextFieldController = TextEditingController();
    TextEditingController emailTextFieldController = TextEditingController();

    FocusNode emailFocusNode = new FocusNode();

    // TODO: implement build
    return WillPopScope(
        onWillPop: () {
          moveToLastScreen();
        },
        child: Scaffold(
          appBar: AppBar(
            title: Text("Signup"),
            leading: IconButton(
                icon: Icon(Icons.arrow_back),
                onPressed: () {
                  moveToLastScreen();
                }),
          ),
          body: Form(
              key: _formKey,
              child: Container(
                child: ListView(
                  padding: EdgeInsets.only(top: 20, left: 35, right: 35),
                  children: <Widget>[
                    Center(
                        child: GestureDetector(
                            onTap: () {
                              imageSelectorGalary();
                            },
                            child: new Container(
                                width: 100.0,
                                height: 100.0,
                                child: _image == null
                                    ? new Image.asset(
                                        'images/profilepic.png',
                                        fit: BoxFit.fitWidth,
                                      )
                                    : new CircleAvatar(
                                        backgroundImage: new FileImage(_image),
                                        radius: 200.0,
                                      )))),
                    Text(
                      "NAME",
                      style: TextStyle(fontWeight: FontWeight.bold),
                    ),
                    Padding(
                      padding: EdgeInsets.only(top: 5, bottom: 10),
                      child: TextFormField(
                          inputFormatters:[
                            LengthLimitingTextInputFormatter(10),
                          ],
                          onFieldSubmitted: (String  value){
                            FocusScope.of(context).requestFocus(emailFocusNode);
                          },
                          keyboardType: TextInputType.text,
                          controller: nameTextFieldController,
                          validator: (String value) {
                            if (value.isEmpty) {
                              return 'Please enter the name';
                            }
                          },
                          decoration: InputDecoration(
                              border: OutlineInputBorder(
                                  borderRadius: BorderRadius.circular(5.0)),
                              contentPadding: EdgeInsets.only(
                                  top: 15, bottom: 15, left: 20, right: 20))),
                    ),
                    Text(
                      "EMAIL ID",
                      style: TextStyle(fontWeight: FontWeight.bold),
                    ),
                    Padding(
                      padding: EdgeInsets.only(top: 5, bottom: 10),
                      child: TextFormField(
                        controller: emailTextFieldController,
                        focusNode: emailFocusNode ,
                        onFieldSubmitted: (String  value){
                          FocusScope.of(context).requestFocus(new FocusNode());
                        },
                        validator: (String value){
                          if(value.isEmpty){
                            return "Please enter your email-id";
                          }
                        },
                        decoration: InputDecoration(
                            contentPadding: EdgeInsets.only(
                                top: 15, bottom: 15, left: 20, right: 20),
                            border: OutlineInputBorder(
                                borderRadius: BorderRadius.circular(5.0))),
                      ),
                    ),
                    Text(
                      "CITY AND AREA",
                      style: TextStyle(fontWeight: FontWeight.bold),
                    ),
                    GestureDetector(
                        onTap: () {
                          CityAreasDialog cityAreasDialog =
                              new CityAreasDialog();
                          cityAreasDialog.information(context);
                        },
                        child: Container(
                          margin: EdgeInsets.only(top: 5, bottom: 10),
                          padding: EdgeInsets.only(left: 20, right: 20),
                          decoration: new BoxDecoration(
                              border: new Border.all(color: CustomColors.grey),
                              borderRadius: BorderRadius.all(Radius.circular(
                                      5.0) //                 <--- border radius here
                                  )),
                          child: Container(
                              padding: EdgeInsets.only(top: 10, bottom: 10),
                              child: Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                children: <Widget>[
                                  Column(
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    children: <Widget>[
                                      Text("Select Your City"),
                                      Text(
                                        "and area",
                                        style: TextStyle(
                                            color: Colors.grey, fontSize: 10),
                                      )
                                    ],
                                  ),
                                  Icon(
                                    Icons.arrow_drop_down,
                                    color: Colors.black,
                                  )
                                ],
                              )),
                        )),
                    Container(
                        margin: EdgeInsets.only(top: 20, left: 10, right: 10),
                        child: RaisedButton(
                          onPressed: () {
                            debugPrint("Next Click");
                            onSignup();
                          },
                          child: new Text(
                            "NEXT",
                          ),
                        ))
                  ],
                ),
              )),
        ));
  }
like image 651
Paras Dhawan Avatar asked Dec 27 '18 13:12

Paras Dhawan


1 Answers

This issue is because you are creating new TextEditingController every time your widget is rebuilt. So to fix this issue, move these variables nameTextFieldController ,emailTextFieldController outside your build method.

Like this:

  TextEditingController nameTextFieldController = TextEditingController();
   TextEditingController emailTextFieldController = TextEditingController();

@override
  Widget build(BuildContext context) {
    ...
like image 182
diegoveloper Avatar answered Sep 25 '22 14:09

diegoveloper