303 lines
13 KiB
Dart
303 lines
13 KiB
Dart
import 'package:flutter/material.dart';
|
|
import '../database/pokedex_database.dart';
|
|
|
|
class GameOverPage extends StatefulWidget {
|
|
const GameOverPage({Key? key}) : super(key: key);
|
|
|
|
@override
|
|
State<GameOverPage> createState() => _GameOverPageState();
|
|
}
|
|
|
|
class _GameOverPageState extends State<GameOverPage> {
|
|
int _seenCount = 0;
|
|
bool _isLoading = true;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_loadSeenCount();
|
|
}
|
|
|
|
Future<void> _loadSeenCount() async {
|
|
int count = await PokedexDatabase.getSeenCount();
|
|
if (mounted) {
|
|
setState(() {
|
|
_seenCount = count;
|
|
_isLoading = false;
|
|
});
|
|
}
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final Map<String, dynamic>? args =
|
|
ModalRoute.of(context)!.settings.arguments as Map<String, dynamic>?;
|
|
|
|
final String pokemonImage = args?['pokemonImage'] ?? '';
|
|
final String pokemonName = args?['pokemonName'] ?? 'Unknown';
|
|
final int streak = args?['streak'] ?? 0;
|
|
|
|
// Pad streak with zeroes to 3 digits as in mockup (e.g. 004)
|
|
final String streakText = streak.toString().padLeft(3, '0');
|
|
|
|
// Define color palette from mockup
|
|
const Color pokedexRed = Color(0xFFD32F2F);
|
|
const Color darkRed = Color(0xFF9E1B1B);
|
|
const Color silverBg = Color(0xFFC8D1D8);
|
|
const Color messageBoxBg = Color(0xFF1B2333);
|
|
const Color statBoxBg = Color(0xFFD9E0E5); // slightly lighter/different silver for stats
|
|
const Color tryAgainBtn = Color(0xFF2962FF); // Blue
|
|
const Color backBtn = Color(0xFFA66A00); // Brown
|
|
|
|
return Scaffold(
|
|
backgroundColor: pokedexRed,
|
|
body: _isLoading
|
|
? const Center(child: CircularProgressIndicator(color: Colors.white))
|
|
: SingleChildScrollView(
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16.0),
|
|
child: Column(
|
|
children: [
|
|
// Top Box: Pokemon Silhouette & GAME OVER
|
|
Container(
|
|
decoration: BoxDecoration(
|
|
color: darkRed, // Border color
|
|
border: Border.all(color: darkRed, width: 4),
|
|
),
|
|
child: Container(
|
|
width: double.infinity,
|
|
padding: const EdgeInsets.symmetric(vertical: 32, horizontal: 16),
|
|
color: silverBg,
|
|
child: Column(
|
|
children: [
|
|
// GAME OVER Banner
|
|
Container(
|
|
color: darkRed,
|
|
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 8),
|
|
child: const Text(
|
|
"GAME OVER",
|
|
style: TextStyle(
|
|
fontSize: 26,
|
|
color: Colors.yellow,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: 2,
|
|
shadows: [
|
|
Shadow(
|
|
offset: Offset(1.5, 1.5),
|
|
color: Colors.black,
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
// Pokemon Image and Name
|
|
if (pokemonImage.isNotEmpty)
|
|
SizedBox(
|
|
height: 140,
|
|
child: Image.network(pokemonImage, fit: BoxFit.contain),
|
|
),
|
|
const SizedBox(height: 12),
|
|
Text(
|
|
"It was $pokemonName!",
|
|
textAlign: TextAlign.center,
|
|
style: const TextStyle(
|
|
fontSize: 22,
|
|
fontWeight: FontWeight.bold,
|
|
color: Color(0xFF1B2333),
|
|
letterSpacing: 1,
|
|
),
|
|
),
|
|
const SizedBox(height: 8),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
|
|
// Divider between boxes
|
|
Padding(
|
|
padding: const EdgeInsets.symmetric(vertical: 24.0),
|
|
child: Row(
|
|
children: [
|
|
Expanded(
|
|
child: Container(height: 2, color: darkRed),
|
|
),
|
|
const SizedBox(width: 8),
|
|
Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: List.generate(3, (index) =>
|
|
Container(
|
|
width: 8,
|
|
height: 8,
|
|
margin: const EdgeInsets.symmetric(horizontal: 4),
|
|
decoration: const BoxDecoration(
|
|
color: darkRed,
|
|
shape: BoxShape.circle,
|
|
),
|
|
)
|
|
),
|
|
),
|
|
const SizedBox(width: 8),
|
|
Expanded(
|
|
child: Container(height: 2, color: darkRed),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
|
|
// Bottom Box: Message, Stats, Buttons
|
|
Container(
|
|
decoration: BoxDecoration(
|
|
color: darkRed,
|
|
border: Border.all(color: darkRed, width: 4),
|
|
),
|
|
child: Container(
|
|
width: double.infinity,
|
|
padding: const EdgeInsets.all(16),
|
|
color: silverBg,
|
|
child: Column(
|
|
children: [
|
|
// Message Box
|
|
Container(
|
|
width: double.infinity,
|
|
color: messageBoxBg,
|
|
padding: const EdgeInsets.all(24),
|
|
child: const Text(
|
|
"\"Looks like your journey\nends here. You've run out\nof energy!\"",
|
|
textAlign: TextAlign.center,
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.normal,
|
|
height: 1.5,
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
|
|
// Stats Row
|
|
Row(
|
|
children: [
|
|
Expanded(
|
|
child: Container(
|
|
color: statBoxBg,
|
|
padding: const EdgeInsets.symmetric(vertical: 12),
|
|
child: Column(
|
|
children: [
|
|
const Text(
|
|
"STREAK",
|
|
style: TextStyle(
|
|
color: Colors.red,
|
|
fontSize: 10,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: 1,
|
|
),
|
|
),
|
|
const SizedBox(height: 4),
|
|
Text(
|
|
streakText,
|
|
style: const TextStyle(
|
|
color: Colors.black,
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(width: 16),
|
|
Expanded(
|
|
child: Container(
|
|
color: statBoxBg,
|
|
padding: const EdgeInsets.symmetric(vertical: 12),
|
|
child: Column(
|
|
children: [
|
|
const Text(
|
|
"SEEN",
|
|
style: TextStyle(
|
|
color: Colors.red,
|
|
fontSize: 10,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: 1,
|
|
),
|
|
),
|
|
const SizedBox(height: 4),
|
|
Text(
|
|
"$_seenCount/1025", // Gen 9 total
|
|
style: const TextStyle(
|
|
color: Colors.black,
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 16),
|
|
|
|
// Try Again Button
|
|
SizedBox(
|
|
width: double.infinity,
|
|
height: 60,
|
|
child: ElevatedButton.icon(
|
|
onPressed: () {
|
|
Navigator.pop(context, true);
|
|
},
|
|
icon: const Icon(Icons.refresh, color: Colors.white, size: 24),
|
|
label: const Text(
|
|
"TRY AGAIN",
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: 2,
|
|
),
|
|
),
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: tryAgainBtn,
|
|
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.zero),
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
|
|
// Back to Pokedex Button
|
|
SizedBox(
|
|
width: double.infinity,
|
|
height: 60,
|
|
child: ElevatedButton.icon(
|
|
onPressed: () {
|
|
Navigator.pop(context, false);
|
|
},
|
|
icon: const Icon(Icons.menu_book, color: Colors.white, size: 24),
|
|
label: const Text(
|
|
"BACK TO POKEDEX",
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: 2,
|
|
),
|
|
),
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: backBtn,
|
|
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.zero),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|