qlionbleusamandClaude Opus 5
32582aba3d
Ajoute un didacticiel joué à la première utilisation : un voile sombre perce un trou de lumière autour de l'élément à découvrir, une main animée mime le geste attendu (tap, appui long, glisser, pincement à deux doigts pour zoomer) et une bulle explique l'étape avec sa progression. - visite d'accueil : nouvelle session, télémétrie, barre de navigation, réglages - visite de l'éditeur d'impacts : ajouter, déplacer, zoomer au pincement, valider - chaque visite n'est jouée qu'une fois (SharedPreferences) - Paramètres > Aide & didacticiel > Revoir le didacticiel : réinitialise tout et relance la visite au retour sur l'écran concerné Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
77 lines
2.0 KiB
Dart
77 lines
2.0 KiB
Dart
/// Modèle d'une étape de didacticiel (visite guidée).
|
|
///
|
|
/// Une étape met en avant un élément de l'écran (le « spot ») grâce à une
|
|
/// [GlobalKey] posée sur le widget concerné, et affiche une bulle explicative
|
|
/// accompagnée, si besoin, d'une main animée qui mime le geste attendu
|
|
/// (tap, appui long, pincement…) comme dans les applications mobiles.
|
|
library;
|
|
|
|
import 'package:flutter/widgets.dart';
|
|
|
|
/// Geste mimé par la main animée pendant l'étape.
|
|
enum TutorialGesture {
|
|
/// Aucune main animée : simple explication.
|
|
none,
|
|
|
|
/// Un appui simple.
|
|
tap,
|
|
|
|
/// Deux appuis rapprochés.
|
|
doubleTap,
|
|
|
|
/// Un appui maintenu.
|
|
longPress,
|
|
|
|
/// Un appui maintenu suivi d'un déplacement du doigt.
|
|
drag,
|
|
|
|
/// Deux doigts qui s'écartent puis se rapprochent (zoom).
|
|
pinch,
|
|
|
|
/// Un doigt qui balaie l'écran vers le haut.
|
|
swipeUp,
|
|
|
|
/// Un doigt qui balaie l'écran horizontalement.
|
|
swipeHorizontal,
|
|
}
|
|
|
|
/// Forme du trou de lumière découpé dans le voile sombre.
|
|
enum TutorialHighlightShape { rounded, circle }
|
|
|
|
class TutorialStep {
|
|
/// Clé posée sur le widget à mettre en avant.
|
|
///
|
|
/// `null` (ou clé non montée) => l'étape s'affiche comme une carte centrée,
|
|
/// utile pour les messages d'accueil et de fin.
|
|
final GlobalKey? targetKey;
|
|
|
|
final String title;
|
|
final String description;
|
|
|
|
/// Geste mimé par la main animée.
|
|
final TutorialGesture gesture;
|
|
|
|
final TutorialHighlightShape shape;
|
|
|
|
/// Marge ajoutée autour du widget mis en avant.
|
|
final double spotPadding;
|
|
|
|
/// Icône affichée dans la bulle explicative.
|
|
final IconData? icon;
|
|
|
|
/// Force la position de la bulle (`true` = au-dessus du spot).
|
|
/// Par défaut, la bulle se place automatiquement du côté le plus dégagé.
|
|
final bool? preferTooltipAbove;
|
|
|
|
const TutorialStep({
|
|
this.targetKey,
|
|
required this.title,
|
|
required this.description,
|
|
this.gesture = TutorialGesture.none,
|
|
this.shape = TutorialHighlightShape.rounded,
|
|
this.spotPadding = 8,
|
|
this.icon,
|
|
this.preferTooltipAbove,
|
|
});
|
|
}
|