使用MVVM silverlight方法单击按钮打开多个视图

时间:2010-06-23 09:36:42

标签: silverlight mvvm

我想使用MVVM方法实现如下所示:

我有一个MainWindow,我有3个按钮,如:a)客户b)订单c)销售

点击按钮,它应该打开相应的窗口/ usercontrol xaml,其中包含客户详细信息,订单详细信息,销售详细信息。

我已经尝试了所有的东西,但是能够做到这一点。

如何使用MVVM模式实现此目的。请提供解决方案?

由于

3 个答案:

答案 0 :(得分:2)

答案取决于您希望如何显示客户,订单和销售视图。如果希望它们显示在同一视图中,只需添加绑定到主ViewModel中属性的内容控件。

例如,如果您使用的是MVVM Light Toolkit,那么您的MainPage.xaml可能会像......

<UserControl x:Class="MvvmLight2.MainPage"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             Height="300"
             Width="300"
             DataContext="{Binding Main, Source={StaticResource Locator}}">

    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="Skins/MainSkin.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>

    <StackPanel Orientation="Vertical">

        <StackPanel Orientation="Horizontal">
            <Button Content="Customers" Command="{Binding DisplayView}" CommandParameter="Customers" Margin="10" />
            <Button Content="Orders" Command="{Binding DisplayView}" CommandParameter="Orders" Margin="10" />
            <Button Content="Sales" Command="{Binding DisplayView}" CommandParameter="Sales" Margin="10" />
        </StackPanel>

        <ContentControl Content="{Binding CurrentView}" IsTabStop="False" Margin="10" />

    </StackPanel>
</UserControl>

您的MainPageViewModel将是......

using System.Windows.Controls;
using GalaSoft.MvvmLight;
using GalaSoft.MvvmLight.Command;

namespace MvvmLight2.ViewModel
{
    public class MainViewModel : ViewModelBase
    {
        public MainViewModel()
        {
            DisplayView = new RelayCommand<string>(DisplayViewCommandExecute);
        }

        #region Commands

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

        #endregion

        #region CurrentView Property

        public const string CurrentViewPropertyName = "CurrentView";

        private UserControl _currentView;

        public UserControl CurrentView
        {
            get { return _currentView; }
            set
            {
                if (_currentView == value)
                    return;

                _currentView = value;
                RaisePropertyChanged(CurrentViewPropertyName);
            }
        }

        #endregion

        private void DisplayViewCommandExecute(string viewName)
        {
            switch (viewName)
            {
                case "Customers":
                    CurrentView = new CustomersView();
                    break;
                case "Orders":
                    CurrentView = new OrdersView();
                    break;
                case "Sales":
                    CurrentView = new SalesView();
                    break;
            }
        }
    }
}

这一切都假定您已为客户,订单和销售创建了视图和视图模型,并修改了ViewModelLocator以包含它们。

此时,如果需要在子视图中显示特定信息,可以在其中创建依赖项属性,并在显示视图之前从MainViewModel中设置该属性。

答案 1 :(得分:0)

您可能需要查看mediator pattern。常见的实现是MVVM Light Toolkit中的Messenger class和PRISM中的Event Aggregation

使用此模式的一个基本工作流程...在viewmodel1上调用命令。 Viewmodel1向中介注册一些消息。 Viewmodel2订阅该消息并做出响应(例如创建新的view2或更改view2的可视状态)。

答案 2 :(得分:0)

我使用Sliverlight Naviagtion Application和MVVM

尝试了这个

http://garfoot.com/blog/2010/09/silverlight-navigation-with-the-mvvm-pattern/

非常简单的例子。没有这样的框架。

但是使用MVVM框架可以让生活更轻松,以备将来使用。

对于MVVM和Prism框架,请检查此链接..

http://blog.roboblob.com/2010/10/24/introducing-prism-navigation-framework-for-silverlight-mvvm-applications/