When use customeSize, CrossAxisAlignment does not working good...

[NewLand-Ju]

StepProgressIndicator(
                                  totalSteps: 20,
                                  currentStep: 7,
                                  crossAxisAlignment: CrossAxisAlignment.end,
                                  selectedColor: StudyColors.azul,
                                  unselectedColor: StudyColors.lightPeriwinkle,
                                  customSize: (index, _) {
                                    double size;
                                    if (index == 7 - 1) {
                                      size = 30;
                                    } else if (index == 7 - 2) {
                                      size = 20;
                                    } else {
                                      size = 10;
                                    }
                                    return size;
                                  },
                                ),

I want to all steps to make it aligned down.
but not working....

I want to make it like the picture below.

[SandroMaglione]

Hi @NewLand-Ju

I published v1.0.1 which has a new stepMainAxisAlignment and stepCrossAxisAlignment attributes. You can achieve the result of your example with the following code:

StepProgressIndicator(
  totalSteps: 20,
  currentStep: 7,
  stepMainAxisAlignment: MainAxisAlignment.end,
  customStep: (index, color, size) {
    return Container(
      decoration: BoxDecoration(
        color: color,
        borderRadius: BorderRadius.circular(30),
      ),
    );
  },
  selectedColor: Colors.blue,
  unselectedColor: Colors.grey[300]!,
  customSize: (index, _) {
    double size;
    if (index == 7 - 1) {
      size = 30;
    } else if (index == 7 - 2) {
      size = 20;
    } else {
      size = 10;
    }
    return size;
  },
),

[NewLand-Ju]

Thank! :)