使用ContentControl在WPF中显示视图不起作用

I am currently working on a small project by myself to learn WPF better, and a question I was asking myself is how would navigation between different views work if I want to follow the MVVM pattern.

我目前正在研究一个小项目,以便更好地学习WPF,而我问自己的一个问题是,如果我想遵循MVVM模式,不同视图之间的导航将如何工作。

I have stumbled upon this question here answering my question, but unfortunately it does not seem to work. Instead of having my view display, it is only the namespace of the associated viewmodel that is displayed. So, for exemple, instead of seeing my LoginView, I am seeing a white screen with "JollyFinance.ViewModels.LoginViewModel" written.

我在这里偶然发现了这个问题来回答我的问题,但不幸的是它似乎没有用。它不是显示我的视图,而是仅显示关联视图模型的命名空间。所以,例如,我没有看到我的LoginView,而是看到一个带有“JollyFinance.ViewModels.LoginViewModel”的白色屏幕。

Here is my MainWindow.xaml code:

这是我的MainWindow.xaml代码:

<Window.Resources>
    <!-- Different pages -->
     <DataTemplate x:Key="LoginView" DataType="vm:LoginViewModel">
        <views:LoginView />
    </DataTemplate>
</Window.Resources>

<Window.DataContext>
    <vm:MainViewModel/>
</Window.DataContext>

<Grid>
    <ContentControl Content="{Binding CurrentViewModel}"/>
</Grid>

Here is my MainViewModel.cs:

这是我的MainViewModel.cs:

public class MainViewModel : BindableObject
{
    private ViewModelNavigationBase _currentViewModel;

    public MainViewModel()
    {
        CurrentViewModel = new LoginViewModel();
    }

    public ViewModelNavigationBase CurrentViewModel
    {
        get { return _currentViewModel; }
        set
        {
            if (_currentViewModel != value)
            {
                _currentViewModel = value;
                RaisePropertyChanged();
            }
        }
    }
}

My LoginViewModel.cs file:

我的LoginViewModel.cs文件:

    public LoginViewModel()
    {
        LoginCommand = new RelayCommand(Login);
        NavigateCommand = new RelayCommand(Login);
    }

    private void Login(object param)
    {
        Popup codePopup = new Popup();
        TextBlock popupText = new TextBlock();
        popupText.Text = "Test";
        popupText.Background = Brushes.LightBlue;
        popupText.Foreground = Brushes.Blue;
        codePopup.Child = popupText;
    }

    public String Username { get; set; }

    public String Password { get; set; }

    public ICommand LoginCommand { get; set; }
}

My LoginView.xaml file is a UserControl comprised of a few Buttons and TextBlocks. BindableObject is just an abstract class that I use that implements the INotifyProperty interface. And ViewModelNavigationBase is the class that all my viewmodels will inherit from; it doesn't contain anything for the moment.

我的LoginView.xaml文件是一个UserControl,包含一些Buttons和TextBlocks。 BindableObject只是我使用的一个抽象类,它实现了INotifyProperty接口。 ViewModelNavigationBase是我所有视图模型将继承的类;它暂时不包含任何内容。

How would I resolve this issue for it to display my view instead of a string representation of the associated viewmodel?

如何解决此问题,以显示我的视图而不是关联的viewmodel的字符串表示形式?

2 个解决方案

#1

I have finally found what the problem was. For some reason, when you declare x:Key on the DataTemplate, it made the ContentControl Content appear as a string. I have removed the x:Key of the DataTemplate and everything works now. I also had to apply nemesv's answer for it to work.

我终于找到了问题所在。出于某种原因,当您在DataTemplate上声明x:Key时,它使ContentControl内容显示为字符串。我删除了DataTemplate的x:Key,现在一切正常。我还必须应用nemesv的答案才能工作。

Before:

<DataTemplate x:Key="LoginView" DataType="vm:LoginViewModel">

After (resolves the problem):

之后(解决问题):

<DataTemplate DataType="{x:Type vm:LoginViewModel}">

#2

WPF does not support implicit DataTemplates with string as the type identifier.

WPF不支持使用字符串作为类型标识符的隐式DataTemplates。

You need to use the x:Type Markup Extension to specify your view model type:

您需要使用x:Type标记扩展来指定视图模型类型:

<DataTemplate DataType="{x:Type vm:LoginViewModel}">
    <views:LoginView />
</DataTemplate>

#1