Remove TextField focus while on pressing another widget-CodePudding

i have a form pages contain a widget that will return various widget form according to the api parameters, for example: the parameters is 'type': 'text_box so the widget will return TextField widget if the parameters is 'type': 'dropdown_box' it will return dropdown widget.

This is just an example for what widget i make, the real problem is in the TextField widget because everytime i input in the field then press any other form widget(not pressing the complete button on textfield) and select the value it will return the focus to the TextField before if i press complete button the focus is neutral again what i want is when i press another widget the focus from the TextField is clear.

code

TextFormField(
              minLines: widget.minLines,
              inputFormatters: [
                if (widget.isPrice)
                  MoneyInputFormatter(
                    thousandSeparator: ThousandSeparator.Period,
                    mantissaLength: 0,
                  ),
              ],
              controller: widget.controllerName,
              onTap: () {
                widget.onTap();
              },
              enabled: widget.enabled,
              obscureText: widget.isObsecure,
              style: TextStyle(
                fontSize: 14.0,
                fontWeight: FontWeight.w400,
                color: (widget.textColor != null)
                    ? widget.textColor
                    : widget.enabled
                        ? Colors.black
                        : Colors.black38,
              ),
              keyboardType: widget.keyboardType,
              maxLines: widget.maxLines,
              decoration: InputDecoration(
                  isDense: true, //remove default padding
                  fillColor:
                      widget.inputColor ?? Constants.colorAppointmentTextInput,
                  filled: true, // activate bg color
                  // hintText: widget.hintText,
                  hintText: widget.placeholder ?? 'Masukan '   widget.hintText,
                  hintStyle: TextStyle(
                    fontSize: 14.0,
                    color: (widget.textColor != null)
                        ? widget.textColor
                        : widget.enabled
                            ? Colors.black54
                            : Colors.black38,
                  ),
                  prefix: widget.prefix,
                  border: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(10),
                      borderSide: BorderSide(
                          color: Constants.colorAppointmentBorderInput,
                          width: 0.5)),
                  enabledBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(10),
                      borderSide: BorderSide(
                          color: Constants.colorAppointmentBorderInput,
                          width: 0.5)),
                  disabledBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(10),
                      borderSide: BorderSide(
                          color: Constants.colorAppointmentBorderInput,
                          width: 0.5)),
                  focusedBorder: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(10),
                    borderSide:
                        BorderSide(color: Constants.redTheme, width: 0.5),
                  ),
                  suffixIcon: widget.suffixIcon),
              validator: (value) {
                if (value.isEmpty) {
                  return 'Please enter some text';
                }
                return null;
              },
            ),

this is what i mean the widget will return widget according to the api

@override
  Widget build(BuildContext context) {
    if (widget.questionType == 'text_box') {
      return TextFild();
    } else if (widget.questionType == 'dropdown') {
      return Dropdown();
    } else if (widget.questionType == 'radio') {
      return radioType();
    }
}

CodePudding user response：

You could use a focus node:

myFocusNode = FocusNode()

Add it to your TextFormField:

TextFormField(
  focusNode: myFocusNode,
  ...
);

When an event that you want to unfocus the text field occurs, like tapping some other button etc. use:

myFocusNode.unfocus();

Make sure to dispose of the FocusNode in your dispose method:

  @override
  void dispose() {
    myFocusNode.dispose();
    //...
    super.dispose();
  }

CodePudding user response：

You can use FocusNode. Add it to TextformField.

TextFormField(
  focusNode: focusNode,
  ...
);

Call focusNode.unfocus(); on onFieldSubmitted, onSaved. In your case on click action when you show your dropdown.

CodePudding user response：

Add this Line :

  FocusScope.of(context).requestFocus(FocusNode());

if keyboard on it will make it off , if it's off it will make it on .