step_progress_bar.dart 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. import 'package:flutter/material.dart';
  2. import 'package:flutter_screenutil/flutter_screenutil.dart';
  3. // 新人流程步骤进度条
  4. class StepProgressBar extends StatelessWidget {
  5. final int currentStep;
  6. final int totalSteps;
  7. final Color backgroundColor;
  8. final Color activeColor;
  9. final double height;
  10. const StepProgressBar({
  11. super.key,
  12. required this.currentStep,
  13. required this.totalSteps,
  14. this.backgroundColor = const Color(0x198A54FD),
  15. this.activeColor = const Color(0xFFA084FF),
  16. this.height = 8.0,
  17. }) : assert(totalSteps > 0, 'totalSteps must be greater than 0');
  18. @override
  19. Widget build(BuildContext context) {
  20. return Container(
  21. height: height,
  22. padding: EdgeInsets.symmetric(horizontal: 2.w, vertical: 2.w),
  23. decoration: ShapeDecoration(
  24. color: backgroundColor,
  25. shape: RoundedRectangleBorder(
  26. borderRadius: BorderRadius.circular(5.r),
  27. ),
  28. ),
  29. child: Row(
  30. children: List.generate(totalSteps, (index) {
  31. final isStepCompleted = index < currentStep;
  32. return Expanded(
  33. child: Container(
  34. // margin: EdgeInsets.symmetric(horizontal: 1.w), //
  35. decoration: ShapeDecoration(
  36. color: isStepCompleted ? activeColor : Colors.transparent,
  37. shape: RoundedRectangleBorder(
  38. borderRadius: BorderRadius.circular(3.r),
  39. ),
  40. ),
  41. ),
  42. );
  43. }),
  44. ),
  45. );
  46. }
  47. }