c# - MVVM: View 导航无法正常工作

Question

我使用 Brian Noyes 的 Pluralsight 类(class)“深入了解 WPF MVVM”作为我的主要来源，他展示的内容效果非常好。

但是，我不想根据在 UtilitiesView 上单击的按钮切换 View ，而是希望根据工具栏按钮(构成 VS 2015 扩展包的一部分)切换 View ，用户可以在其中选择特定实例。

UtilitiesView 是由包扩展打开的窗口上的用户控件。所以这是 UtilitiesView 中的 xaml:`

<UserControl.Resources>
    <DataTemplate DataType="{x:Type engines:CalcEngineViewModel}">
        <engines:CalcEngineView/>
    </DataTemplate>
    <DataTemplate DataType="{x:Type engines:TAEngineViewModel}">
        <engines:TAEngineView/>
    </DataTemplate>
</UserControl.Resources>

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="auto" />
        <RowDefinition Height="*" />                         
    </Grid.RowDefinitions>
    <Grid x:Name="NavContent">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width ="*"/>
            <ColumnDefinition Width ="*"/>
            <ColumnDefinition Width ="*"/>
        </Grid.ColumnDefinitions>
        <Button Content="Calc"
                Command ="{Binding ChangeViewModelCommand}"
                CommandParameter="CalculationEngine"
                Grid.Column="0"/>
        <Button Content="TA"
                Command ="{Binding ChangeViewModelCommand}"
                CommandParameter="TAEngine"
                Grid.Column="1"/>

    </Grid>
    <Grid x:Name="MainContent"
        Grid.Row="1">
        <ContentControl Content="{Binding CurrentEngineViewModel}"/>
    </Grid>

</Grid>
</UserControl>`

可以看出，有两个按钮通过绑定(bind)到 ChangeViewModelCommand 并传递一个字符串值(“CalculationEngine”或“TAEngine”)来切换 View 。

这是 UtilitiesViewModel.cs 类:

 public class UtilitiesViewModel : BindableBase
{
    #region Fields

    public RelayCommand<string> ChangeViewModelCommand { get; private set; }

    private CalcEngineViewModel calcViewModel = new CalcEngineViewModel();
    private TAEngineViewModel taViewModel = new TAEngineViewModel(); 

    private BindableBase currentEngineViewModel;

    public BindableBase CurrentEngineViewModel
    {
        get { return currentEngineViewModel; }
        set
        {
            SetProperty(ref currentEngineViewModel, value);
        }
    }


    #endregion

    public UtilitiesViewModel()
    {          
        ChangeViewModelCommand = new RelayCommand<string>(ChangeViewModel);      
    }



    #region Methods

    public void ChangeViewModel(string viewToShow) //(IEngineViewModel viewModel)
    {
        switch (viewToShow)
        {
            case "CalculationEngine":
                CurrentEngineViewModel = calcViewModel;
                break;
            case "TAEngine":
                CurrentEngineViewModel = taViewModel;
                break;
            default: 
                CurrentEngineViewModel = calcViewModel;
                break;
        }            
    }

    #endregion
}

这是 BindableBase.cs:

public class BindableBase : INotifyPropertyChanged
{
    protected virtual void SetProperty<T>(ref T member, T val, [CallerMemberName] string propertyName = null)
    {
        if (object.Equals(member, val)) return;

        member = val;
        PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
    }

    public event PropertyChangedEventHandler PropertyChanged = delegate { };
    protected virtual void OnPropertyChanged(string propertyName)
    {         
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));     
    }
}

我使用一个简单的 ViewModelLocator 类将 View 与其 ViewModel 链接起来:

 public static class ViewModelLocator
{
    public static bool GetAutoWireViewModel(DependencyObject obj)
    {
        return (bool)obj.GetValue(AutoWireViewModelProperty);
    }

    public static void SetAutoWireViewModel(DependencyObject obj, bool value)
    {
        obj.SetValue(AutoWireViewModelProperty, value);
    }

    // Using a DependencyProperty as the backing store for AutoWireViewModel.  This enables animation, styling, binding, etc...
    public static readonly DependencyProperty AutoWireViewModelProperty =
        DependencyProperty.RegisterAttached("AutoWireViewModel", typeof(bool), typeof(ViewModelLocator), new PropertyMetadata(false, AutoWireViewModelChanged));

    private static void AutoWireViewModelChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        if (DesignerProperties.GetIsInDesignMode(d)) return;
        var viewType = d.GetType();
        var viewTypeName = viewType.FullName;
        var viewModelTypeName = viewTypeName + "Model";
        var viewModelType = Type.GetType(viewModelTypeName);
        var viewModel = Activator.CreateInstance(viewModelType);
        ((FrameworkElement)d).DataContext = viewModel;
    }
}

如前所述，使用 UtilitiesView.xaml 上定义的按钮切换 View 效果很好。

工具栏按钮从 Package.cs 类调用 UtilitiesViewModel.cs 中的上述 ChangeViewModel 方法，但是即使 CurrentEngineViewModel 属性设置不同，它也不会反射(reflect)在 UtilitiesView.xaml 上。

当我调试时，在这两种情况下，它都正确地转到 BindableBase 的 SetProperty，但是在 ToolBar 按钮的情况下，永远不会调用 ViewModelLocator 中的 AutoWireViewModelChanged 方法。

