Files
GameTime/.ideai/tickets/177/carnet.md

4.0 KiB
Raw Blame History

issueRef, version, updatedBy, updatedAt
issueRef version updatedBy updatedAt
#177 4
kind agent_id
agent f3408f5d-469c-4f64-9485-d8b218f3ff26
1785318789682

#177 — Cadrage UX (2026-07-29)

Statut : cadrage exploitable, révision du lot #171 déjà livré — même fichier/zone (_CurrentStepPane, branche générale reps-only, workout_execution_screen.dart L2851-2899). Le retour utilisateur porte sur le résultat visuel de la correction apportée pour #171 (suppression du scroll), pas sur une régression fonctionnelle : la rangée [Passer l'étape] [···] [Étape suivante] tient sur une ligne mais rend mal (trois éléments hétérogènes — deux boutons pleine largeur + un bouton icône carré — écrasés côte à côte).

Diagnostic

Le défaut n'est pas l'absence de place, c'est la hiérarchie plate : Passer l'étape (contournement, cas rare) et Étape suivante (action attendue, cas fréquent) ont exactement le même poids visuel, et le menu ··· (encore plus secondaire : passer le passage/la séquence) est coincé entre les deux au lieu d'être clairement rattaché à l'action secondaire. Cette rangée plate contredit le principe déjà appliqué ailleurs dans ce lot UI (montre, #166) : une seule action principale, mise en avant ; les actions de contournement reléguées, jamais au même niveau visuel.

Comportement attendu

Séparer en deux rangées, primaire au-dessus / secondaire en dessous — reprend la hiérarchie déjà utilisée par la montre (#166) : action attendue mise en avant, contournement discret en dessous.

Pompes tempo

        10
   RÉPÉTITIONS

[      ✓  Étape suivante      ]   ← rangée 1 : pleine largeur, action principale

[  Passer l'étape  ]        [···]  ← rangée 2 : secondaire, inchangée
  • Rangée 1 (nouvelle) : Étape suivante seul, FilledButton.icon, pleine largeur (Size.fromHeight(48)), pas de partage de ligne avec un autre bouton. C'est l'action que l'utilisateur va faire dans l'immense majorité des cas (terminer ses répétitions) — elle mérite tout l'espace et toute l'attention.
  • Rangée 2 (existante, inchangée) : Passer l'étape (Expanded) + menu ··· (Passer ce passage / Passer la séquence), exactement le layout déjà en place pour les étapes sans reps (cas général sans le bouton Étape suivante, L2851-2884) — donc pas de nouveau composant, juste la suppression du 3ᵉ élément qui polluait cette rangée.
  • Écart vertical entre les deux rangées : SizedBox(height: 8), cohérent avec les autres espacements de ce fichier (cf. L2774, L2840).
  • Mutualisation : ce becomes le layout standard des boutons de bas d'écran pour toute étape ayant une action de complétion explicite (reps sans chrono aujourd'hui ; potentiellement d'autres cas futurs) — une rangée pleine largeur pour l'action principale, une rangée dédiée aux actions de contournement en dessous. Le cas hasRepsWithStopwatchScore (L2775-2799, deux boutons Expanded côte à côte) reste inchangé : ce cas a déjà validé son propre layout à deux boutons de poids égal (pas de ···), pas concerné par cette révision.

Implémentation

Dans la branche générale (L2851-2899), remplacer le Row unique conditionnel par :

if (step.type == ExerciseStepType.reps) ...[
  FilledButton.icon(
    onPressed: onCompleteStep,
    style: FilledButton.styleFrom(minimumSize: const Size.fromHeight(48)),
    icon: const Icon(Icons.check),
    label: const Text('Étape suivante'),
  ),
  const SizedBox(height: 8),
],
Row(
  children: [
    Expanded(
      child: OutlinedButton(
        onPressed: onSkipStep,
        style: OutlinedButton.styleFrom(minimumSize: const Size.fromHeight(44)),
        child: const Text('Passer létape'),
      ),
    ),
    const SizedBox(width: 8),
    PopupMenuButton<_StepSkipAction>(/* inchangé */),
  ],
),

Aucune nouvelle donnée, aucun nouveau contrat — pur remaniement de présentation, réutilisation de composants et de styles déjà en place dans le fichier.