I'm new to flutter, I'm trying to send the email and the password to the database, but I don't know how to put multiple controllers in one TextFormField. Could you please help me, guys? Thanks

This is the code I'm working on:

  TextEditingController email = TextEditingController();
  TextEditingController pass = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        buildInputForm('Email', false),
        buildInputForm('Password', true),
      ],
    );
  }

  Padding buildInputForm(String label, bool pass) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: 5),
      child: TextFormField(
        //controller: email,pass,
        obscureText: pass ? _isObscure : false,
        decoration: InputDecoration(
            labelText: label,
            labelStyle: TextStyle(
              color: kTextFieldColor,
            ),
            focusedBorder: UnderlineInputBorder(
              borderSide: BorderSide(color: kPrimaryColor),
            ),
            suffixIcon: pass
                ? IconButton(
                    onPressed: () {
                      setState(() {
                        _isObscure = !_isObscure;
                      });
                    },
                    icon: _isObscure
                        ? Icon(
                            Icons.visibility_off,
                            color: kTextFieldColor,
                          )
                        : Icon(
                            Icons.visibility,
                            color: kPrimaryColor,
                          ),
                  )
                : null),
      ),
    );
  }
}

CodePudding user response：

An ideal way is to create a separate custom textfield widget instead of a method like this:

class BuildInputForm extends StatelessWidget {
  const BuildInputForm({
    Key? key,
    required TextEditingController textEditingController, required this.label, required this.pass, required this.onpressed,
  
  })  : _textEditingController = textEditingController,
        super(key: key);

  final TextEditingController _textEditingController;
  final String label;
  final bool pass;
  final Function() onpressed;
 

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: 5),
      child: TextFormField(
        controller: _textEditingController,
        obscureText: pass ? _isObscure : false,
        decoration: InputDecoration(
            labelText: label,
            labelStyle: TextStyle(
              color: kTextFieldColor,
            ),
            focusedBorder: UnderlineInputBorder(
              borderSide: BorderSide(color: kPrimaryColor),
            ),
            suffixIcon: pass
                ? IconButton(
                    onPressed: onpressed
                    ,
                    icon: _isObscure
                        ? Icon(
                            Icons.visibility_off,
                            color: kTextFieldColor,
                          )
                        : Icon(
                            Icons.visibility,
                            color: kPrimaryColor,
                          ),
                  )
                : null),
      ),
    );
  }
}

Now you can use it in your column like this :

    Widget build(BuildContext context) {
        return Column(
          children: [
           BuildInputForm(textEditingController:email, pass:false, label: 'email', onpressed: () {}),
          BuildInputForm(textEditingController:pass, pass:true, label: 'Password', onpressed: () {
                      setState(() {
                        _isObscure = !_isObscure;
                      });
                    }),
          ],
        );
      }

There are ways you can optimize but this is very customizable way as you can reuse this widget anywhere you want. To use this you need to treat BuildInputForm as a separate widget like you do while creating screens.

CodePudding user response：

TextEditingController email = TextEditingController();
TextEditingController pass = TextEditingController();

Change to

TextEditingController emailController = TextEditingController();
TextEditingController passController = TextEditingController();
    

Inside your TextFormField set controller: to be

controller: pass ? passController : emailController 

Hope i managed to help you