Search code examples
flutterdarttimercountdownautofill

Unable to type text in text pin field(sms_autofill: ^2.2.0)


unable to type OTP CODE in text pin field (sms_autofill: ^2.2.0) when the timer is on, I can write after the timer is off, debug log show "view is not EditText"

I declared int to set time

Timer? _timer;
int _start = 60;

Method to call timer, this timer is called when otp send successfully.

  void startTimer() {
    const oneSec = const Duration(seconds: 1);
    _timer = new Timer.periodic(
      oneSec,
      (Timer timer) {
        if (_start == 0) {
          setState(() {
            timer.cancel();
          });
        } else {
          setState(() {
            _start--;
          });
        }
      },
    );
  }

Otp Field to enter otp

PinFieldAutoFill(
   codeLength: 6,
   decoration: const UnderlineDecoration(
   bgColorBuilder: FixedColorBuilder(Colors.white),
   textStyle: TextStyle(
   fontSize: 22,
   color: Colors.black,
   fontWeight: FontWeight.bold),
   colorBuilder: FixedColorBuilder(Colors.white),),
                currentCode: _code,
                onCodeSubmitted: (code) {
                  setState(() {
                    _code = code;
                  });
                  if (code.length == 6) {
                    setState(() {
                      isLoading2 = true;
                    });
                    handleSignIn();
                  } else {
                    Fluttertoast.showToast(
                        msg: 'Enter Correct Code',
                        backgroundColor: Colors.black.withOpacity(0.95),
                        textColor: Colors.white);
                  }
                },
                onCodeChanged: (code) {
                  if (code!.length == 6) {
                    FocusScope.of(this.context).requestFocus(FocusNode());
                    setState(() {
                      _code = code;
                    });
                  }
                },
              ),

This video describes my issue


Solution

  • Actually the problem is in your void startTimer() function when you call it first time it initiates a Timer.periodic function where you are calling setState in every second. So any change in your screen will not reflect because set state is setting it again to default value every second.