Tutoriel Silverlight, part 6.1 : Le pattern M-V-VM

Me voici de retour après deux mois d’absence pour continuer cette série de tuto sur le Silverlight. Aujourd’hui je vais essayer d’introduire un pattern qui devient incontournable pour tous les développeurs WPF/Silverlight, j’ai nommé le pattern M-V-VM. Étant donné le poids de tout ce qu’il y a à dire sur MVVM je pense faire ce tutoriel en 2 voir 3 partie oO !

En 1er : Une présentation général de MVVM, son historique, son fonctionnement.

En 2 : Une petite application toute simple afin de mettre en pratique les bases du pattern MVVM

en 3 : Un exemple un peu plus complexe mais cette fois utilisant une librairie/Framework facilitant (grandement) la mise en place du pattern, MVVM Light.

À savoir que ces petits tutoriels seront en grande partie inspirés par les deux énormes (en taille et en qualité) articles de E.naxos dont je vous ai déjà parlé précédemment.

Je vous colle le lien vers les deux articles en question :

Article: M-V-VM avec Silverlight (70 pages)

Appliquer la pattern MVVM avec MVVM Light (90 pages)

Je vais donc essayer de résumer, condenser ces articles afin de proposer quelque chose de plus « Casual ». Bien sur si le sujet vous intéresse je vous recommande vivement de lire ces articles qui sont de vrai mines d’or pour tout développeur !!

Voilà on va pouvoir commencer !!

Les Origines du pattern M-V-VM

Alors tout d’abord, M-V-VM, ça veux dire quoi ? Et bien c’est l’abréviation de Model-View-ViewModel, un peu comme MVC qui est l’abréviation de Model-View-Controller.

Vous allez me dire (sisi), pourquoi je vous parle de MVC, et bien parce que, pour faire simple, MVVM est directement inspiré, ou plutôt est une évolution du pattern MVC. En effet, c’est John Gossman (architecte WPF et Silverlight) qui en octobre 2005 va proposer un pattern proche du MVC, mais se basant lui sur les nouveaux mécanismes propre à WPF/Silverlight, le Fameux DataBinding ! (MVVM est un pattern un peu particulier car il ne peux s’appliquer qu’à cette technologie)

À la base le pattern MVC à été créé de manière à organiser le travail des développeurs, mieux segmenter leurs application afin d’améliorer la maintenabilité, la compréhension et faciliter le développement de grosses applications professionnels (en gros). En pratique, l’utilisation d’un tel pattern revient à diviser son code en 3 partie :

La Vue (View) : correspondant à l’interface utilisateur (IHM).

Le Modèle (Model) : correspondant à la couche d’accès aux données.

Le Contrôleur (Controller) : correspondant à la synchronisation des deux bloc précédent.

MVVM s’inspire de MVC mais c’est quand même pas pareil !

Définition MVVM

MVVM est le premier pattern à faire intervenir les designers/graphistes, ce qu’on veut c’est pouvoir séparer complètement l’IHM du reste du code de manière à ce que le designer puisse travailler de son coté sans avoir à être en relation avec les développeurs.

Modèle : Contiendra la logique métier (Base de données/Fichier XML)

Vue : Ensemble des éléments visuels (en XAML), ne contiendra aucun code behind (sauf gestion des animations). Le DataContext de la vue pointera sur une Instance de ViewModel

ViewModel : Sera là pour adapter les données du modèle pour quelles s’intègrent (par Binding) à la vue. Contiendra aussi les Commandes que la vue peut déclencher pour intéragir avec le modèle. La ViewModel sera Binder sur la Vue.

On voit bien que le MVVM dépend bien de mécanisme propre à WPF/Silverlight pour être mis en place (binding et commmandes). Le binding on connait déjà, mais la notion de commande elle, va permettre de créer, toujours par Binding, des points d’entrées dans le ViewModel afin que les events de la vue ne soient plus gérés par cette dernière mais par le ViewModel.

Les avantages de MVVM

-Tailler pour WPF/Silverlight

-Séparation interface/code fonctionnel (designer/développeur)

-Bloc testable de manière fonctionnel

-Indépendance de l’IHM

Pour cité E.naxos, « C’est aujourd’hui LA façon de développer proprement des applications professionnelles » !!

Voila pour cette courte introduction théorique sur le MVVM, j’essaie de faire au plus simple/court afin de ne pas trop qu’on se perdre dans un trop plein d’informations, le mieux pour apprendre restant la mise en pratique, et ça sera le but de la suite de ce billet !