You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
mohemm-flutter-app/lib/ui/marathon/widgets/marathon_progress_container...

123 lines
5.0 KiB
Dart

import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:mohem_flutter_app/classes/colors.dart';
import 'package:mohem_flutter_app/classes/decorations_helper.dart';
import 'package:mohem_flutter_app/extensions/int_extensions.dart';
import 'package:mohem_flutter_app/extensions/string_extensions.dart';
import 'package:mohem_flutter_app/extensions/widget_extensions.dart';
import 'package:mohem_flutter_app/generated/locale_keys.g.dart';
import 'package:mohem_flutter_app/models/marathon/question_model.dart';
import 'package:mohem_flutter_app/ui/marathon/marathon_provider.dart';
class MarathonProgressContainer extends StatelessWidget {
final MarathonProvider provider;
const MarathonProgressContainer({Key? key, required this.provider}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
decoration: MyDecorations.shadowDecoration,
padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 13),
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Container(
decoration: BoxDecoration(color: MyColors.greenColor, borderRadius: BorderRadius.circular(5)),
padding: const EdgeInsets.symmetric(vertical: 5, horizontal: 8),
child: "${provider.currentQuestionNumber.toString()} / ${provider.marathonDetailModel.totalQuestions.toString()} ${LocaleKeys.question.tr()}".toText12(color: MyColors.white),
),
"${provider.totalMarathoners} ${provider.totalMarathoners == 1 ? LocaleKeys.marathoner.tr() : LocaleKeys.marathoners.tr()}".toText14(),
provider.questionCardStatus == QuestionCardStatus.question
? "00:${(provider.totalCurrentQuestionTime - provider.currentGapTime) < 10 ? "0${provider.totalCurrentQuestionTime - provider.currentGapTime}" : provider.totalCurrentQuestionTime - provider.currentGapTime}"
.toText18(color: provider.totalCurrentQuestionTime - provider.currentGapTime < 5 ? MyColors.redColor : MyColors.black)
: const SizedBox(),
],
),
12.height,
stepper(provider.currentQuestionNumber, provider.answerStatusesList, provider.marathonDetailModel.totalQuestions!, provider.isUserOutOfGame),
8.height,
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
"${provider.currentQuestionNumber == 1 ? 0 : (((provider.currentQuestionNumber - 1) / provider.marathonDetailModel.totalQuestions!) * 100).toInt()}% ${LocaleKeys.completed.tr()}"
.toText14(),
provider.isUserOutOfGame ? LocaleKeys.youAreOutOfContest.tr().toText14(color: MyColors.redColor) : const SizedBox(),
],
),
],
),
);
}
Color getStepColor(QuestionCardStatus status, bool isOutOfGame) {
switch (status) {
case QuestionCardStatus.question:
return MyColors.yellowColorII;
case QuestionCardStatus.wrongAnswer:
return MyColors.redColor;
case QuestionCardStatus.correctAnswer:
return MyColors.greenColor;
case QuestionCardStatus.skippedAnswer:
return MyColors.redColor;
case QuestionCardStatus.completed:
return MyColors.lightGreyDeColor;
case QuestionCardStatus.findingWinner:
return MyColors.lightGreyDeColor;
case QuestionCardStatus.winnerFound:
return MyColors.lightGreyDeColor;
}
}
Widget stepper(int value, List<QuestionCardStatus> statusesList, int totalQuestions, bool isOutOfGame) {
return SizedBox(
width: double.infinity,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
for (int i = 0; i < totalQuestions; i++)
if (value <= i)
roundContainer(MyColors.lightGreyDeColor, i != 0)
else
roundContainer(
getStepColor(statusesList[i], isOutOfGame),
i != 0,
)
],
),
);
}
Widget roundContainer(Color color, bool isNeedLeftBorder) {
if (isNeedLeftBorder) {
return Row(
children: <Widget>[
Divider(
thickness: 6,
color: color,
).expanded,
Container(
margin: EdgeInsets.zero,
padding: EdgeInsets.zero,
width: 10,
height: 10,
decoration: BoxDecoration(shape: BoxShape.circle, color: color, border: Border.all(color: color, width: 2)),
),
],
).expanded;
}
return Container(
margin: EdgeInsets.zero,
padding: EdgeInsets.zero,
width: 10,
height: 10,
decoration: BoxDecoration(shape: BoxShape.circle, color: color, border: Border.all(color: color, width: 2)),
);
}
}