feat: quiz result page

This commit is contained in:
akhdanre 2025-04-28 20:32:16 +07:00
parent b80303b9c0
commit 9797fd4a4f
9 changed files with 260 additions and 25 deletions

View File

@ -17,6 +17,8 @@ import 'package:quiz_app/feature/quiz_play/binding/quiz_play_binding.dart';
import 'package:quiz_app/feature/quiz_play/view/quiz_play_view.dart';
import 'package:quiz_app/feature/quiz_preview/binding/quiz_preview_binding.dart';
import 'package:quiz_app/feature/quiz_preview/view/quiz_preview.dart';
import 'package:quiz_app/feature/quiz_result/binding/quiz_result_binding.dart';
import 'package:quiz_app/feature/quiz_result/view/quiz_result_view.dart';
import 'package:quiz_app/feature/register/binding/register_binding.dart';
import 'package:quiz_app/feature/register/view/register_page.dart';
import 'package:quiz_app/feature/search/binding/search_binding.dart';
@ -78,6 +80,11 @@ class AppPages {
name: AppRoutes.playQuizPage,
page: () => QuizPlayView(),
binding: QuizPlayBinding(),
),
GetPage(
name: AppRoutes.resultQuizPage,
page: () => QuizResultView(),
binding: QuizResultBinding(),
)
];
}

View File

@ -14,4 +14,5 @@ abstract class AppRoutes {
static const detailQuizPage = "/quiz/detail";
static const playQuizPage = "/quiz/play";
static const resultQuizPage = "/quiz/result";
}

View File

