Merge branch 'soap-objective-feature-re-design' into 'development'
Soap objective feature re design See merge request Cloud_Solution/doctor_app_flutter!454merge-requests/457/merge
commit
f6432d5f5d
@ -0,0 +1,145 @@
|
|||||||
|
import 'package:doctor_app_flutter/config/size_config.dart';
|
||||||
|
import 'package:doctor_app_flutter/util/translations_delegate_base.dart';
|
||||||
|
import 'package:doctor_app_flutter/widgets/shared/app_texts_widget.dart';
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:hexcolor/hexcolor.dart';
|
||||||
|
|
||||||
|
class PageStepperWidget extends StatelessWidget {
|
||||||
|
final int stepsCount;
|
||||||
|
final int currentStepIndex;
|
||||||
|
final Size screenSize;
|
||||||
|
|
||||||
|
PageStepperWidget({this.stepsCount, this.currentStepIndex, this.screenSize});
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
double dividerWidth = (screenSize.width / stepsCount) - (10 * stepsCount);
|
||||||
|
|
||||||
|
return Container(
|
||||||
|
margin: EdgeInsets.symmetric(vertical: 16.0, horizontal: 16.0),
|
||||||
|
child: Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
Row(
|
||||||
|
children: [
|
||||||
|
for (int i = 1; i <= stepsCount; i++)
|
||||||
|
if (i == currentStepIndex)
|
||||||
|
StepWidget(i, true, i == stepsCount, i < currentStepIndex,
|
||||||
|
dividerWidth)
|
||||||
|
else
|
||||||
|
StepWidget(i, false, i == stepsCount, i < currentStepIndex,
|
||||||
|
dividerWidth)
|
||||||
|
],
|
||||||
|
)
|
||||||
|
],
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class StepWidget extends StatelessWidget {
|
||||||
|
final int index;
|
||||||
|
final bool isInProgress;
|
||||||
|
final bool isFinalStep;
|
||||||
|
final bool isStepFinish;
|
||||||
|
final double dividerWidth;
|
||||||
|
|
||||||
|
StepWidget(this.index, this.isInProgress, this.isFinalStep, this.isStepFinish,
|
||||||
|
this.dividerWidth);
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
StepStatus status;
|
||||||
|
if (isInProgress) {
|
||||||
|
status = StepStatus.InProgress;
|
||||||
|
} else {
|
||||||
|
if(isStepFinish){
|
||||||
|
status = StepStatus.Completed;
|
||||||
|
}else {
|
||||||
|
status = StepStatus.Locked;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
Row(
|
||||||
|
children: [
|
||||||
|
Container(
|
||||||
|
padding: EdgeInsets.all(0.0),
|
||||||
|
margin: EdgeInsets.symmetric(horizontal: 1),
|
||||||
|
width: 25,
|
||||||
|
height: 25,
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: isInProgress ? Color(0xFFCC9B14) : Color(0xFFC9C9C9),
|
||||||
|
shape: BoxShape.circle,
|
||||||
|
border: Border.all(
|
||||||
|
color: isInProgress ? Color(0xFFCC9B14) : Color(0xFFC9C9C9),
|
||||||
|
width: 1),
|
||||||
|
),
|
||||||
|
child: Center(
|
||||||
|
child: Icon(
|
||||||
|
Icons.check,
|
||||||
|
size: 20,
|
||||||
|
color: status == StepStatus.InProgress ? Colors.white : status == StepStatus.Locked ? Colors.grey.shade800 : Color(0xFF359846),
|
||||||
|
)),
|
||||||
|
),
|
||||||
|
if (!isFinalStep)
|
||||||
|
Container(
|
||||||
|
width: dividerWidth,
|
||||||
|
height: 2,
|
||||||
|
color: Colors.grey,
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 8,
|
||||||
|
),
|
||||||
|
AppText(
|
||||||
|
"${TranslationBase.of(context).step} $index",
|
||||||
|
fontWeight: FontWeight.bold,
|
||||||
|
color: status == StepStatus.InProgress ? Colors.black : status == StepStatus.Locked ? Colors.grey : Color(0xFF359846),
|
||||||
|
fontFamily: 'Poppins',
|
||||||
|
fontSize: SizeConfig.textMultiplier * 1.6,
|
||||||
|
),
|
||||||
|
Container(
|
||||||
|
margin: EdgeInsets.symmetric(vertical: 4),
|
||||||
|
padding: EdgeInsets.symmetric(horizontal: 4, vertical: 2),
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: status == StepStatus.InProgress
|
||||||
|
? Color(0xFFF1E9D3)
|
||||||
|
: status == StepStatus.Locked
|
||||||
|
? Color(0xFFD8E8DB)
|
||||||
|
: Color(0xFFCCCCCC),
|
||||||
|
borderRadius: BorderRadius.all(
|
||||||
|
Radius.circular(8.0),
|
||||||
|
),
|
||||||
|
border: Border.all(color: HexColor('#707070'), width: 0.30),
|
||||||
|
),
|
||||||
|
child: AppText(
|
||||||
|
status == StepStatus.InProgress
|
||||||
|
? "inProgress"
|
||||||
|
: status == StepStatus.Locked
|
||||||
|
? "Locked"
|
||||||
|
: "Completed",
|
||||||
|
fontWeight: FontWeight.bold,
|
||||||
|
textAlign: TextAlign.center,
|
||||||
|
fontFamily: 'Poppins',
|
||||||
|
fontSize: SizeConfig.textMultiplier * 1.4,
|
||||||
|
color: status == StepStatus.InProgress
|
||||||
|
? Color(0xFFCC9B14)
|
||||||
|
: status == StepStatus.Locked
|
||||||
|
? Color(0xFF969696)
|
||||||
|
: Color(0xFF359846),
|
||||||
|
),
|
||||||
|
)
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
enum StepStatus {
|
||||||
|
InProgress,
|
||||||
|
Locked,
|
||||||
|
Completed,
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue