Flutter mobile app backspace delete 2 characters instead of 1

Question

I have a page which will show a modalbottomsheet when i click on the button. In the modalbottomsheet, it has a Pinput field which i can type in values. However, when I press backspace, it deletes 2 characters instead of 1. Does anybody know what is the problem with it as the console doesnt show anything. Below is the codes for the modalbottomsheet

_showCouponDetails(String coupon, bool couponStatus){
    int shopPinCode;
    int pinCode;
    final FocusNode _pinPutFocusNode = FocusNode();
    final TextEditingController _pinPutController = TextEditingController();

    return showModalBottomSheet(
        isScrollControlled: true,
        context: context,
        builder:(BuildContext context) =>
          GestureDetector(
            onTap: () {
              FocusScope.of(context).requestFocus(FocusNode());
            },
            child: Container(
                width: screenWidth,
                color: Colors.white,
                child: Column(
                  mainAxisSize: MainAxisSize.max,
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    SizedBox(height: 24),
                    Padding(
                        padding: EdgeInsets.symmetric(horizontal: 10),
                        child: Text(coupon,
                                style: TextStyle(
                                  fontSize: 25,
                                  fontWeight: FontWeight.bold
                                )),
                        ),

                    couponStatus? Text(''):Image.asset('images/Redeemed.png', width: 100, height: 100),
                    Center(child:
                      Text('Expires on 31/12/2020')),
                    Container(
                      height: 100,
                      width: screenWidth*0.8,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(15),
                        color: Colors.grey[200]
                      ),
                      child: Padding(
                        padding: EdgeInsets.all(10),
                        child: Center(
                          child: Column(
                            children: [
                              Text('Please ask the workshop to enter pin.'),
                              SizedBox(height: 10),
                              PinPut(
                                fieldsCount: 5,
                                focusNode: _pinPutFocusNode,
                                controller: _pinPutController,
                                eachFieldHeight: 30,
                              eachFieldWidth: 30,
                              selectedFieldDecoration: BoxDecoration(
                                border: Border.all(color: Colors.purple),
                                borderRadius: BorderRadius.circular(15)
                              ),
                              followingFieldDecoration: BoxDecoration(
                                  border: Border.all(color: Colors.purple),
                                  borderRadius: BorderRadius.circular(15),
                              ),
                              submittedFieldDecoration: BoxDecoration(
                                  border: Border.all(color: Colors.purple),
                                  borderRadius: BorderRadius.circular(15),
                              ),
                              onChanged: (_pinPutController){
                                  if (_pinPutController.isNotEmpty)
                                    pinCode = int.parse(_pinPutController);
                                    print (pinCode);
                                  },
                                ),
                            ]
                          )
                        ),
                      ),
                    ),
                    Spacer(),
                    Padding(
                      padding: EdgeInsets.all(10),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                        children: [
                          InkWell(
                            onTap: () {
                              
                            },
                            child: Container(
                              height: screenHeight*0.05,
                              width: screenWidth *0.4,
                              decoration: BoxDecoration(
                                  borderRadius: BorderRadius.circular(15),
                                  color: kPrimaryColor
                              ),
                              child: Center(child: Text('Redeem', style: TextStyle(fontWeight: FontWeight.bold,color: Colors.white, fontSize: 15))),
                            ),
                          ),
                          InkWell(
                            onTap: (){
                              Navigator.pop(context);
                            },
                            child: Container(
                              height: screenHeight*0.05,
                              width: screenWidth *0.4,
                              decoration: BoxDecoration(
                                borderRadius: BorderRadius.circular(15),
                                border: Border.all(color: Colors.black),
                                color: Colors.white
                              ),
                              child: Center(child: Text('Cancel', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 15))),
                            ),
                          ),
                        ],
                      ),
                    )
                  ],
                ),
              ),
          ),
      );
  }

Updates: Picture included. In the picture i have keyed in 1,2 and 3. Whenever i press backspace, it deletes 2 and 3 (picture 2). In picture 3, the console prints out the number twice.

Solution

I fixed this problem by changing my flutter channel. I was using flutter channel beta and apparently this backspace is a bug. After swittching to flutter channel stable, everything was fine.

To check your flutter channel, type the following in terminal flutter --version

To change the flutter channel, type the following in terminal flutter channel master

Comments

[Roy]

Hello, yes im talking about the number inside the number box. I have added 2 pictures of the problem.

[Admin]

Hi Roy, the app is running perfectly fine during my compilation. If the problem is still persisting. Kindly check if:- 1.Updated to the latest version of pinput library(i used the latest one) or any library. 2. Try running app on a physical device (This might work)

[Roy]

thanks. I've tried loading on a device but its still the same. I've also upgraded to the latest library but still encounter the same problem.

[Dhananjay Gavali]

In my code. If I hold the backspace button still it's deleting only one character. I want to make it like when we hold backspace key all characters start deleting, But I am only able to delete one character. how can I achieve that?