@ -90,8 +90,15 @@ class QuizCreationController extends GetxController {
questionTC.text = data.question ?? "";
answerTC.text = data.answer ?? "";
currentQuestionType.value = data.type ?? QuestionType.fillTheBlank;
currentQuestionType.value = data.type ?? QuestionType.fillTheBlank;
if (currentQuestionType.value == QuestionType.option) {
for (int i = 0; i < optionTCList.length; i++) {
optionTCList[i].text = data.options?[i].text ?? "";
}
} else {
cleanInput();
}
if (data.options != null && data.options!.isNotEmpty) {
for (int i = 0; i < optionTCList.length; i++) {
optionTCList[i].text = data.options!.length > i ? data.options![i].text : '';
@ -105,6 +112,12 @@ class QuizCreationController extends GetxController {
}
}
void cleanInput() {
for (final controller in optionTCList) {
controller.clear();
}
}
void _updateCurrentQuestion({
String? question,
String? answer,
@ -116,16 +129,18 @@ class QuizCreationController extends GetxController {
quizData[selectedQuizIndex.value] = current.copyWith(
question: question,
answer: answer,
options: options ??
(currentQuestionType.value == QuestionType.option
? List.generate(
optionTCList.length,
(index) => OptionData(index: index, text: optionTCList[index].text),
)
: null),
options: options,
correctAnswerIndex: correctAnswerIndex,
type: type,
);
// ??
// (currentQuestionType.value == QuestionType.option
// ? List.generate(
// optionTCList.length,
// (index) => OptionData(index: index, text: optionTCList[index].text),
// )
// : null),
}
void updateTOFAnswer(bool answer) {

View File

@ -2,6 +2,7 @@ import 'dart:async';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:quiz_app/app/routes/app_pages.dart';
import 'package:quiz_app/core/utils/logger.dart';
import 'package:quiz_app/data/models/quiz/library_quiz_model.dart';
import 'package:quiz_app/data/models/quiz/question_listings_model.dart';
@ -14,6 +15,7 @@ class QuizPlayController extends GetxController {
final isStarting = true.obs;
final isAnswerSelected = false.obs;
final selectedAnswer = ''.obs;
final idxOptionSelected = (-1).obs;
final List<AnsweredQuestion> answeredQuestions = [];
final answerTextController = TextEditingController();
@ -65,14 +67,20 @@ class QuizPlayController extends GetxController {
isAnswerSelected.value = false;
}
void selectAnswer(String answer) {
selectedAnswer.value = answer;
void selectAnswerOption(int selectedIndex) {
selectedAnswer.value = selectedIndex.toString();
isAnswerSelected.value = true;
idxOptionSelected.value = selectedIndex;
}
// void selectAnswerFTB(String answer) {
// selectedAnswer.value = answer;
// isAnswerSelected.value = true;
// }
void onChooseTOF(bool value) {
choosenAnswerTOF.value = value ? 1 : 2;
selectedAnswer.value = value ? "Ya" : "Tidak";
selectedAnswer.value = value.toString();
}
void _submitAnswerIfNeeded() {
@ -87,7 +95,6 @@ class QuizPlayController extends GetxController {
userAnswer = selectedAnswer.value.trim();
}
// Masukkan ke answeredQuestions
answeredQuestions.add(AnsweredQuestion(
index: currentIndex.value,
question: question.question,
@ -117,15 +124,19 @@ class QuizPlayController extends GetxController {
void _finishQuiz() {
_timer?.cancel();
logC.i(answeredQuestions.map((e) => e.toJson()).toList());
Get.defaultDialog(
title: "Selesai",
middleText: "Kamu telah menyelesaikan semua soal!",
onConfirm: () {
Get.back();
Get.back();
},
textConfirm: "OK",
// logC.i(answeredQuestions.map((e) => e.toJson()).toList());
// Get.defaultDialog(
// title: "Selesai",
// middleText: "Kamu telah menyelesaikan semua soal!",
// onConfirm: () {
// Get.back();
// Get.back();
// },
// textConfirm: "OK",
// );
Get.toNamed(
AppRoutes.resultQuizPage,
arguments: [quizData.questionListings, answeredQuestions],
);
}

View File

@ -1,5 +1,6 @@
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:quiz_app/app/const/colors/app_colors.dart';
import 'package:quiz_app/component/global_text_field.dart';
import 'package:quiz_app/feature/quiz_play/controller/quiz_play_controller.dart';
@ -64,13 +65,13 @@ class QuizPlayView extends GetView<QuizPlayController> {
width: double.infinity,
child: ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white,
foregroundColor: Colors.black,
backgroundColor: controller.idxOptionSelected.value == index ? AppColors.primaryBlue : Colors.white,
foregroundColor: controller.idxOptionSelected.value == index ? Colors.white : Colors.black,
side: const BorderSide(color: Colors.grey),
padding: const EdgeInsets.symmetric(vertical: 14),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
),
onPressed: () => controller.selectAnswer(option),
onPressed: () => controller.selectAnswerOption(index),
child: Text(option),
),
);

View File

@ -76,6 +76,7 @@ class QuizPreviewController extends GetxController {
return questions.map((q) {
String typeString;
String answer = "";
List<String>? option;
switch (q.type) {
case QuestionType.fillTheBlank:
typeString = 'fill_the_blank';
@ -84,6 +85,7 @@ class QuizPreviewController extends GetxController {
case QuestionType.option:
typeString = 'option';
answer = q.correctAnswerIndex.toString();
option = q.options?.map((o) => o.text).toList();
break;
case QuestionType.trueOrFalse:
typeString = 'true_false';
@ -99,7 +101,7 @@ class QuizPreviewController extends GetxController {
targetAnswer: answer,
duration: 30,
type: typeString,
options: q.options?.map((o) => o.text).toList(),
options: option,
);
}).toList();
}

View File

@ -0,0 +1,9 @@
import 'package:get/get.dart';
import 'package:quiz_app/feature/quiz_result/controller/quiz_result_controller.dart';
class QuizResultBinding extends Bindings {
@override
void dependencies() {
Get.lazyPut<QuizResultController>(() => QuizResultController());
}
}

View File

@ -0,0 +1,43 @@
import 'package:get/get.dart';
import 'package:quiz_app/data/models/quiz/question_listings_model.dart';
import 'package:quiz_app/feature/quiz_play/controller/quiz_play_controller.dart';
class QuizResultController extends GetxController {
late final List<QuestionListing> questions;
late final List<AnsweredQuestion> answers;
RxInt correctAnswers = 0.obs;
RxInt totalQuestions = 0.obs;
RxDouble scorePercentage = 0.0.obs;
@override
void onInit() {
super.onInit();
loadData();
calculateResult();
}
void loadData() {
final args = Get.arguments as List<dynamic>;
questions = args[0] as List<QuestionListing>;
answers = args[1] as List<AnsweredQuestion>;
totalQuestions.value = questions.length;
}
void calculateResult() {
int correct = answers.where((a) => a.isCorrect).length;
correctAnswers.value = correct;
if (totalQuestions.value > 0) {
scorePercentage.value = (correctAnswers.value / totalQuestions.value) * 100;
}
}
String getResultMessage() {
if (scorePercentage.value >= 80) {
return "Lulus 🎉";
} else {
return "Belum Lulus 😔";
}
}
}

View File

@ -0,0 +1,146 @@
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:quiz_app/app/const/colors/app_colors.dart';
import 'package:quiz_app/feature/quiz_result/controller/quiz_result_controller.dart';
class QuizResultView extends GetView<QuizResultController> {
const QuizResultView({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFFF9FAFB),
appBar: AppBar(
backgroundColor: Colors.transparent,
elevation: 0,
automaticallyImplyLeading: false,
title: const Text(
'Hasil Kuis',
style: TextStyle(color: Colors.black, fontWeight: FontWeight.bold),
),
iconTheme: const IconThemeData(color: Colors.black),
centerTitle: true,
),
body: SafeArea(
child: Padding(
padding: const EdgeInsets.all(16),
child: Obx(() => Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildScoreSummary(),
const SizedBox(height: 16),
Expanded(
child: ListView.builder(
itemCount: controller.questions.length,
itemBuilder: (context, index) {
return _buildQuestionResult(index);
},
),
),
],
)),
),
),
);
}
Widget _buildScoreSummary() {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Skor Kamu: ${controller.correctAnswers}/${controller.totalQuestions}",
style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
),
const SizedBox(height: 8),
LinearProgressIndicator(
value: controller.scorePercentage.value / 100,
minHeight: 10,
backgroundColor: AppColors.borderLight,
valueColor: const AlwaysStoppedAnimation<Color>(AppColors.primaryBlue),
),
const SizedBox(height: 8),
Text(
controller.getResultMessage(),
style: TextStyle(
fontSize: 16,
color: controller.scorePercentage.value >= 80 ? Colors.green : Colors.red,
),
),
],
);
}
Widget _buildQuestionResult(int index) {
final answered = controller.answers[index];
final isCorrect = answered.isCorrect;
return Container(
width: double.infinity,
margin: const EdgeInsets.only(bottom: 16),
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
border: Border.all(color: AppColors.borderLight),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 6,
offset: const Offset(2, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('Soal ${answered.index + 1}', style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 16, color: AppColors.darkText)),
const SizedBox(height: 6),
Text(
// Tidak ada tipe soal di AnsweredQuestion, jadi kalau mau kasih tipe harus pakai question[index].type
// kalau tidak mau ribet, ini bisa dihapus saja
// controller.mapQuestionTypeToText(controller.questions[answered.index].type),
'', // kosongkan dulu
style: const TextStyle(fontSize: 12, color: AppColors.softGrayText, fontStyle: FontStyle.italic),
),
const SizedBox(height: 12),
Text(
answered.question,
style: const TextStyle(fontSize: 16, color: AppColors.darkText),
),
const SizedBox(height: 12),
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Icon(Icons.person, size: 18, color: AppColors.primaryBlue),
const SizedBox(width: 6),
Expanded(
child: Text(
"Jawaban Kamu: ${answered.selectedAnswer}",
style: TextStyle(
color: isCorrect ? Colors.green : Colors.red,
fontWeight: FontWeight.bold,
),
),
),
],
),
const SizedBox(height: 4),
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Icon(Icons.check, size: 18, color: AppColors.softGrayText),
const SizedBox(width: 6),
Expanded(
child: Text(
"Jawaban Benar: ${answered.correctAnswer}",
style: const TextStyle(color: AppColors.darkText),
),
),
],
),
],
),
);
}
}