AvaloniaGuide - Formation Avalonia UI

Application pédagogique interactive pour apprendre le développement d'applications avec Avalonia UI, un framework multiplateforme pour .NET.

📋 Description

Cette application de formation a été développée pour les enseignants de niveau collégial souhaitant incorporer Avalonia UI dans leur curriculum. Elle présente de manière structurée et progressive les concepts fondamentaux du framework, en utilisant le pattern MVVM (Model-View-ViewModel) et le MVVM Community Toolkit.

L'application couvre les sujets suivants :

• Introduction MVVM : INotifyPropertyChanged, ObservableObject, ObservableProperty, RelayCommand
• Contrôles de mise en page : Grid, DockPanel, StackPanel, ScrollViewer, ItemsControl, Canvas, RelativePanel
• Contrôles de collections : ComboBox, ListBox, TreeView, DataGrid
• Autres contrôles : TextBox, Button, CheckBox, TabControl, DatePicker, Menu, etc.
• Bindings : Compiled vs Reflection, ValueConverter, MarkupExtension, MultiBinding, Validation
• Commands : RelayCommand, AsyncRelayCommand, CommandParameter, CanExecute
• Ressources : Ressources embarquées avec avares://
• Styles : Sélecteurs, pseudo-classes, ControlTheme, fichiers de styles
• Fenêtres : Modales, modeless, communication parent-enfant
• DevTools : Logical Tree, Visual Tree, inspecteur de propriétés

🚀 Démarrage rapide

Prérequis

• .NET 9.0 SDK ou supérieur

Installation et exécution

# Cloner le dépôt
git clone https://github.com/xfortin-devolutions/AvaloniaGuide.git
cd AvaloniaGuide

# Restaurer les dépendances
dotnet restore

# Lancer l'application
dotnet run --project GuideApp/GuideApp.csproj

🎯 Objectifs pédagogiques

• Comprendre les principes du pattern MVVM
• Maîtriser les contrôles de base d'Avalonia UI
• Apprendre les techniques de binding avancées
• Développer des interfaces utilisateur réactives et maintenables
• Utiliser les outils de développement (DevTools)

🏗️ Structure du projet

AvaloniaGuide/
├── GuideApp/                           # Application principale
│   ├── Common/                         # Classes de base et utilitaires
│   ├── Controls/                       # Contrôles réutilisables (CodeViewer, WarningBox)
│   ├── MainWindow/                     # Fenêtre principale et navigation
│   ├── Sections/                       # Sections de formation
│   │   ├── 00-Welcome/                 # Bienvenue
│   │   ├── 01-MvvmIntro/               # Introduction MVVM
│   │   ├── 02-LayoutControls/          # Contrôles de mise en page
│   │   ├── 03-CollectionControls/      # Contrôles de collections
│   │   ├── 04-OtherControls/           # Autres contrôles
│   │   ├── 05-Bindings/                # Bindings
│   │   ├── 06-Commands/                # Commands
│   │   ├── 07-Resources/               # Ressources
│   │   ├── 08-Styles/                  # Styles
│   │   ├── 09-Windows/                 # Fenêtres
│   │   ├── 10-DevTools/                # DevTools
│   │   └── 99-Sources/                 # Sources et références
│   └── Assets/                         # Ressources embarquées
├── CLAUDE.md                           # Conventions du projet
└── GuideAppPlan.md                     # Plan de construction détaillé

🎨 Fonctionnalités

• Navigation intuitive : Menu latéral avec toutes les sections
• Démos interactives : Chaque concept est accompagné d'exemples pratiques
• Affichage du code : Syntax highlighting pour C# et XAML avec support des thèmes clair/sombre
• Thèmes : Support complet du thème clair et sombre avec changement dynamique
• Responsive : Interface adaptée avec ScrollViewer et mise en page flexible

📦 Dépendances

• Avalonia - Framework UI multiplateforme
• CommunityToolkit.Mvvm - MVVM Toolkit
• Avalonia.Controls.DataGrid - Contrôle DataGrid
• Avalonia.Controls.ColorPicker - Contrôle ColorPicker

📚 Ressources utilisées

Ce projet a été développé en utilisant les ressources suivantes :

• Documentation officielle Avalonia
• Avalonia Book par Wiesław Sołtes
• Avalonia Control Catalog
• Claude - Assistant IA pour le développement et la structuration du contenu

🤝 Contributions

Les contributions sont les bienvenues ! N'hésitez pas à :

• Signaler des bugs ou problèmes
• Proposer de nouvelles démonstrations
• Améliorer la documentation
• Suggérer des améliorations pédagogiques

📄 Licence

Ce projet est sous licence MIT. Voir le fichier LICENSE pour plus de détails.

🎓 Public cible

• Enseignants de niveau collégial en informatique
• Étudiants en programmation .NET
• Développeurs souhaitant apprendre Avalonia UI

⚙️ Configuration requise

• Système d'exploitation : Windows, macOS, ou Linux
• .NET : Version 9.0 ou supérieure
• IDE recommandé : JetBrains Rider ou Visual Studio 2022

🔧 Développement

Conventions de code

Le projet suit des conventions strictes documentées dans CLAUDE.md :

• Code source en anglais (identificateurs, méthodes, propriétés)
• Documentation et commentaires en français
• Tous les ViewModels se terminent par le suffixe ViewModel
• Organisation par sections numérotées
• Namespace uniforme : GuideApp.Sections pour les sections principales

Architecture

• Pattern MVVM : Séparation complète entre logique et présentation
• MVVM Community Toolkit : Utilisation intensive des attributs source generators
• ViewLocator : Association automatique View-ViewModel
• ContentControl : Navigation dynamique entre sections

📸 Captures d'écran

Thème clair

Thème sombre

L'application présente :

• Une interface à menu latéral pour la navigation
• Des démos interactives pour chaque concept
• De la coloration syntaxique pour le code C# et XAML
• Un support complet des thèmes clair et sombre avec changement dynamique

🐛 Problèmes connus

Voir la section "Known Issues" dans GuideAppPlan.md pour la liste des problèmes connus et limitations.

📞 Contact

Pour toute question ou suggestion concernant ce projet de formation, n'hésitez pas à ouvrir une issue sur GitHub.

---

Note : Ce projet a été développé avec l'assistance de Claude, l'assistant IA d'Anthropic, pour structurer le contenu pédagogique, développer les exemples de code, et optimiser l'architecture MVVM.