Flutter : Disable Previous Stepper Click

Question

I am using Stepper Widget to make Change PinCode Form. Everything is okay, but i don't know how to disable previous stepper click.

Example :

• Step 1 Input Old PinCode.
• Step 2 Input New Pincode.

I don't want to go back to step 1 if i am in step 2 by clicking the Stepper.

How can i solve this ?

Here's my source Code :

Form(
        key: _formKey,
        child: Stepper(
          steps: steps(),
          currentStep: currStep,
          onStepContinue: () {
            setState(() {
              if (formKeys[currStep].currentState.validate()) {
                if (currStep < steps().length - 1) {
                  currStep += 1;
                } else if (steps().length == 2) {
                  print('Done');
                } else {
                  currStep = 0;
                }
              }
            });
          },
          onStepTapped: (step) {
            setState(() {
              currStep = step;
              print(step);
            });
          },
        ),
      ),
 List<Step> steps() {
    return [
      Step(
        title: const Text('Enter Previous PinCode'),
        isActive: currStep == 0 ? true : false,
        state: StepState.indexed,
        content: Form(
          key: formKeys[0],
          child: TextFormField(
            autofocus: true,
            keyboardType: TextInputType.number,
            validator: (value) {
              if (value.isEmpty || value != userModelHive.pinCodeNumber) {
                return 'PinCode Invalid';
              }
              return null;
            },
          ),
        ),
      ),
      Step(
        title: const Text('Enter New PinCode'),
        isActive: true,
        state: StepState.indexed,
        content: Form(
          key: formKeys[1],
          child: TextFormField(
            autofocus: true,
            keyboardType: TextInputType.number,
            validator: (value) {
              if (value.isEmpty) {
                return 'Provided PinCode';
              } else if (value.length < 4 || value.length > 6) {
                return "More than 4 Less than 6";
              }
              return null;
            },
          ),
        ),
      ),
    ];
  }

Answer 1

just check for the step variable in the onStepTapped weather it is previous or not..if it is the previous step then don't call setState

Stepper(
    steps:steps(),
    currentStep:currentStep,
    onStepTapped:(step){
      if(step>currentStep){
        setState((){
            currentStep=step;
        });
      }
    }
)

Answer 2

You can use the state parameter in Stepper.

state: _currentStep >= 1? StepState.disabled : StepState.complete 

StepState.disabled will make it not clickable.