[MVVM] gestion des UserControls

Bonjour à tous,

Je continue actuellement des différents tests avec le fameux pattern MVVM.
Aujourd'hui, pour bien commencer la semaine, j'ai une question sur la gestion des UserControls UC.

En effet mon application est faite de la sorte :
1 View MainWindowsV bindée sur la ViewModel MainWindowsVM
1 UC uc1V bindé sur uc1VM
1 UC uc2V bindé sur uc2VM

Dans ma MainWindowsV, j'ai un menu qui retourne avec une command le choix dans un menu. J'aimerais réussir à lui faire afficher l'UC 1 ou le 2 en fonction du choix dans le menu..

J'ai donc pensé à faire hériter toutes les ViewModel d'une interface classique et dans la ViewModel de ma page principale, avoir une propriété telle que

Code:

---

1 2 3 4 5

protected IViewModel _MaVue; public readonly IViewModel MaVue() { return _MaVue; }

---

A partir de là, plusieurs questions :
-déjà est ce le bon raisonnement ?
- la VM de base doit donc posséder toutes les instances en cours des autres VM afin de pouvoir garder les données saisies ?
-comment gérer le binding pour afficher le bon UC

Par avance, merci pour ceux qui répondront ! :ccool:

@+

C'est pas tout à fait ca, mais on s'en approche! Voila ce que je te suggère:
Ton interface:

Code:

---

1 2 3 4 5

public interface IViewModel { UserControl View { get; } }

---

Ton MainViewModel

Code:

---

1 2 3 4 5 6 7 8 9 10 11

public class MainViewModel : INotifyPropertyChanged { ...BLABLABLA... private IViewModel _selectedViewModel; public IViewModel SelectedViewModel { get { return _selectedViewModel; } set { _selectedViewModel = value; //Ajouter ici le code pour NotifyPropertyChanged } } ...BLABLABLA ENCORE ... }

---

En fonction de ton choix tu peux affecter a SelectedViewModel l'un ou l'autre des viewmodel. A ce propos, oui tu dois garder une référence vers tes viewmodel sauf si tu utilises un ServiceLocator (Unity, MEF, ou a la main)

L'utilisation dans le XAML:

Code:

---

1 2	<ContentControl Content="{Binding SelectedViewModel}" />

---

+1 pour la réponse de PitMaverick, sauf qu'il en manque un bout ;)

Pour que ça marche, il faut définir un DataTemplate pour chaque type de ViewModel pour l'associer au UserControl correspondant (pour que le ContentControl sache quelle vue utiliser pour un ViewModel donné)

Par contre, oublie ton idée d'avoir une propriété MaVue : le ViewModel ne doit pas avoir connaissance de la vue, c'est un des principes de base de MVVM

Citation:

---

Envoyé par tomlev

+1 pour la réponse de PitMaverick, sauf qu'il en manque un bout ;)

Pour que ça marche, il faut définir un DataTemplate pour chaque type de ViewModel pour l'associer au UserControl correspondant (pour que le ContentControl sache quelle vue utiliser pour un ViewModel donné)

Par contre, oublie ton idée d'avoir une propriété MaVue : le ViewModel ne doit pas avoir connaissance de la vue, c'est un des principes de base de MVVM

---

Ben en fait, j'utilise souvent ce système qui m'a déjà sorti plusieurs fois d'embuches. Après la nuance c'est que le ViewModel n'a pas connaissance de l'implémentation de la vue. Généralement l'implémentation est un truc du genre:

Code:

---

UserControl View { get { return ViewFactory.GetView<IView>(); } }

---

(et dans mon cas ViewFactory.GetView est UnityContainer.Resolve)

Merci pour vos réponses. :ccool:

En fait j'ai utilisé un mix des deux on va dire :lol:

J'ai une propriété dans ma ViewModel principale

Code:

---

1 2 3 4 5 6 7 8 9 10

protected IViewModel _MaVm; public IViewModel MaVm { set { _MaVm = value; PropertySetter("MaVm"); } get { return _MaVmm; } }

---

qui me retourne la ViewModel sélectionnée, enfin celle à afficher...

Pour ce qui concerne les resources

Code:

---

1 2 3 4 5 6 7 8 9 10 11

<Window.Resources> <DataTemplate DataType="{x:Type local2:MaViewModel}"> <local:View1/> </DataTemplate> <DataTemplate DataType="{x:Type local2:MaViewModel2}"> <local:View2/> </DataTemplate>   <local2:MaMainViewModel x:Key="MyVM"/>   </Window.Resources>

---

et pour afficher le bon UserCOntrol,

Code:

---

<ContentControl Content="{Binding MaVm}" BorderThickness="3" Margin="20">

---

Cela vous paraît correct au niveau respect du pattern ?
N'hésitez pas si vous voyez d'éventuelles améliorations (pour l'instant ça fonctionne mais bon ) ;)

Par avance, merci

@+

Re,

Je me permets de revenir sur ce post car j'ai un autre problème : à chaque fois que ma View change, automatiquement une nouvelle instance de la ViewModel est générée et donc je perd les données saisies par exemple.

Comment puis-je faire pour conserver les premières instances ?

Par avance, merci de votre aide

Tout dépend de comment tu fais l'instanciation de ton ViewModel et son binding avec la View.

pour l'instanciation directement dans le ViewModel avec le constructeur et pour le binding sur la View

Code:

---

1 2 3 4 5

<UserControl.Resources> <local:MaViewModel x:Key="MyVM"/> </UserControl.Resources>   <Grid DataContext="{StaticResource MyVM}">

---

Salut,

enlève cette ressource statique, et ne met pas de DataContext dans ta Grid.

Le fait de déclarer un ViewModel statique dans ton UserControl signifie que tu vas créer un ViewModel à chaque fois que tu instancie la vue de ton UserControl. Et c'est précisémment ce qu'il se passe quand ton ViewModel courant change, la MainWindowV instancie un nouveau UserControl adapté à ce ViewModel.

Si je vire la resource et le datacontext, je n'ai plus de binding et donc rien ne s'affiche

Il faut que je déclare le datacontext quelque part non ?

Merci pour ces infos

Il faut que tu regardes du côté des patterns comme le Locator (j'ai pas trop d'exemple simple sous la main mais ca doit pouvoir se trouver)

En théorie, avec :

Code:

---

1 2 3 4 5 6

<DataTemplate DataType="{x:Type local2:MaViewModel}"> <local:View1/> </DataTemplate> et <ContentControl Content="{Binding MaVm}" BorderThickness="3" Margin="20">

---

C'est ta MainWindowV qui fournit le DataContext à ton UserControl.
Quand tu dis qu'il n'affiche plus rien, c'est dans le designer ou à l'exécution ?

Si c'est juste un problème au moment du designer, remplace ta balise Grid par:

Code:

---

<Grid d:DataContext="{d:DesignInstance IsDesignTimeCreatable=True, Type=MyVM}"

---

Celà permet plus ou moins de "déclarer" quel sera le type du DataContext, mais sans créer une nouvelle instance.
Du coup, tu pourras accéder à nouveau à tes propriétés via les outils de Visual Studio.

Merci pour votre aide ! :ccool:
J'ai tout repris mon projet en utilisant MVVM Light Toolkit et ça a résolu mon problème.
Le locator s'occupe du binding et de conserver les instances....

Par contre j'ai une dernière question qui concerne la sauvegarde et la restauration de ViewModel.
Je m'explique, sur la MainView, le client choisit deux affichages possibles, View1 et View2. Il remplit des informations dessus, jusqu'à là pas de soucis majeur. :lol:

J'aimerais rajouté un bouton pour qu'il puisse enregistrer ses données. Mon objectif est de récupérer les propriétés de ViewModel1 et ViewModel2 dans ma MainView.

Quelqu'un aurait-il une idée pour faire un truc propre ?
Je pensais bien à la méthode de passer la référence de mes ViewModel1-2 dans la MainView et ensuite mécanisme classique...
Est ce la bonne approche ?

Merci encore pour vos réponses ! :)

Théoriquement, c'est bien ta MainWindowVM qui contient une référence sur ViewModel1-2 ? donc le lien tu t'as déjà, non ?

Actuellement, toutes mes ViewModels sont indépendantes et n'ont pas de référence de l'une vers l'autre.

Je pensais justement rajouter une propriété dans chacune et faire le lien dans le Locator.

C'est ça le principe ? C'est la méthode la plus en accord avec MVVM ?

Citation:

---

Envoyé par koyot3

Merci pour votre aide ! :ccool:
J'ai tout repris mon projet en utilisant MVVM Light Toolkit et ça a résolu mon problème.
Le locator s'occupe du binding et de conserver les instances....

Par contre j'ai une dernière question qui concerne la sauvegarde et la restauration de ViewModel.
Je m'explique, sur la MainView, le client choisit deux affichages possibles, View1 et View2. Il remplit des informations dessus, jusqu'à là pas de soucis majeur. :lol:

J'aimerais rajouté un bouton pour qu'il puisse enregistrer ses données. Mon objectif est de récupérer les propriétés de ViewModel1 et ViewModel2 dans ma MainView.

Quelqu'un aurait-il une idée pour faire un truc propre ?
Je pensais bien à la méthode de passer la référence de mes ViewModel1-2 dans la MainView et ensuite mécanisme classique...
Est ce la bonne approche ?

Merci encore pour vos réponses ! :)

---

Ca me semble pas déconnant en effet. Sinon y'a une autre méthode qui est de demander via le mediator (Messenger je crois sur MVVM Light Toolkit) l'état des ViewModels et chaque ViewModel répond (ca a l'avantage d'avoir n ViewModels de manière transparente).

Je suis en train de regarder pour les messages mais si j'ai bien compris le principe, il faut d'abord que les ViewModels s'abonnent à un type de message particulier.

Par contre, dans mon cas il faudrait que le ViewModel renvoie sa référence par message au MainViewModel afin que ce dernier puisse récupérer les informations.
A voir si ça fonctionne ...