WPF : Découverte de MVVM Light Toolkit

 

 

Dans un article précédent nous avons décortiqué un projet ultra minimaliste pour démarrer en douceur avec le pattern MVVM en WPF.

Nous n'avions utilisé aucun framework MVVM tiers, nous avions juste créé nous même 2 petits helpers MVVM : RelayCommand et ObservableObject(=ViewModelBase).

MVVM Light apporte quand même des choses bien pratiques en plus :)
Je vais tacher de vous en donner un petit aperçu...


En quelques lignes, MVVM Light apporte les possibilités suivantes :

• Une classe ViewModelBase déjà faite et apportant plus de possibilités
• Une classe RelayCommand déjà faite avec possibilité de passer un paramètre à la commande
• La possibilité de rediriger simplement un évènement vers une commande (EventToCommand)
• Un ServiceLocator qui permet mieux découpler la vue et le vue modèle
• Un IoC simple pour faire de l'injection de dépendance et avoir un couplage mou entre la vue, le vue modèle et le modèle
• Un système de messenging pour faire communiquer étages qui ne se connaissent pas forcément (ex : le vue modèle ne connait pas la vue)
• D'autres choses encore qui sortent du cadre de cette article...

J'ai volontairement repris exactement le même projet que dans l'article précédent, pour que vous puissiez bien voir les quelques changements à apporter pour utiliser MVVM Light :

Voici les quelques changements que j'ai essayé de vous commenter de façon simple et rapide :

ViewModelBase
Le vue modèle VoirContactViewModel hérite désormais du ViewModelBase de MVVM Light (et non plus de ObservableObject)
Dans le Set de chacune des propriétés d'un contact défini dans le vue modèle :
Avant : OnPropertyChanged("xxx");
Après : RaisePropertyChanged(() => xxx);
(c'est mieux d'avoir à taper xxx sous forme de propriété plutôt que sous forme de magic string "xxx", moins de risque de mal taper, mauvaise casse...)

RelayCommand
Dans le vue modèle VoirContactViewModel, au niveau du relayage des commandes :

Avant :
ChargerContactCommand = new RelayCommand(ChargeContact);

Après :
VoirContactCommand = new RelayCommand<RoutedEventArgs>(VoirContact);

(C'est juste la syntaxe qui change un peu car le RelayCommand de MVVM Light supporte le passage d'un paramètre

ServiceLocator
Dans la vue VoirContactView, la façon de déclarer le binding entre la vue et le vue modèle à un peu changé étant donné que c'est maintenant le service locator qui va donner le vue modèle à la vue.

Avant :
<Window.DataContext><viewmodel:VoirContactViewModel /></Window.DataContext>

Après :
DataContext="{Binding VoirContactVM, Source={StaticResource Locator}}"

(C'est désormais le ServiceLocator qui va gérer la distribution des vues modèles aux vues de façon centralisée et par injection de dépendance)
 
Messenging
Une fois qu'un contact est affiché à l'écran par la vue, une MessageBox s'affiche "Le contact xxx a été affiché avec succès..."
C'est le vue modèle VoirContactViewModel qui ordonne à la vue VoirContactView d'afficher cette MessageBox alors que le vue modèle n'a aucune connaissance de la vue qui l'utilise.
Comment ça peut fonctionner alors ? Via le système d'envoi de messages de MVVM Light !
N'importe quel étage peut s'abonner à un message et recevoir ce message envoyé par un autre étage.

VoirContactView.xaml.cs :
// La vue s'abonne au message afficheMessageRetour
// c'est le view model qui va déclencher l'envoi du message
Messenger.Default.Register<Contact>(this, "afficheMessageRetour", AfficheMessageRetour);

VoirContactViewmodel.cs :
// Le vue modèle déclenche l'envoi du message "afficheMessageRetour"
// pour communiquer avec la vue
Messenger.Default.Send(contact, "afficheMessageRetour");


Voilà ! Vous avez ainsi un nouveau projet ultra simple pour démarrer en douceur avec MVVM Light !

Site de MVVM Light Toolkit : http://www.galasoft.ch/mvvm


Télécharger MVVM Light Toolkit sur CodePlex : http://mvvmlight.codeplex.com



Vous pouvez télécharger le code source du projet (VS2012 / C#) :
WPF_MVVMLightSample.zip


Conseil : Utilisez nuget pour télécharger et référencer rapidement MVVM Light Toolkit dans vos projets :) Voir l'article ici...









MVVM Light Toolkit a été créé par Laurent Bugnion, un MVP Microsoft de renom...
http://www.galasoft.ch

Categories: C#, design pattern, MVVM, WPF