我不知道为什么。我本以为在 UtilitiesView 中绑定(bind) UtilitiesViewModel 的属性 CurrentEngineViewModel 就足够了吗？我试着把它想象成我在模型组件中做了一个更改，并且 View 应该对此做出响应，即使我实际上将工具栏按钮作为人们认为的 View 组件的一部分。

这是在 Package.cs 类中调用 ChangeViewModel 方法的方式:

if (Config.Engine.AssemblyPath.Contains("Engines.TimeAndAttendance.dll"))
                {
                    uvm.ChangeViewModel("TAEngine");
                }
                else //Assume Calculation Engine
                {
                    uvm.ChangeViewModel("CalculationEngine"); 
                }

我希望我已经提供了足够的细节。

更新 1

关于 gRex 的评论，我认为可能有两个 UtilitiesViewModel 对象。

这是打开包扩展的自定义窗口时发生的情况:

public class SymCalculationUtilitiesWindow : ToolWindowPane
{
    /// <summary>
    /// Initializes a new instance of the <see cref="SymCalculationUtilitiesWindow"/> class.
    /// </summary>
    public SymCalculationUtilitiesWindow() : base(null)
    {
        this.Caption = "Sym Calculation Utilities";

        this.ToolBar = new CommandID(new Guid(Guids.guidConnectCommandPackageCmdSet), Guids.SymToolbar);
        // This is the user control hosted by the tool window; Note that, even if this class implements IDisposable,
        // we are not calling Dispose on this object. This is because ToolWindowPane calls Dispose on
        // the object returned by the Content property.
        this.Content = new UtilitiesView();

    }

}

调用 AutoWireViewModelChanged 方法将 UtilitiesViewModel 链接到内容的 UtilitiesView。

在 Package.cs 类中，我有这个字段:

 private UtilitiesViewModel uvm;

在 Initialize 方法中我有:

 uvm = new UtilitiesViewModel();

uvm 对象在原始帖子的代码片段中使用(就在 UPDATE 上方)以使用适当的字符串参数调用 ChangeViewModel 方法。

这会给我两个不同的对象，不是吗？如果是这样，并且假设这可能是问题的根本原因，我该如何改进它，我必须将 UtilitiesViewModel 设为单例吗？

更新 2

我已经在 Github 上添加了一个解决方案。功能略有更改，因此我不需要与原始解决方案的其余部分进行任何交互。因此，“连接”按钮(在工具栏上)使用“TAEngine”参数调用 ChangeViewModel 方法，“保存”按钮(在工具栏上)执行相同的操作，但使用“CalculationEngine”作为参数。目前，DataTemplates 仍被注释掉，因此只能看到文本中的类名。这是 link .在 Visual Studio 的实验实例中，可以在 View -> 其他窗口 -> SymplexityCalculationUtilitiesWindow 中找到该窗口。如果您还没有 Visual Studio SDK，则可能需要下载它。

更新 3

我将 Unity IoC 容器与 ContainerControlledLifetimeManager 结合使用，以确保我没有两个不同的 UtilitiesViewModel。实现后，工具栏按钮可以导航到正确的 View 。

Answer 1

如果没有Binding Error，检查view的DataContext是否设置了uvm Object。

您可以使用 snoop 查看 DataContext 选项卡中的更改

1. 首先将十字准线拖放到窗口。
2. 按 Strg+Shift 和鼠标悬停选择一个控件
3. 切换到 datacontext-Tab 并查看 CurrentEngineViewModel 是否更改。

[更新]根据您的评论，我假设，ToolBar-Buttons 使用的 uvm 对象不是那个，它被设置为您的 View 的 DataContext。因此更改无法生效。

请检查代码，您从哪里获得了 uvm 对象和 DataContext 的初始化。

[更新2]你必须解决“你有两个对象”的问题。使 ViewModel 成为一个singelton 服务。我更愿意引入某种bootstrapping 和/或singelton 服务 来访问 View 模型。

然后代替

uvm = new UtilitiesViewModel();

你可以这样设置:

uvm = yourService.GetUtilitiesViewModel();

与工厂或缓存。如果您使用相同的对象，您的数据模板将立即工作。

[++]MVVM 在开始时有一个艰难的学习曲线，因为你可以用很多不同的方式来做到这一点。但请相信我，这样做的好处是值得付出努力的。这里有一些链接

• recommendations-best-practices
• viewmodel-locator-for-mvvm

但我不确定这是否适合 Brian Noyes 的 Pluralsight 类(class)、您的 viewm-model 定位器和您的特定 Bootstrap 。

如需其他帮助，根据您在本文中提供的信息，我想到了以下内容。在您的服务中注册您的 ViewModel 的缺失链接可以在由您的 View 的加载事件触发的命令中完成:

在您看来，您可以调用一个命令来注册您的 ViewModel:

<Window ... >
<i:Interaction.Triggers>
    <i:EventTrigger EventName="Loaded">
        <core:EventToCommand Command="{Binding RegisterViewModelCommand}" PassEventArgsToCommand="False"/>
    </i:EventTrigger>
</i:Interaction.Triggers>
<Grid>

引用System.Windows.Interactivity.dll来自表达式混合和来自 EventToCommand 的一些实现，如 MvvmLight .

然后在你的 Command-Handler 中调用yourService.RegisterUtilitiesViewModel(this)

不太确定这是否是最佳方法，但至少，它是一种方法。我更愿意使用 Prism 和依赖注入(inject)进行一些引导，但这是另一回事了。