petitspas/frontend/lib/config/display_config.dart
Julien Martin b18d5c8a9e feat(frontend): Refonte infrastructure formulaires multi-modes
- Support des modes Desktop/Mobile et Édition/Lecture seule
- Refactoring des widgets de formulaire (PersonalInfo, ProfessionalInfo, Presentation, ChildCard)
- Mise à jour des écrans de récapitulatif (ParentStep5, AmStep4)
- Ajout de navigation (Précédent/Soumettre) sur mobile

Closes #78

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:51:33 +01:00

107 lines
2.7 KiB
Dart

import 'package:flutter/material.dart';
/// Mode d'affichage d'un formulaire
enum DisplayMode {
/// Mode éditable (formulaire d'inscription)
editable,
/// Mode lecture seule (récapitulatif)
readonly,
}
/// Configuration d'affichage pour les widgets de formulaire
class DisplayConfig {
/// Mode d'affichage (editable/readonly)
final DisplayMode mode;
/// Type de layout détecté (mobile/desktop)
final LayoutType layoutType;
const DisplayConfig({
required this.mode,
required this.layoutType,
});
/// Crée une config à partir du contexte
factory DisplayConfig.fromContext(
BuildContext context, {
DisplayMode mode = DisplayMode.editable,
}) {
return DisplayConfig(
mode: mode,
layoutType: LayoutHelper.getLayoutType(context),
);
}
/// Est en mode éditable
bool get isEditable => mode == DisplayMode.editable;
/// Est en mode lecture seule
bool get isReadonly => mode == DisplayMode.readonly;
/// Est en layout mobile
bool get isMobile => layoutType == LayoutType.mobile;
/// Est en layout desktop
bool get isDesktop => layoutType == LayoutType.desktop;
/// Layout vertical (mobile)
bool get isVerticalLayout => isMobile;
/// Layout horizontal (desktop)
bool get isHorizontalLayout => isDesktop;
}
/// Type de layout
enum LayoutType {
/// Mobile (< 600px) - toujours vertical
mobile,
/// Desktop/Tablette (≥ 600px) - horizontal
desktop,
}
/// Utilitaires pour la détection de layout
class LayoutHelper {
/// Seuil de largeur pour mobile/desktop (en pixels)
static const double mobileBreakpoint = 600.0;
/// Détermine le type de layout selon la largeur d'écran
static LayoutType getLayoutType(BuildContext context) {
final width = MediaQuery.of(context).size.width;
return width < mobileBreakpoint
? LayoutType.mobile
: LayoutType.desktop;
}
/// Vérifie si on est sur mobile
static bool isMobile(BuildContext context) {
return getLayoutType(context) == LayoutType.mobile;
}
/// Vérifie si on est sur desktop
static bool isDesktop(BuildContext context) {
return getLayoutType(context) == LayoutType.desktop;
}
/// Retourne un espacement adapté au layout
static double getSpacing(BuildContext context, {
double mobileSpacing = 12.0,
double desktopSpacing = 20.0,
}) {
return isMobile(context) ? mobileSpacing : desktopSpacing;
}
/// Retourne une largeur max adaptée au layout
static double getMaxWidth(BuildContext context, {
double? mobileMaxWidth,
double? desktopMaxWidth,
}) {
if (isMobile(context)) {
return mobileMaxWidth ?? double.infinity;
} else {
return desktopMaxWidth ?? 1200.0;
}
}
}