Search code examples
wpfdata-bindingmvvm-lightdynamic-usercontrols

Dynamically Load UserControl using MVVM Light Toolkit


I searched this site and i found 2 Links
how to load wpf usercontrol in MVVM pattern

MVVM-Light: Load UserControl into Window

but still i cant find the answer to my problem and this link

MVVM-Light Locator Pattern and Reusable UserControl

i Didn't Understood.... so here is i am stating my problem which might help others struggling like me ......

I have a MainWindow which has 2 parts one has a TreeView(a UserControl) and the other Displays different user controls(named DisplayPanel).... just like windows Explorer.

The Display Panel on the Right side will display different user controls on Clicking nodes of tree view.

and my TreeView is Itself a user Control.

How can i make this composite UI Work using MVVM. Also I am planning to use MVVM light Toolkit. Does this have something that can help...

An Example will be great

Thanks... :)

Edit

My TreeView in a UserControl I made a dependency property in the UserControl which catches the selected Item fo the tree view so that i can use this dependency property to populate the required view in the "MainView" ContentControl binding....as you advised me in the comments. Everything is till now

Problem is that i want to display data contained in the the selected item and i cannot set the DataContext of the UserControls(which will be displayed in right hand side) to the selected item as then i will not be able to use my view model for the respective usercontrol for commands and other operations

I tried to solve this too.... i used the Mediator (Messenger) in my TreeViewUserControl view model to send a Message to the Usercontrol's(the one that i need to display) view model . Message will be passed whenever the item is selected in the tree view. and message contains the selected node. I forgot to mention i set the datacontext of the UserControl to its view model so that i could display data

But using this approach the problem is that when the I click a type of node for the first time the data is not populated but if the same type of node is clicked again its populated. What’s happening is that UserControls object is availabe when the the tree item is clicked for the first time and Mediator sends the message. So Mediator is not able to pass the message to the userControl view model.....

I totally do not have ne idea to solve this further.... is my way if displaying user control right or I should do something that else....totally confused.....


Solution

  • You could try defining a DataTemplate for each type in the TreeView's ItemsSource and instead of having a specific UserControl on the right side, just bind to the TreeView's SelectedItem. Alternatively, you could use a DataTemplateSelector.

    Edited for OP's Edit
    Did you do this?

    • MainWindow has TreeView whose ItemsSource=Binding MainVM.Items.
    • MainWindow has ContentControl whose Content=Binding TreeView.SelectedItem.
    • Somewhere in project, have ResourceDictionary where each possible type in MainVM.Items has a DataTemplate defined?

    Which ViewModel (MainVM or ItemVM) are you trying to use and why can't you use it?