refactor(game-over): split game_over_page into sub-widgets (<150 lines)
Extract GameOverHeader, GameOverStats (+ reusable _StatBox), HingeDivider, GameOverActions. game_over_page.dart 338 -> 100 lines. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,44 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Boutons d'action de l'écran game over : rejouer ou retourner au Pokédex.
|
||||
class GameOverActions extends StatelessWidget {
|
||||
final VoidCallback onTryAgain;
|
||||
final VoidCallback onBack;
|
||||
|
||||
const GameOverActions({super.key, required this.onTryAgain, required this.onBack});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Column(
|
||||
children: [
|
||||
_button(label: "TRY AGAIN", icon: Icons.refresh, color: const Color(0xFF2962FF), onPressed: onTryAgain),
|
||||
const SizedBox(height: 16),
|
||||
_button(label: "BACK TO POKEDEX", icon: Icons.menu_book, color: const Color(0xFFA66A00), onPressed: onBack),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _button({
|
||||
required String label,
|
||||
required IconData icon,
|
||||
required Color color,
|
||||
required VoidCallback onPressed,
|
||||
}) {
|
||||
return SizedBox(
|
||||
width: double.infinity,
|
||||
height: 60,
|
||||
child: ElevatedButton.icon(
|
||||
onPressed: onPressed,
|
||||
icon: Icon(icon, color: Colors.white, size: 24),
|
||||
label: Text(
|
||||
label,
|
||||
style: const TextStyle(color: Colors.white, fontSize: 18, fontWeight: FontWeight.bold, letterSpacing: 2),
|
||||
),
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: color,
|
||||
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.zero),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,58 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import '../pokemon_image.dart';
|
||||
|
||||
/// Bloc supérieur de l'écran game over : bannière "GAME OVER", image et nom du Pokémon.
|
||||
class GameOverHeader extends StatelessWidget {
|
||||
final String pokemonImage;
|
||||
final String pokemonName;
|
||||
|
||||
const GameOverHeader({super.key, required this.pokemonImage, required this.pokemonName});
|
||||
|
||||
static const _darkRed = Color(0xFF9E1B1B);
|
||||
static const _silverBg = Color(0xFFC8D1D8);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
decoration: BoxDecoration(color: _darkRed, 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: [
|
||||
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),
|
||||
if (pokemonImage.isNotEmpty)
|
||||
SizedBox(height: 140, child: PokemonImage(imageUrl: 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),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,52 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Rangée de statistiques de fin de partie (STREAK / SEEN / SCORE).
|
||||
class GameOverStats extends StatelessWidget {
|
||||
final String streak;
|
||||
final String seen;
|
||||
final String score;
|
||||
|
||||
const GameOverStats({super.key, required this.streak, required this.seen, required this.score});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Row(
|
||||
children: [
|
||||
Expanded(child: _StatBox(label: "STREAK", value: streak)),
|
||||
const SizedBox(width: 16),
|
||||
Expanded(child: _StatBox(label: "SEEN", value: seen)),
|
||||
const SizedBox(width: 16),
|
||||
Expanded(child: _StatBox(label: "SCORE", value: score)),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Une case de statistique : un libellé rouge au-dessus d'une valeur.
|
||||
class _StatBox extends StatelessWidget {
|
||||
final String label;
|
||||
final String value;
|
||||
|
||||
const _StatBox({required this.label, required this.value});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
color: const Color(0xFFD9E0E5),
|
||||
padding: const EdgeInsets.symmetric(vertical: 12),
|
||||
child: Column(
|
||||
children: [
|
||||
Text(
|
||||
label,
|
||||
style: const TextStyle(color: Colors.red, fontSize: 10, fontWeight: FontWeight.bold, letterSpacing: 1),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
value,
|
||||
style: const TextStyle(color: Colors.black, fontSize: 16, fontWeight: FontWeight.bold),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Séparateur décoratif (deux traits + trois points) entre les blocs de l'écran game over.
|
||||
class HingeDivider extends StatelessWidget {
|
||||
const HingeDivider({super.key});
|
||||
|
||||
static const _darkRed = Color(0xFF9E1B1B);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return 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)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user