feat: Adapter RegisterChoiceScreen pour mobile (Closes #83)
- Implémentation responsive avec LayoutBuilder pour détecter mobile/desktop - Mode mobile : titre au-dessus, carte pleine largeur avec ratio 2/3, boutons verticaux - Mode desktop : chevron en haut à gauche, layout texte/carte côte à côte - Extraction de la logique de carte dans ChoiceCardWidget réutilisable - Bouton "Précédent" stylisé avec CustomNavigationButton et HoverReliefWidget - Tailles d'icônes augmentées (140px mobile, 170px desktop) Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -0,0 +1,87 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:google_fonts/google_fonts.dart';
|
||||
import '../models/card_assets.dart';
|
||||
import 'hover_relief_widget.dart';
|
||||
|
||||
/// Widget réutilisable pour la carte de choix Parent/AM
|
||||
class ChoiceCardWidget extends StatelessWidget {
|
||||
final VoidCallback onParentSelected;
|
||||
final VoidCallback onAmSelected;
|
||||
final bool isMobile;
|
||||
|
||||
const ChoiceCardWidget({
|
||||
super.key,
|
||||
required this.onParentSelected,
|
||||
required this.onAmSelected,
|
||||
this.isMobile = false,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(vertical: 30, horizontal: 20),
|
||||
decoration: BoxDecoration(
|
||||
image: DecorationImage(
|
||||
image: AssetImage(CardColorVertical.pink.path),
|
||||
fit: BoxFit.fill,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(15),
|
||||
),
|
||||
child: Column(
|
||||
mainAxisAlignment: isMobile ? MainAxisAlignment.center : MainAxisAlignment.spaceEvenly,
|
||||
children: [
|
||||
_buildChoiceButton(
|
||||
iconPath: 'assets/images/icon_parents.png',
|
||||
label: 'Parents',
|
||||
onPressed: onParentSelected,
|
||||
isMobile: isMobile,
|
||||
),
|
||||
SizedBox(height: isMobile ? 30 : 0),
|
||||
_buildChoiceButton(
|
||||
iconPath: 'assets/images/icon_assmat.png',
|
||||
label: 'Assistante Maternelle',
|
||||
onPressed: onAmSelected,
|
||||
isMobile: isMobile,
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildChoiceButton({
|
||||
required String iconPath,
|
||||
required String label,
|
||||
required VoidCallback onPressed,
|
||||
required bool isMobile,
|
||||
}) {
|
||||
final Color baseRoseColor = Colors.pink.shade300;
|
||||
final Color initialShadow = baseRoseColor.withAlpha(90);
|
||||
final Color hoverShadow = baseRoseColor.withAlpha(130);
|
||||
|
||||
return Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
HoverReliefWidget(
|
||||
onPressed: onPressed,
|
||||
borderRadius: BorderRadius.circular(15.0),
|
||||
initialShadowColor: initialShadow,
|
||||
hoverShadowColor: hoverShadow,
|
||||
child: Padding(
|
||||
padding: EdgeInsets.all(isMobile ? 6.0 : 8.0),
|
||||
child: Image.asset(iconPath, height: isMobile ? 140 : 170),
|
||||
),
|
||||
),
|
||||
SizedBox(height: isMobile ? 10 : 15),
|
||||
Text(
|
||||
label,
|
||||
style: GoogleFonts.merienda(
|
||||
fontSize: isMobile ? 20 : 26,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Colors.black.withOpacity(0.85),
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user