Aide
La page Aide (HelpPage) fournit une documentation complète de toutes les fonctionnalités de l'application mobile CyberCity avec une interface à deux panneaux.
HelpPage
Type : ConsumerStatefulWidget
State : _HelpPageState extends ConsumerState<HelpPage>
Propriétés
| Propriété | Type | Description |
|---|---|---|
_selectedSectionTitle |
String? |
Titre de la section actuellement sélectionnée |
_contentScrollController |
ScrollController |
Contrôleur de défilement pour le contenu (panneau droit) |
_sectionsScrollController |
ScrollController |
Contrôleur de défilement pour la liste des sections (panneau gauche) |
Méthodes
initState()
Description : Initialise la page et sélectionne la première section par défaut.
Actions : Définit _selectedSectionTitle à la première section après le premier frame
Retour : void
dispose()
Description : Libère les contrôleurs de défilement.
Retour : void
Widget _buildHeader(...)
Description : Construit l'en-tête de la page avec bouton retour et titre.
Paramètres :
context: BuildContexttranslationService: Service de traductionisTheme2: Si le thème 2 est actif
Retour : Widget
Widget _buildLeftPanel(...)
Description : Construit le panneau gauche avec la liste des sections.
Paramètres :
sections: Liste des sections d'aidetranslationService: Service de traductionisTheme2: Si le thème 2 est actif
Retour : Widget
Widget _buildRightPanel(...)
Description : Construit le panneau droit avec le contenu de la section sélectionnée.
Paramètres :
currentSection: Section actuellement sélectionnéetranslationService: Service de traductionisTheme2: Si le thème 2 est actif
Retour : Widget
Widget _buildBubblePanel({...})
Description : Construit un panneau avec effet de verre dépoli (backdrop blur).
Paramètres :
isTheme2: Si le thème 2 est actifchild: Contenu du panneauhorizontalPadding: Padding horizontal (défaut: 35)
Style : Bordure, backdrop filter, couleurs adaptatives au thème
Retour : Widget
Widget _buildSectionItem(...)
Description : Construit un item de section dans la liste de gauche.
Paramètres :
title: Titre de la sectionisActive: Si la section est actuellement sélectionnéeisTheme2: Si le thème 2 est actifonTap: Callback du clic
Style : Bordure gauche épaisse si actif, effet glow
Retour : Widget
Widget _buildNoSectionSelected(...)
Description : Construit le message affiché quand aucune section n'est sélectionnée.
Retour : Widget
MarkdownStyleSheet _buildMarkdownStyleSheet(bool isTheme2)
Description : Construit le style sheet pour le rendu Markdown du contenu.
Paramètres :
isTheme2: Si le thème 2 est actif
Retour : MarkdownStyleSheet
Éléments visuels
En-tête
- Bouton Retour : Flèche + texte "RETOUR" (coin supérieur gauche)
- Theme1: Bordure magenta + glow
- Theme2: Bordure cyan sans glow
- Titre : "AIDE" centré en grand
- Police: Orbitron, 40px, bold
- Ombre de texte adaptée au thème
Panneau gauche (Sections)
- Largeur : 300px fixe
- Titre du panneau : "SECTIONS" en Orbitron
- Liste des sections : Scrollable avec scrollbar stylisée
- 16 sections au total
- Item actif: Bordure gauche épaisse + background légèrement coloré
- Item inactif: Bordure fine + background semi-transparent
Panneau droit (Contenu)
- Largeur : Expansible (prend l'espace restant)
- Titre de section : En grand (28.8px) avec effet de texte
- Contenu Markdown : Rendu avec flutter_markdown
- Titres (H1-H6) avec ombres colorées
- Listes avec bullet points colorés
- Blocs de code avec background et bordure
- Citations avec bordure gauche
- Liens cliquables
Style des panneaux
- Backdrop blur : Effet de verre dépoli (sigma: 15)
- Background :
- Theme1: Noir transparent (alpha: 0.3)
- Theme2: Complètement transparent
- Bordures :
- Theme1: Magenta (#F07BFF)
- Theme2: Cyan (#ABF5FF, alpha: 0.23)
Scrollbars
- Couleur :
- Theme1: Magenta transparent
- Theme2: Cyan transparent
- Épaisseur : 4px (liste) et 6px (contenu)
Sections d'aide
La page contient 16 sections d'aide :
- Page Principale : Vue d'ensemble de l'accueil
- Rejoindre une Partie : Comment joindre un jeu existant
- Créer une Partie : Processus de création de jeu
- Administration des Jeux : Gestion des jeux créés
- Édition de Jeu : Édition des paramètres de jeu
- Création de Personnage : Choix d'avatar et de nom
- Salle d'Attente : Avant le début de la partie
- Vue de Jeu : Interface de jeu et contrôles
- Statistiques : Page de stats post-partie
- Boutique : Acheter des objets cosmétiques
- Modes de Jeu : CTF, BR, modes personnalisés
- Combat : Mécaniques de combat et dés
- Objets : Items, inventaire, effets
- Social : Amis, chat, canaux
- Astuces : Conseils pour mieux jouer
- FAQ : Questions fréquentes
Composants utilisés
UserProfileWidget
Widget de profil utilisateur.
Propriétés
| Propriété | Type | Description |
|---|---|---|
enableLogout |
bool |
Active/désactive le bouton de déconnexion |
ChatboxWidget
Widget de chat flottant.
Markdown (flutter_markdown)
Widget de rendu Markdown pour le contenu des sections.
Propriétés
| Propriété | Type | Description |
|---|---|---|
data |
String |
Contenu Markdown à rendre |
shrinkWrap |
bool |
Si true, s'adapte au contenu |
physics |
ScrollPhysics |
Comportement de scroll |
styleSheet |
MarkdownStyleSheet |
Feuille de style personnalisée |
Providers utilisés
translationProvider
Type : Provider<TranslationWrapper>
Provider pour la gestion de l'internationalisation (i18n).
TranslationWrapper - Méthodes
String translate(String key)
Description : Traduit une clé en fonction de la langue active.
Paramètres :
key: Clé de traduction (ex: "HELP_PAGE.TITLE")
Retour : String (texte traduit)
themeNotifierProvider
Type : StateNotifierProvider<ThemeNotifier, ThemeState>
Provider gérant le thème actif de l'application.
ThemeState
| Propriété | Type | Description |
|---|---|---|
currentTheme |
String |
ID du thème actif ("theme1" ou "theme2") |
themeData |
ThemeData |
Données du thème actif |
Navigation
- Retour :
AppRoutes.home.path→HomePage