Question

Consider that I have an application that just handles Messages and Users I want my Window to have a common Menu and an area where the current View is displayed.

I can only work with either Messages or Users so I cannot work simultaniously with both Views. Therefore I have the following Controls

• MessageView.xaml
• UserView.xaml

Just to make it a bit easier, both the Message Model and the User Model looks like this:

• Name
• Description

Now, I have the following three ViewModels:

• MainWindowViewModel
• UsersViewModel
• MessagesViewModel

The UsersViewModel and the MessagesViewModel both just fetch an ObserverableCollection<T> of its regarding Model which is bound in the corresponding View like this:

<DataGrid ItemSource="{Binding ModelCollection}" />

The MainWindowViewModel hooks up two different Commands that have implemented ICommand that looks something like the following:

public class ShowMessagesCommand : ICommand
{
    private ViewModelBase ViewModel { get; set; } 
    public ShowMessagesCommand (ViewModelBase viewModel)
    {
        ViewModel = viewModel;
    }
    public void Execute(object parameter)
    {
        var viewModel = new ProductsViewModel();
        ViewModel.PartialViewModel = new MessageView { DataContext = viewModel };
    }

    public bool CanExecute(object parameter)
    {
        return true;
    }

    public event EventHandler CanExecuteChanged;
}

And there is another one a like it that will show Users. Now this introduced ViewModelBase which only holds the following:

    public UIElement PartialViewModel
    {
        get { return (UIElement)GetValue(PartialViewModelProperty); }
        set { SetValue(PartialViewModelProperty, value); }
    }

    public static readonly DependencyProperty PartialViewModelProperty =
        DependencyProperty.Register("PartialViewModel", typeof(UIElement), typeof(ViewModelBase), new UIPropertyMetadata(null));

This dependency property is used in the MainWindow.xaml to display the User Control dynamicly like this:

<UserControl Content="{Binding PartialViewModel}" />

There are also two buttons on this Window that fires the Commands:

• ShowMessagesCommand
• ShowUsersCommand

And when these are fired, the UserControl changes because PartialViewModel is a dependency property.

I want to know if this is bad practice? Should I not inject the User Control like this? Is there another “better” alternative that corresponds better with the design pattern? Or is this a nice way of including partial views?

Answer 1

why not use a ContentPresenter/ContentControl with a datatemplate in your mainwindow?

instead of UserControl Content=”{Binding PartialViewModel}” />, you can use a:

 <ContentPresenter Content="{Binding Path=PartialViewModel}" />

all you have to do: is set your PartialViewmodel to your child viewmodel and create a datatemplate, so wpf will know how to render your childviewmodel

<DataTemplate DataType={x:Type UserViewModel}>
    <UserView/>
</DataTemplate> 

<DataTemplate DataType={x:Type MessageViewModel}>
    <MessageView/>
</DataTemplate> 

when ever you set your PartialViewmodel in your MainViewmodel, the right View will render in your ContenControl.

Edit 1
at least you have to implement INotifyPropertyChanged in your ViewModel and fire it when ever the PartViewModel property is set.

Edit 2
if you use Commands in your viewmodels take a look at some mvvm framework implementations like DelegateCommand or RelayCommand. handling ICommand become much easier with this. within your mainviewmodel you can create commands simple like that

private DelegateCommand _showMessageCommand;
public ICommand ShowMessageCommand
{
    get
    {
         return this._showMessageCommand ?? (this._showMessageCommand = new DelegateCommand(this.ShowMessageExecute, this.CanShowMessageExecute));
        }
    }