WOIStepper.counterText constructor

WOIStepper.counterText({ Key? key, required List<String> textItemsList, Widget? activeSeparatorWidget, Widget? inactiveSeparatorWidget, required int activeStateIndex, EdgeInsets? itemsPadding, EdgeInsets? saperatorsPadding, EdgeInsets? backgroundPadding, BoxDecoration? backgroundDecorator, EdgeInsets? itemsMargin, EdgeInsets? counterPadding, EdgeInsets? counterMargin, Color? activeColor, Color? completedColor, Color? inactiveColor, List<String>? subtextList, TextStyle? subtextStyle, TextStyle? textStyle, TextStyle? counterTextStyle, Axis axis = Axis.horizontal, double? height, double? width, EdgeInsets? textPadding, })

Creates an instance of WOIStepper with counters as suffix widgets.

The textStyle defines the style of the counter text. The counterTextStyle defines the style of the counter text. The counterPadding defines the padding of the counter. The counterMargin defines the margin of the counter. The activeColor, completedColor and inactiveColor will define color for both text and counter in those states.

If subtextList is provided then need to make sure its lenght is similar to the textItemsList otherwise it would through error Here is a small example on how to use that:

Padding(
  padding: const EdgeInsets.all(10),
  child: WOIStepper.counterText(
    activeStateIndex: currentStepperIndex,
    activeSeparatorWidget: Container(
      height: 2,
      color: Colors.black,
    ),
    textItemsList: const [
      'Step1',
      'Step2',
      'Step3',
    ],
  ),
),

Implementation

WOIStepper.counterText({
  super.key,
  required this.textItemsList,
  this.activeSeparatorWidget,
  this.inactiveSeparatorWidget,
  required this.activeStateIndex,
  this.itemsPadding,
  this.saperatorsPadding,
  this.backgroundPadding,
  this.backgroundDecorator,
  this.itemsMargin,
  EdgeInsets? counterPadding,
  EdgeInsets? counterMargin,
  Color? activeColor,
  Color? completedColor,
  Color? inactiveColor,
  this.subtextList,
  this.subtextStyle,
  TextStyle? textStyle,
  TextStyle? counterTextStyle,
  this.axis = Axis.horizontal,
  this.height,
  this.width,
  this.textPadding,
})  : assert(textItemsList.length > 1,
          '[textItemsList] length should be greater then 1'),
      assert(
          subtextList == null || (subtextList.length == textItemsList.length),
          '\n[subtextList] length should be equal to [textItemsList]'),
      suffixWidgetItemsList = List.generate(
        textItemsList.length,
        (index) => SuffixWidgetStepper(
          widget: Container(
            padding: counterPadding ?? const EdgeInsets.all(5),
            margin: counterMargin ??
                const EdgeInsets.only(
                  right: 5,
                ),
            decoration: BoxDecoration(
              border: Border.all(),
              shape: BoxShape.circle,
            ),
            child: Text(
              (index + 1).toString(),
            ),
          ),
          inactiveState: Container(
            padding: counterPadding ?? const EdgeInsets.all(5),
            margin: counterMargin ??
                const EdgeInsets.only(
                  right: 5,
                ),
            decoration: BoxDecoration(
              border: Border.all(
                color: inactiveColor ?? Colors.black,
              ),
              shape: BoxShape.circle,
            ),
            child: Text(
              (index + 1).toString(),
              style: (counterTextStyle ?? const TextStyle())
                  .copyWith(color: inactiveColor ?? Colors.black),
            ),
          ),
          activeState: Container(
            padding: counterPadding ?? const EdgeInsets.all(5),
            margin: counterMargin ??
                const EdgeInsets.only(
                  right: 5,
                ),
            decoration: BoxDecoration(
              border: Border.all(
                color: activeColor ?? Colors.black,
              ),
              shape: BoxShape.circle,
            ),
            child: Text(
              (index + 1).toString(),
              style: (counterTextStyle ?? const TextStyle()).copyWith(
                color: activeColor ?? Colors.black,
              ),
            ),
          ),
          completedState: Container(
            padding: counterPadding ?? const EdgeInsets.all(5),
            margin: counterMargin ??
                const EdgeInsets.only(
                  right: 5,
                ),
            decoration: BoxDecoration(
              border: Border.all(
                color: completedColor ?? Colors.black,
              ),
              shape: BoxShape.circle,
            ),
            child: Text(
              (index + 1).toString(),
              style: (counterTextStyle ?? const TextStyle())
                  .copyWith(color: completedColor ?? Colors.black),
            ),
          ),
        ),
      ),
      inactiveState = StepperStyle(
        textStyle: (textStyle ?? const TextStyle()).copyWith(
          color: inactiveColor,
        ),
      ),
      activeState = StepperStyle(
        textStyle: (textStyle ?? const TextStyle()).copyWith(
          color: activeColor,
        ),
      ),
      completedState = StepperStyle(
        textStyle: (textStyle ?? const TextStyle()).copyWith(
          color: completedColor,
        ),
      ),
      itemActiveDecorator = null,
      itemInactiveDecorator = null,
      itemCompletedDecorator = null;