cloudsolutions-atoms/lib/common_widgets/stapper_widget/components/base_step.dart

import 'package:flutter/material.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import 'base_step_delegate.dart';
typedef OnStepReached = void Function(int index);

enum StepShape { circle, rRectangle }

enum BorderType { normal, dotted }

class BaseStep extends StatelessWidget {
  const BaseStep({
    Key ?key,
    required this.step,
    required this.isActive,
    required this.isFinished,
    required this.isAlreadyReached,
    required this.radius,
    required this.isUnreached,
    required this.activeStepBackgroundColor,
    required this.unreachedBackgroundColor,
    required this.activeStepBorderColor,
    required this.unreachedBorderColor,
    required this.activeTextColor,
    required this.activeIconColor,
    required this.unreachedTextColor,
    required this.unreachedIconColor,
    required this.padding,
    required this.stepRadius,
    required this.showStepBorder,
    required this.lineLength,
    required this.enabled,
  }) : super(key: key);
  final StepModel step;
  final bool isActive;
  final bool isUnreached;
  final bool isFinished;
  final bool isAlreadyReached  ;
  final double radius;
  final Color activeStepBackgroundColor;
  final Color unreachedBackgroundColor;
  final Color activeStepBorderColor;
  final Color unreachedBorderColor;
  final Color activeTextColor;
  final Color activeIconColor;
  final Color unreachedTextColor;
  final Color unreachedIconColor;
  final double padding;
  final double stepRadius;
  final bool showStepBorder;
  final double lineLength;
  final bool enabled;

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: (radius * 2) + (padding),
      height:  radius * 2.5 + 25,
      child: CustomMultiChildLayout(
        delegate: BaseStepDelegate(
            stepRadius: radius,
            topTitle: step.topTitle??false,
            direction: Axis.horizontal),
        children: [
          LayoutId(
              id: BaseStepElem.step,
              child: Material(
                color: Colors.transparent,
                clipBehavior: Clip.antiAlias,
                borderRadius: BorderRadius.circular(stepRadius),
                child: Container(
                  width: radius * 2,
                  height: radius * 2,
                  decoration: BoxDecoration(
                      shape: BoxShape.circle,
                      color: _handleColor(context, isFinished, isActive,
                          isAlreadyReached)),
                  alignment: Alignment.center,
                  child:  _buildIcon(context),
                ),
              )),
            LayoutId(
                id: BaseStepElem.title, child: _buildStepTitle(context))
        ],
      ),
    );
  }

  Color _handleColor(BuildContext context, bool isFinished, bool isActive,
      bool isAlreadyReached) {
    if (isActive) {
      return activeStepBackgroundColor;
    } else {
      if (isFinished) {
        return AppColor.primary10;
      } else if (isAlreadyReached) {
        return AppColor.primary10;
      } else {
        return unreachedBackgroundColor;
      }
    }
  }


  Color _handleTitleColor(BuildContext context, bool isFinished, bool isActive,
      bool isAlreadyReached) {
    if (isActive) {
      return activeTextColor;
    } else {
      if (isFinished) {
        return  Colors.transparent;
      } else if (isAlreadyReached) {
        return  Colors.transparent;
      } else {
        return unreachedTextColor;
      }
    }
  }


  Widget _buildStepTitle(BuildContext context) {
    return SizedBox(
      width: (radius * 4.5) +
          (padding),
      child: step.customTitle,
    );
  }

  SizedBox _buildIcon(BuildContext context) {
    return SizedBox(
      width: radius * 2,
      height: radius * 2,
      child: Center(
        child: step.customStep ??
            Icon(
              isActive && step.activeIcon != null
                  ? step.activeIcon!.icon
                  : isFinished && step.finishIcon != null
                      ? step.finishIcon!.icon
                      : step.icon!.icon,
              size: radius * 0.9,
              color: Colors.white,
            ),
      ),
    );
  }

}
class StepModel {
  final Icon ?icon;
  final Icon ?finishIcon;
  final Icon ?activeIcon;
  final Widget? customStep;
  final String ?title;
  final Widget ?customTitle;
  final String ?lineText;
  final Widget ?customLineWidget;
  final bool? topTitle;
  final bool? enabled;
  const StepModel({
     this.icon,
     this.finishIcon,
      this.activeIcon,
      this.title,
     this.lineText,
     this.customStep,
     this.customTitle,
     this.customLineWidget,
    this.topTitle = false,
    this.enabled = true,
  });
}