Kuldeep
Kuldeep

Reputation: 4552

TextFormField onChanged is not getting called when no character Flutter

I have 1 functionality of adding TextFormField in Container on Button press upto 4 TextFormField like below image and when there's no text in TextFormField i want to remove that TextFormField so i have put that login in onChange.

When i press the button 1s time and it will add TextFormField and without typing any character if i press delete button from keyboard onChange is not getting called.

Please see this video: https://drive.google.com/file/d/1Yln48d5JHvvYdb4LRDXxmlzPzlC__xYq/view?usp=sharing

Here is my code.

TextFormField(
    controller: bullet2Controller,
    focusNode: focusNode2,
    maxLines: null,
    minLines: 1,
    textCapitalization:TextCapitalization.sentences,
                       cursorColor: Colors.black,
                       showCursor: true,
                       autofocus: true,
                       textAlign: TextAlign.start,
                       inputFormatters: [LengthLimitingTextInputFormatter(140),],
                       onChanged: (value) {
                           setState(() {
                               if (value.isEmpty) {
                                   isBullet2Visible = false;

                                   if (isBullet1Visible) {
                                       focusNode1.requestFocus();
                                   } else if (isBullet3Visible) {
                                       focusNode3.requestFocus();
                                   } else if (isBullet4Visible) {
                                       focusNode4.requestFocus();
                                   } else {
                                       FocusScope.of(context).unfocus();
                                   }

                                   if (_counter > 0) {
                                       _counter--;
                                   }
                               }

                               if (kDebugMode) {
                                   print("${value.length.toString()} character(s)");
                               }
                           });
                       },
                       decoration: const InputDecoration(disabledBorder:
                                                            InputBorder.none,
                                                        border:
                                                            InputBorder.none,
                                                        filled: true,
                                                        fillColor: Colors.white,
                                                      ),
                                                      keyboardType:
                                                          TextInputType
                                                              .multiline,
                                                      textInputAction:
                                                          TextInputAction.done,
                                                    ),

Is it default behaviour or do i need to do any extra step to make it work.

Upvotes: 0

Views: 681

Answers (3)

Kuldeep
Kuldeep

Reputation: 4552

Thanks to Vladyslav Ulianytskyi suggestion.

I have done this with the use of RawKEyboardListner. Here is the sample code.

RawKeyboardListener(
    autofocus: true,
    onKey: (event) {
        setState(() {
            if (event.isKeyPressed(LogicalKeyboardKey.backspace)) {
                print("Perform Your Action");
            }
        });
    },
    focusNode: FocusNode(),
    child: TextFormField(controller: bullet2Controller,
        focusNode: focusNode2,
        maxLines: null,
        minLines: 1,
        textCapitalization: TextCapitalization.sentences,
            cursorColor: Colors.black,
            showCursor: true,
            autofocus: true,
            textAlign: TextAlign.start,
            inputFormatters: [LengthLimitingTextInputFormatter(140),
            ],
            decoration: const InputDecoration(
                disabledBorder: InputBorder.none,
                border: InputBorder.none,
                filled: true,
                fillColor: Colors.white,
            ),
            keyboardType: TextInputType.multiline,
            textInputAction: TextInputAction.done,
        ),
    ),
)

Upvotes: 1

Vishal Parmar
Vishal Parmar

Reputation: 612

You can try it will below code hope it's work for you

TextEditingController bullet2Controller = TextEditingController();
int currentTextLength = 0;

TextFormField(
    maxLines: null,
    controller: bullet2Controller,
    decoration: InputDecoration(
      hintText: 'Type your observations'
    ),
    style: TextStyle(
      fontSize: 14,
      fontWeight: FontWeight.w300,
      fontFamily: 'Roboto'
    ),
    onChanged: (String newText){
      if (newText != ''){
        if(newText[0] != '•'){
          newText = '• ' + newText;
          bullet2Controller.text = newText;
         bullet2Controller.selection = TextSelection.fromPosition(TextPosition(offset: bullet2Controller.text.length));
        }
        if(newText[newText.length - 1] == '\n' && newText.length > currentTextLength){
           bullet2Controller.text = newText + '• ';
          bullet2Controller.selection = TextSelection.fromPosition(TextPosition(offset: bullet2Controller.text.length));
        }
        currentTextLength = bullet2Controller.text.length;
      }
  }
)

let me know if it's work for you or let me know if there any question.

Upvotes: 0

Vladyslav Ulianytskyi
Vladyslav Ulianytskyi

Reputation: 2541

this is a default behaviour. when your value = '' and you press delete it is still equal to '' and onChanged not getting called. to achieve your goals you should use a listener like RawKeyboardListener

Upvotes: 1

Related Questions