如何使用 Silverlight 和 MVVM 设计复合视图和视图模型? [英] How do i design a composite view and view model using Silverlight and MVVM?

问题描述

我想在我的 Silverlight MVVM 应用程序中创建一个向导".向导应包含多个步骤，您可以使用下一步"和上一步"在这些步骤之间导航.我面临的问题是视图和视图模型之间的关系.我希望向导本身有一个视图和视图模型.我的直觉告诉我，向导中的每一步都应该有一个视图/视图模型对.

I want to create a "Wizard" in my Silverlight MVVM application. The Wizard should contain multiple steps between which you can navigate using "next" and "previous". The problem I am facing is the relationship between views and view models. I want there to be a view and view model for the Wizard itself. My instinct tells me that there should be one view/view model pair for each step in the wizard.

维护这些关系的好方法是什么，其中一个视图模型包含多个其他视图模型，而视图实际上由几个较小的视图组成?我可以使用任何模式或做法吗?

What is a good approach for maintaining these kinds of relationships, where one view model holds several other view models and the view actually consists of several smaller views? Are there any patterns or practices that I can use?

我知道这个问题可能是主观的，但请给我粗略的方法，我会给你一个答案！

I know this question might be subjective, but give me the rough cuts of an approach and I'll award you an answer!

推荐答案

我建议主向导 viewModel 有一组 steps 视图模型并处理它们之间的导航.在导航时应该调用 step viewModels 中的验证方法:

I'd propose main wizard viewModel which has a collection of steps view models and handles navigation between them. While navigating it should call validation methods in step viewModels:

WizardVM:

public class WizardVM
{
     // this commands should support CanExecute
     public ICommand GotoNextCommand { get; private set; } // should open next step VM
     public ICommand GotoBackCommand { get; private set; } // should open previous step VM

     // this prop should be set by 'GotoNext', 'GotoBack' commands
     public object CurrentStep { get; private set; }

     // probably internally you will have a list of all steps:
     private ICollection<object> _stepViewModels = ...;
}

向导视图:

<StackPanel>
    <ContentPresenter Content="{Binding CurrentStep}">
    <StackPanel Orientation="Horizontal">
        <Button Command="{Binding GotoBackCommand}">Back</Button>
        <Button Command="{Binding GotoNextCommand}">Next</Button>
    </StackPanel>
</StackPanel>

更新:

Views 可以通过 Datatemplating 与 ViewModels 耦合.例如将其添加到 App.Xaml 中的资源中:

Views can be coupled with ViewModels via Datatemplating. For example add this into resources in App.Xaml:

<DataTemplate DataType="{x:Type local:Step1ViewModel}">
     <Step1View />
</DateTemplate>
<DataTemplate DataType="{x:Type local:Step2ViewModel}">
     <Step2View />
</DateTemplate>

您的视图模型应该对视图一无所知.这意味着 WizardVM 应该仅公开其他 viewModel 而不是视图.这是 MVVM 的经验法则.

Your viewModels should know absolutely nothing about views. It means that WizardVM should expose only other viewModels but not views. It's a rule of thumb for MVVM.

UPDATE2 糟糕，我忘了 Silverlight 还没有 DataTemplating.在 Silverlight 中，我仍然会公开 ViewModel，但使用转换器将它们绑定到 ContentPresenters，该转换器会将 viewModel 转换为相应的视图.

UPDATE2 Oops, I forgot that Silverlight doesn't have DataTemplating yet. In silverlight I would still expose ViewModels but bind them to ContentPresenters using a converter which will convert a viewModel into corresponding view.

这篇关于如何使用 Silverlight 和 MVVM 设计复合视图和视图模型?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！