Create multi panel application in WPF

Question

I'm developing WPF MVVM application and I want to create a Window with many panels that changes when user choose another panel from navigation.

I've read this article but it's not working due to Can't put a Page in a Style error. I can't find any answer about how to create a WPF application that navigate through different panels in one single window, how I can achieve what I want using MVVM pattern?

Answer 1

I have created an ContentPresenter and bind it to the MainWindow ViewModel and set the DataTemplate for each ViewModels.

<ContentPresenter  Name="WindowContent" Content="{Binding CurrentPageViewModel}"/>

<Window.Resources>
    <DataTemplate DataType="{x:Type viewModels:MainViewModel}">
        <views:MainView />
    </DataTemplate>
</Window.Resources>

And so when the binded property is changed, ContentPresenter display proper ViewModel and due to DataTemplate, the actual View.

public IPageViewModel CurrentPageViewModel
{
    get
    {
        return _currentPageViewModel;
    }
    set
    {
        if (_currentPageViewModel != value)
        {
            _currentPageViewModel = value;
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("CurrentPageViewModel"));
        }
    }
}
private IPageViewModel _currentPageViewModel;

Every ViewModel implements simple IPageViewModel interface so only ViewModels could be set as content of ContentPresenter.