guillaumev/quel-est-ce-pokemon
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(list): split pokemon_list into sub-widgets (<150 lines)

Browse Source 
Extract PokedexListHeader, PokedexCountBar; reuse shared ScanlineOverlay.
pokemon_list.dart 169 -> 128 lines.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Maxiwere45 2026-06-23 11:53:27 +02:00
parent b12739af09
commit e93384bf71
3 changed files with 76 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
lib/presentation/pages/pokemon_list.dart
View File

@ -3,7 +3,11 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
import '../../domain/entities/pokemon.dart';
import '../providers/pokedex_provider.dart';
import '../widgets/pokemon_tile.dart';
import '../widgets/scanline_overlay.dart';
import '../widgets/list/pokedex_list_header.dart';
import '../widgets/list/pokedex_count_bar.dart';
/// Liste du Pokédex national avec filtre ALL / CAUGHT.
class PokemonListPage extends ConsumerStatefulWidget {
const PokemonListPage({Key? key}) : super(key: key);
@ -35,21 +39,7 @@ class _PokemonListPageState extends ConsumerState<PokemonListPage> {
decoration: const BoxDecoration(color: Color(0xFFC8D1D8)),
child: Column(
children: [
// Header
Container(
padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 12.0),
color: const Color(0xFF90A4AE),
child: const Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Icon(Icons.menu, color: Colors.black87),
Text('LIST - NATIONAL',
style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold, letterSpacing: 2)),
Icon(Icons.search, color: Colors.black87),
],
),
),
// Tabs
const PokedexListHeader(),
Container(
color: const Color(0xFF90A4AE),
height: 40,
@ -60,62 +50,20 @@ class _PokemonListPageState extends ConsumerState<PokemonListPage> {
],
),
),
// Caught Count Bar
Container(
padding: const EdgeInsets.symmetric(vertical: 12.0),
decoration: const BoxDecoration(
color: Color(0xFFB0BEC5),
border: Border(bottom: BorderSide(color: Color(0xFF78909C), width: 2)),
),
child: Column(
children: [
Text(
'${caughtCount.toString().padLeft(3, '0')} / ${pokedexAsync.valueOrNull?.length ?? 0}',
style: const TextStyle(fontSize: 32, fontWeight: FontWeight.bold),
),
const Text('POKEMON DISCOVERED',
style: TextStyle(fontSize: 14, color: Colors.black54, letterSpacing: 1)),
],
),
),
// The List
PokedexCountBar(caught: caughtCount, total: pokedexAsync.valueOrNull?.length ?? 0),
Expanded(
child: Stack(
children: [
Positioned.fill(
child: ListView.builder(
itemCount: 100,
physics: const NeverScrollableScrollPhysics(),
itemBuilder: (context, index) => Container(
height: 4,
margin: const EdgeInsets.only(bottom: 4),
color: Colors.black.withAlpha(2),
),
),
),
const ScanlineOverlay(),
pokedexAsync.when(
loading: () => const Center(child: CircularProgressIndicator()),
error: (e, _) => Center(
child: Text('Erreur de chargement\n$e',
textAlign: TextAlign.center,
style: const TextStyle(color: Colors.black54)),
textAlign: TextAlign.center, style: const TextStyle(color: Colors.black54)),
),
data: (all) {
final filtered = _applyFilter(all);
if (filtered.isEmpty) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(Icons.search_off, size: 64, color: Colors.black26),
const SizedBox(height: 16),
Text('NO POKEMON FOUND IN $_filter',
style: const TextStyle(
color: Colors.black45, fontSize: 18, fontWeight: FontWeight.bold)),
],
),
);
}
if (filtered.isEmpty) return _emptyState();
return ListView.builder(
controller: _scrollController,
padding: const EdgeInsets.all(12),
@ -127,7 +75,6 @@ class _PokemonListPageState extends ConsumerState<PokemonListPage> {
],
),
),
// Footer
Container(
height: 24,
color: const Color(0xFF1B2333),
@ -140,6 +87,20 @@ class _PokemonListPageState extends ConsumerState<PokemonListPage> {
);
}
Widget _emptyState() {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(Icons.search_off, size: 64, color: Colors.black26),
const SizedBox(height: 16),
Text('NO POKEMON FOUND IN $_filter',
style: const TextStyle(color: Colors.black45, fontSize: 18, fontWeight: FontWeight.bold)),
],
),
);
}
Widget _buildTab(String title, bool isSelected) {
return Expanded(
child: GestureDetector(
@ -159,9 +120,7 @@ class _PokemonListPageState extends ConsumerState<PokemonListPage> {
alignment: Alignment.center,
child: Text(title,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: isSelected ? Colors.black : Colors.black54)),
fontSize: 18, fontWeight: FontWeight.bold, color: isSelected ? Colors.black : Colors.black54)),
),
),
);

29
lib/presentation/widgets/list/pokedex_count_bar.dart Normal file
View File

@ -0,0 +1,29 @@
import 'package:flutter/material.dart';
/// Bandeau affichant le nombre de Pokémon découverts sur le total.
class PokedexCountBar extends StatelessWidget {
final int caught;
final int total;
const PokedexCountBar({super.key, required this.caught, required this.total});
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.symmetric(vertical: 12.0),
decoration: const BoxDecoration(
color: Color(0xFFB0BEC5),
border: Border(bottom: BorderSide(color: Color(0xFF78909C), width: 2)),
),
child: Column(
children: [
Text(
'${caught.toString().padLeft(3, '0')} / $total',
style: const TextStyle(fontSize: 32, fontWeight: FontWeight.bold),
),
const Text('POKEMON DISCOVERED',
style: TextStyle(fontSize: 14, color: Colors.black54, letterSpacing: 1)),
],
),
);
}
}

23
lib/presentation/widgets/list/pokedex_list_header.dart Normal file
View File

@ -0,0 +1,23 @@
import 'package:flutter/material.dart';
/// Barre de titre de la liste du Pokédex.
class PokedexListHeader extends StatelessWidget {
const PokedexListHeader({super.key});
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 12.0),
color: const Color(0xFF90A4AE),
child: const Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Icon(Icons.menu, color: Colors.black87),
Text('LIST - NATIONAL',
style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold, letterSpacing: 2)),
Icon(Icons.search, color: Colors.black87),
],
),
);
}
}