class StepProgressBar extends StatelessWidget {
const StepProgressBar({
Key key,
this.currentStep,
this.totalSteps,}) :super(key: key);
final int currentStep;
final int totalSteps;
@override
Widget build(BuildContext context) {
final screenWidth = MediaQuery.of(context).size.width;
// if you are wrapping this widget in some padding
const leftPadding = 20.0;
const rightPadding = 20.0;
// width of the separete widget
const separatedWidth = 1.0;
return Padding(
padding: const EdgeInsets.only(top: 20, left: leftPadding, right: rightPadding, bottom: 0),
child: Container(
constraints: BoxConstraints(maxHeight: 2, maxWidth: screenWidth),
child: ListView.separated(
shrinkWrap: true,
scrollDirection: Axis.horizontal,
physics: const NeverScrollableScrollPhysics(),
itemCount: totalSteps,
separatorBuilder: (context, index) => const SizedBox(width: separatedWidth,),
itemBuilder: (context, position) {
return Container(
width: (screenWidth - ((totalSteps - 1) * separatedWidth)
- (leftPadding + rightPadding)) / totalSteps,
decoration: BoxDecoration(
color: AppTheme.nearlyWhite20,
borderRadius: BorderRadius.circular(20)
),
child: Container(
height: 2,
decoration: BoxDecoration(
color: currentStep >= position ? AppTheme.lightGreen.withOpacity(0.4) : Colors.transparent,
borderRadius: BorderRadius.circular(20)
),
),
);
},
),
),
);
}
}
For further actions, you may consider blocking this person and/or reporting abuse
Top comments (0)