Home > Enterprise >  Flutter - How to remove the ability to click on a step title? Specifically the ripple effect even wh
Flutter - How to remove the ability to click on a step title? Specifically the ripple effect even wh

Time:08-26

I noticed that the steps can be clicked on to navigate back. But is there a way to disable this? In the image below clicking on the name triggers a material button click.

child: Stepper(
              type: StepperType.vertical,
              physics: const ScrollPhysics(),
              currentStep: _currentStep,
              onStepTapped: null,
              controlsBuilder: ((context, details) {
                return Row(
                  children: [
                    ElevatedButton(
                      onPressed: (() => continued()),
                      child: const BrandText(
                        text: 'Continue',
                      ),
                    ),
                    if (_currentStep != 0)
                      TextButton(
                        onPressed: (() => cancel()),
                        child: const BrandText(
                          text: 'Back',
                        ),
                      ),
                  ],
                );
              }),
              steps: [
                Step(
                  title: const BrandText(text: 'Name'),
                  content: Column(
                    children: <Widget>[
                      BrandTextInput(
                          controller: _groupNameController,
                          hintText: 'Name',
                          iconName: Icons.label)
                    ],
                  ),
                  isActive: _currentStep >= 0,
                  state: _currentStep >= 0
                      ? StepState.complete
                      : StepState.disabled,
                ),

enter image description here

CodePudding user response:

Make onStepTapped blank

onStepTapped: (step){},

title click effect Disabled

You need to edit the stepper.dart file.

Widget _buildVertical() {
    return ListView(
      shrinkWrap: true,
      physics: widget.physics,
      children: <Widget>[
        for (int i = 0; i < widget.steps.length; i  = 1)
          Column(
            key: _keys[i],
            children: <Widget>[
              // InkWell(
              //   onTap: widget.steps[i].state != StepState.disabled ? () {
              //     // In the vertical case we need to scroll to the newly tapped
              //     // step.
              //     Scrollable.ensureVisible(
              //       _keys[i].currentContext!,
              //       curve: Curves.fastOutSlowIn,
              //       duration: kThemeAnimationDuration,
              //     );
              //
              //     widget.onStepTapped?.call(i);
              //   } : null,
              //   canRequestFocus: widget.steps[i].state != StepState.disabled,
              //   child: _buildVerticalHeader(i),
              // ),
              Container(
                child: _buildVerticalHeader(i),
              ),
              _buildVerticalBody(i),
            ],
          ),
      ],
    );
  }
  • Related