import 'package:flutter/material.dart'; import 'package:hmg_patient_app_new/core/app_export.dart'; import 'package:hmg_patient_app_new/theme/colors.dart'; class StepperWidget extends StatelessWidget { double width = 80.w; Color activeColor = AppColors.primaryRedColor; bool hasThumb = true; double? height = 4.h; StepperWidget( this.width, this.activeColor, this.hasThumb, this.height, {super.key}); @override Widget build(BuildContext context) { return oneProgressBar(width, activeColor, hasThumb); } Widget oneProgressBar(double width, Color color, bool hasThumb) { return Row( children: [ AnimatedSize( duration: const Duration(seconds: 1), child: SizedBox( height: 28.h, width: width, child: Stack( clipBehavior: Clip.none, children: [ SizedBox( height: height, child: Container( width: width, height: height, decoration: BoxDecoration( color: color, shape: BoxShape.rectangle, borderRadius: BorderRadius.circular(30.h) ), ), ), Visibility( visible: hasThumb, child: Positioned( top: -6.h, // move thumb above bar center left: width - 22.h, // move to right end child: thumb(color), ), ) ], ), ), ), SizedBox(width: 8.h) ], ); } Widget thumb(Color color) { return Container( width: 18.h, height: 18.h, padding: EdgeInsets.zero, decoration: BoxDecoration( color: color, shape: BoxShape.circle, border: Border.all(color: Colors.white, width: 2.h) ), ); } }