birkeh/adv_basics
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Start Abschnitt 4: Debugging Flutter Apps

Browse Source
This commit is contained in:
Herwig Birke
2024-02-08 08:30:10 +01:00
parent 57b71432f8
commit 3084187ff1
12 changed files with 182 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/answer_button.dart
+5 -2
View File
@@ -1,7 +1,7 @@
import 'package:flutter/material.dart';
class AnswerButton extends StatelessWidget {
AnswerButton({
const AnswerButton({
super.key,
required this.answerText,
required this.onTap,
@@ -15,7 +15,10 @@ class AnswerButton extends StatelessWidget {
return ElevatedButton(
onPressed: onTap,
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 40),
padding: const EdgeInsets.symmetric(
vertical: 10,
horizontal: 40,
),
backgroundColor: const Color.fromARGB(255, 33, 1, 95),
foregroundColor: Colors.white,
shape: RoundedRectangleBorder(
lib/data/questions.dart
+1 -1
View File
@@ -52,4 +52,4 @@ const questions = [
'By calling updateState()',
],
),
];
];
lib/main.dart
+2 -1
View File
@@ -1,6 +1,7 @@
import 'package:adv_basics/quiz.dart';
import 'package:flutter/material.dart';
import 'package:adv_basics/quiz.dart';
void main() {
runApp(const Quiz());
}
lib/models/quiz_question.dart
+4 -4
View File
@@ -4,9 +4,9 @@ class QuizQuestion {
final String text;
final List<String> answers;
List<String> get shuffeldAnswers {
final shuffeldList = List.of(answers);
shuffeldList.shuffle();
return shuffeldList;
List<String> get shuffledAnswers {
final shuffledList = List.of(answers);
shuffledList.shuffle();
return shuffledList;
}
}
lib/questions_screen.dart
+6 -3
View File
@@ -1,7 +1,8 @@
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:adv_basics/answer_button.dart';
import 'package:adv_basics/data/questions.dart';
import 'package:google_fonts/google_fonts.dart';
class QuestionsScreen extends StatefulWidget {
const QuestionsScreen({
@@ -22,8 +23,10 @@ class _QuestionsScreenState extends State<QuestionsScreen> {
void answerQuestion(String selectedAnswer) {
widget.onSelectAnswer(selectedAnswer);
// currentQuestionIndex = currentQuestionIndex + 1;
// currentQuestionIndex += 1;
setState(() {
currentQuestionIndex++;
currentQuestionIndex++; // increments the value by 1
});
}
@@ -49,7 +52,7 @@ class _QuestionsScreenState extends State<QuestionsScreen> {
textAlign: TextAlign.center,
),
const SizedBox(height: 30),
...currentQuestion.shuffeldAnswers.map((answer) {
...currentQuestion.shuffledAnswers.map((answer) {
return AnswerButton(
answerText: answer,
onTap: () {
lib/questions_summary.dart
-83
View File
@@ -1,83 +0,0 @@
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
class QuestionsSummary extends StatelessWidget {
const QuestionsSummary(this.summaryData, {super.key});
final List<Map<String, Object>> summaryData;
@override
Widget build(BuildContext context) {
return SizedBox(
height: 300,
child: SingleChildScrollView(
child: Column(
children: summaryData.map(
(data) {
return Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
CircleAvatar(
radius: 15,
backgroundColor:
(data['correct_answer'] == data['user_answer'])
? Colors.green
: Colors.red,
child: Center(
child: Text(
((data['question_index'] as int) + 1).toString(),
style: const TextStyle(
color: Colors.white,
),
),
),
),
SizedBox(
width: 20,
),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
data['question'] as String,
style: GoogleFonts.lato(
color: Colors.white,
fontSize: 14,
),
textAlign: TextAlign.left,
),
const SizedBox(
height: 5,
),
Text(
data['user_answer'] as String,
style: GoogleFonts.lato(
color: Color.fromARGB(255, 201, 153, 251),
fontSize: 14,
),
textAlign: TextAlign.left,
),
Text(
data['correct_answer'] as String,
style: GoogleFonts.lato(
color:
(data['correct_answer'] == data['user_answer'])
? Colors.green
: Colors.red,
fontSize: 14,
),
textAlign: TextAlign.left,
),
],
),
),
],
);
},
).toList(),
),
),
);
}
}
lib/questions_summary/question_identifier.dart
+35
View File
@@ -0,0 +1,35 @@
import 'package:flutter/material.dart';
class QuestionIdentifier extends StatelessWidget {
const QuestionIdentifier({
super.key,
required this.isCorrectAnswer,
required this.questionIndex,
});
final int questionIndex;
final bool isCorrectAnswer;
@override
Widget build(BuildContext context) {
final questionNumber = questionIndex + 1;
return Container(
width: 30,
height: 30,
alignment: Alignment.center,
decoration: BoxDecoration(
color: isCorrectAnswer
? const Color.fromARGB(255, 150, 198, 241)
: const Color.fromARGB(255, 249, 133, 241),
borderRadius: BorderRadius.circular(100),
),
child: Text(
questionNumber.toString(),
style: const TextStyle(
fontWeight: FontWeight.bold,
color: Color.fromARGB(255, 22, 2, 56),
),
),
);
}
}
lib/questions_summary/questions_summary.dart
+25
View File
@@ -0,0 +1,25 @@
import 'package:flutter/material.dart';
import 'package:adv_basics/questions_summary/summary_item.dart';
class QuestionsSummary extends StatelessWidget {
const QuestionsSummary(this.summaryData, {super.key});
final List<Map<String, Object>> summaryData;
@override
Widget build(BuildContext context) {
return SizedBox(
height: 400,
child: SingleChildScrollView(
child: Column(
children: summaryData.map(
(data) {
return SummaryItem(data);
},
).toList(),
),
),
);
}
}
lib/questions_summary/summary_item.dart
+58
View File
@@ -0,0 +1,58 @@
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:adv_basics/questions_summary/question_identifier.dart';
class SummaryItem extends StatelessWidget {
const SummaryItem(this.itemData, {super.key});
final Map<String, Object> itemData;
@override
Widget build(BuildContext context) {
final isCorrectAnswer =
itemData['user_answer'] == itemData['correct_answer'];
return Padding(
padding: const EdgeInsets.symmetric(
vertical: 8,
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
QuestionIdentifier(
isCorrectAnswer: isCorrectAnswer,
questionIndex: itemData['question'] as int,
),
const SizedBox(width: 20),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
itemData['question'] as String,
style: GoogleFonts.lato(
color: Colors.white,
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
const SizedBox(
height: 5,
),
Text(itemData['user_answer'] as String,
style: const TextStyle(
color: Color.fromARGB(255, 202, 171, 252),
)),
Text(itemData['correct_answer'] as String,
style: const TextStyle(
color: Color.fromARGB(255, 181, 254, 246),
)),
],
),
),
],
),
);
}
}
lib/quiz.dart
+23 -18
View File
@@ -1,8 +1,9 @@
import 'package:adv_basics/questions_screen.dart';
import 'package:flutter/material.dart';
import 'package:adv_basics/start_screen.dart';
import 'package:adv_basics/questions_screen.dart';
import 'package:adv_basics/data/questions.dart';
import 'package:adv_basics/results_screen.dart';
import 'package:flutter/material.dart';
class Quiz extends StatefulWidget {
const Quiz({super.key});
@@ -14,41 +15,45 @@ class Quiz extends StatefulWidget {
}
class _QuizState extends State<Quiz> {
List<String> selectedAnswers = [];
var activeScreen = 'start-screen';
void switchScreen() {
selectedAnswers.clear();
List<String> _selectedAnswers = [];
var _activeScreen = 'start-screen';
void _switchScreen() {
setState(() {
activeScreen = 'questions-screen';
_activeScreen = 'questions-screen';
});
}
void chooseAnswer(String answer) {
selectedAnswers.add(answer);
void _chooseAnswer(String answer) {
_selectedAnswers.add(answer);
if (selectedAnswers.length == questions.length) {
if (_selectedAnswers.length == questions.length) {
setState(() {
activeScreen = 'results-screen';
_activeScreen = 'results-screen';
});
}
}
void restartQuiz() {
setState(() {
_activeScreen = 'questions-screen';
});
}
@override
Widget build(context) {
Widget screenWidget = StartScreen(switchScreen);
Widget screenWidget = StartScreen(_switchScreen);
if (activeScreen == 'questions-screen') {
if (_activeScreen == 'questions-screen') {
screenWidget = QuestionsScreen(
onSelectAnswer: chooseAnswer,
onSelectAnswer: _chooseAnswer,
);
}
if (activeScreen == 'results-screen') {
if (_activeScreen == 'results-screen') {
screenWidget = ResultsScreen(
chosenAnswers: selectedAnswers,
onRestartQuiz: switchScreen,
chosenAnswers: _selectedAnswers,
onRestart: restartQuiz,
);
}
lib/results_screen.dart
+14 -15
View File
@@ -1,17 +1,18 @@
import 'package:flutter/material.dart';
import 'package:adv_basics/questions_summary.dart';
import 'package:adv_basics/data/questions.dart';
import 'package:adv_basics/questions_summary/questions_summary.dart';
import 'package:google_fonts/google_fonts.dart';
class ResultsScreen extends StatelessWidget {
const ResultsScreen({
super.key,
required this.chosenAnswers,
required this.onRestartQuiz,
required this.onRestart,
});
final void Function() onRestart;
final List<String> chosenAnswers;
final void Function() onRestartQuiz;
List<Map<String, Object>> get summaryData {
final List<Map<String, Object>> summary = [];
@@ -22,7 +23,7 @@ class ResultsScreen extends StatelessWidget {
'question_index': i,
'question': questions[i].text,
'correct_answer': questions[i].answers[0],
'user_answer': chosenAnswers[i],
'user_answer': chosenAnswers[i]
},
);
}
@@ -32,7 +33,7 @@ class ResultsScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
final numTotalQuestions = summaryData.length;
final numTotalQuestions = questions.length;
final numCorrectQuestions = summaryData
.where(
(data) => data['user_answer'] == data['correct_answer'],
@@ -49,8 +50,8 @@ class ResultsScreen extends StatelessWidget {
Text(
'You answered $numCorrectQuestions out of $numTotalQuestions questions correctly!',
style: GoogleFonts.lato(
color: const Color.fromARGB(255, 201, 153, 251),
fontSize: 24,
color: const Color.fromARGB(255, 230, 200, 253),
fontSize: 20,
fontWeight: FontWeight.bold,
),
textAlign: TextAlign.center,
@@ -58,19 +59,17 @@ class ResultsScreen extends StatelessWidget {
const SizedBox(
height: 30,
),
QuestionsSummary(
summaryData,
),
QuestionsSummary(summaryData),
const SizedBox(
height: 30,
),
OutlinedButton.icon(
onPressed: onRestartQuiz,
style: OutlinedButton.styleFrom(
TextButton.icon(
onPressed: onRestart,
style: TextButton.styleFrom(
foregroundColor: Colors.white,
),
icon: const Icon(Icons.update),
label: const Text('Restart Quiz'),
icon: const Icon(Icons.refresh),
label: const Text('Restart Quiz!'),
)
],
),
lib/start_screen.dart
+9 -4
View File
@@ -17,9 +17,14 @@ class StartScreen extends StatelessWidget {
width: 300,
color: const Color.fromARGB(150, 255, 255, 255),
),
const SizedBox(
height: 80,
),
// Opacity(
// opacity: 0.6,
// child: Image.asset(
// 'assets/images/quiz-logo.png',
// width: 300,
// ),
// ),
const SizedBox(height: 80),
Text(
'Learn Flutter the fun way!',
style: GoogleFonts.lato(
@@ -35,7 +40,7 @@ class StartScreen extends StatelessWidget {
),
icon: const Icon(Icons.arrow_right_alt),
label: const Text('Start Quiz'),
),
)
],
),
);