WPF从用户控件MVVM更改视图

Question

I'm trying to navigate from one View Model to another without any side panel.

For example, I have a Main Window View , this is where I load my User Control .

I have tried to access the static instance from the MainViewModel to change the Views, but it's not working.

MainWindow.xaml

<Window.Resources>

    <DataTemplate DataType="{x:Type vm:FirstViewModel}">
        <v:FirstView/>
    </DataTemplate>

    <DataTemplate DataType="{x:Type vm:SecondViewModel}">
        <v:SecondView/>
    </DataTemplate>

</Window.Resources>
<ContentControl Content="{Binding CurrentViewModel}"/>

MainViewModel.cs

class MainviewModel : ObservableObject
{
    private ObservableObject _currentViewModel = new FirstViewModel();
    public ObservableObject CurrentViewModel
    {
        get { return _currentViewModel; }
        set
        {
            _currentViewModel = value;
            RaisePropertyChangedEvent("CurrentViewModel");
        }
    }

    private static MainViewModel _instance = new MainViewModel();
    public static MainViewModel Instance { get { return _instance; } }
}

Here, I have my FirstView , it just contains a button and several other UI designs

FirstView.xaml

<Button Command="{Binding goToSecondView}" />

FirstViewModel.cs

class FirstViewModel : ObservableObject
{
    public ICommand goToSecondView
    {
        get
        {
            return new DelegateCommand(() =>
            {
                MainViewModel.Instance.CurrentViewModel = new SecondViewModel();
            });
        }
    }
}

And I have a SecondView , which is similar to FirstView , just that it navigates to FirstView

I have tried searching for a solution, but so far, I have only managed to find examples that shows buttons on a panel which then allow switching of the User Control from clicking those button.

What I am trying to achieve is to enable switching of User Control via the buttons on the User Control itself, without any side panel.

Any help would be very much appreciated and would definitely aid me in my future projects.

Thank You.

Answer 1

You're creating two different instances of MainViewModel. The first one is probably being created by a locator or something and it's the one that your view is binding to when the window is first created. It's then creating a second instance and assigning it to its own static Instance member:

private static MainViewModel _instance = new MainViewModel();
public static MainViewModel Instance { get { return _instance; } }

It's this instance that your ICommand handler is changing when you press the button, which isn't bound to anything. Generally speaking you should be using a dependency injection framework to ensuring it's a true singleton, but for now just do something like this:

    public MainViewModel()
    {
        Instance = this;
    }

    public static MainViewModel Instance { get; private set; }

Also your code calls RaisePropertyChangedEvent("CurrentViewModel")...I'm pretty sure you meant that to be RaisePropertyChanged("CurrentViewModel").

Answer 2

i would go another way and expose an Event from your first and Second viewmodel like

public event EventHandler<ShowMeEventArgs> ShowMeEvent;

then your main just need to subscribe to this event and can show the viewmodel. and even more your first and second viewmodel dont need to know anything from mainviewmodel