'How to assign active to dots whose position is less than activeStep in im_stepper package?

I am using im_stepper package to create a component as shown below, and one of the requirements is that the steps passed, the corresponding dot will turn yellow, for example: I have a total of 3 steps, and I am in step 2, then i want step 1 passed will have yellow dot like current step .

enter image description here

Here is my code

buildStepperSection() {
    return Center(
      child: DotStepper(
        fixedDotDecoration: FixedDotDecoration(
          color: AppTheme.gray_g2,
          strokeColor: AppTheme.gray_g2,
        ),
        indicatorDecoration: IndicatorDecoration(
          color: AppTheme.yellowDark,
          strokeColor: AppTheme.yellowDark,
        ),
        activeStep: 2,
        dotCount: 3,
        tappingEnabled: false,
        lineConnectorsEnabled: true,
        dotRadius: 12.0,
        lineConnectorDecoration:
            LineConnectorDecoration(color: Colors.grey, strokeWidth: 2.0),
        spacing: Get.width * 0.3,
      ),
    );
  }


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source