How to use view-model first approach with the region feature?

Topics: Prism v4 - WPF 4
Aug 3, 2011 at 3:05 PM



I had my hands on Prism for some weeks now and using the region feature is just great! I really like this "push" approach for composing application. But there is something I am still not getting. How can I use a view-model first approach along with regions?

In my situation, I really need to create my view-models first and I really do not see how I could do it differently. So for now I always been using data templates, but still, Prism does not give the possibility of adding a view-model to a region. I have been reading the Prism book cover to cover and I still do not understand how could benefit of region feautre with view-model first.

So am I missing something in the Prism patterns or is their a guideline to achieve that?



Aug 3, 2011 at 3:55 PM


It is possible to add a view to a region using the View-Model first approach, defining the view as the data template.

You might find this thread useful, as it deals with the subject of navigating to views defined as data templates of their corresponding view model:

Region navigation to ViewModel

I hope you find this helpful.

Guido Leandro Maliandi

Aug 10, 2011 at 10:13 AM

Thanks for your reply. I have been reading the chapter again but it does not resolve my problem. I think I did not described it enough.

So my problem is that I have a list of different existing view model instances and when one of them is selected I want to display its details in my content region. The problem is that it could be any type of view model. So what I would like to do is to be able to publish my view model into the region so it can retrieve the DataTemplate automatically and display it correctly. View-model first navigation does not actually permit to navigate to an existing instance of a view model because it will use the view-model default constructor.

Again I feel like I am missing a crucial detail.

Aug 10, 2011 at 1:38 PM

Have you tried adding the specific instance of your view model to your region via the Region.Add method (view injection approach)?

You can read more about it in the UI Composition chapter of the Prism MSDN documentation.

I hope you find this helpful.

Guido Leandro Maliandi

Aug 11, 2011 at 3:21 PM

So I tried to use the method you mentioned and it worked. Thanks.

But as you say it is a view injection approach. Even the parameter in documentation says "Region.Add(object view)". Also when I use it on a TabControl, we can see that the TabControl region adapter is not at ease with this behavior because it displays my view in the Header and in the Content of the TabItem.

Should I deduce that view-model injection is a bad practice or that Prism does not support it? I feel kind of alone on this issue, this is why I wonder.

Aug 11, 2011 at 8:27 PM
Edited Aug 11, 2011 at 8:43 PM

Hi Ucodia,

Based on my understanding of the Prism guidance, this isn't a "wrong" practice to follow when developing an application usign Prism. The parameter in the Region.Add method is named "view" as a common example (i.e. because adding a view is the most common approach, but not the only possible one).

Additionally, the documentation shows how to associate a data template with a view model type in the Implementing the MVVM Pattern chapter.

Regarding your problem with the TabControl header, you can find the following links useful, where similar issues are addressed:

I hope you find this useful.

Agustin Rodriguez Adami

Aug 12, 2011 at 10:19 AM



Thank you for your advices. It is really helpful.

Also I like to understand how things works under the cover so I had a look to the 3 different region adapters. So now with your advices and my analysis of Prism source code I am confident going this way.

Still, I noticed that adding a view or a view model to a Selector region like the TabControl behaved differently. I attached 2 screenshots so you can have a look. The first one is when I add a view to the region, everything is normal. In the second one I add a view-model and as you can see, the view-model is being added to the Content and to the Header of the TabItem.


As I like to understand why it behaves this way, does anybody can explain me why it behaves differently? Is that a bug?




Aug 12, 2011 at 2:33 PM


It would be helpful if you could provide us with a repro sample application that portrays that problem, so we can help you find the cause and a possible workaround for your issue with the tab control.


Guido Leandro Maliandi

Aug 14, 2011 at 12:35 PM

Actually, the workaround is simple. I just have to replace the ItemContainerStyle of TabItems in TabControl.


But still, I believe there is a real difference between injecting a view or view-model because of the behavior I described. I attach you a solution to reproduce this behavior.


Thanks for your help.


Aug 15, 2011 at 11:17 PM


We've downloaded your sample and we are analyzing the issue you're mentioning. We'll provide an answer to you soon.


Guido Leandro Maliandi

Aug 16, 2011 at 5:54 PM

Hi Lionel,

As far as I know, this is not a bug of the Prism library, but a normal behavior of the WPF framework.

The TabControl has two DataTemplates, one for the header and other for the content. The problems seems to be that the TabControl doesn’t know to which of the two the template must be assigned to, so its assigned to both.

You can check this by adding the following line inside a TabControl:

<TabControl >

Like this, the view is created and added to the TabControl through the data template without using Prism at all, however the issue still happens.

As a workaround for this, you can explicitly declare the DataTemplate for the header in the TabControl like this:

<TabControl cal:RegionManager.RegionName="MainContent">
              <Label Content="Test" Padding="0" Margin="0"/>

In this case, the TabControl already has a DataTemplate for the header so the DataTemplate that instantiates the view is only assigned to the content.

Note that in the example above, the Label used in the header has a fixed string as content, however you can bind the content to a property to change the header accordingly to the view/view model.

I hope you find this useful,


Damian Cherubini

Aug 19, 2011 at 12:19 PM

Thank you Damian.

Your reply really lightened up why the TabControl behaved this way.


I am now ok with view-model first navigation mechanisms.