
Model VIEw viewmodel(MVVM)是在 Silverlight 和 WPF 项目开发中应用最多的结构模式,也是 Silverlight 和 WPF 项目开发的最佳模式。本文的主要目的不是讲解 MVVM 模式。目前已有很多 MVVM 框架可以用来简化 MVVM 开发,如 Prism、SilverlightFX、Mvvmlight、Caliburn、Simple MVVM Toolkit等。
本文将使用 Mvvmlight 框架来演示如何在 MVVM 模式下与子窗体交互,即如何在 viewmodel 中d出一个子窗体。 在 程序开发中经常会遇到诸如d出提示框、确认框、用户输入窗口等的情况,在 Silverlight 中这些情况都可以用子窗体(Child Window)来处理。在未使用 MVVM 模式的情况下,我们可以在用户控件或页面的后置代码(Code Behind)中实例化一个子窗体,调用子窗体的 Show 方法来d出子窗体,然后通过子窗体的 Closed 方法用户的 *** 作结果。但是在使用 MVVM 模式的情况下,为了使 Model 和 VIEw 最大限度的分离,我们要使用尽可能少的后置代码。如果在后置代码中实例化并显示子窗体,这就使用代码和视图结合在一起了;当然也可以在 viewmodel 里实例化并显示子窗体,这样又使子窗体和 viewmodel 结合在一起了。
首先我们来看一下示例程序的运行结果:
程序运行后当用户单击 New Customer 按钮时,就会d出一个子窗体,用户输入Customer ID、Customer name、Customer City 后单击 OK 按钮就会在主页面的客户列表中显示出刚才输入的客户信息。下面是本示例具体的实现。
新 建一个 Silverlight 项目,然后在项目中添加VIEws、Models、viewmodels、Locators文件夹(如果是通过 Mvvmlight 模板创建的 Silverlight 项目,默认 viewmodel Locator 和 viewmodel 在同一文件夹中)。添加对程序集 galaSoft.Mvvmlight.Extras.SL4 和 galaSoft.Mvvmlight.SL4 的引用(如果通过 Mvvlight 模板创建则会自动引用)。在 Model 文件夹中新建一个 Customer Model,完整代码如下:
01 public class Customer : INotifyPropertyChanged02 {03 private string customerID;04 public string CustomerID05 {06 get { return customerID; }07 set08 {09 customerID = value;10 NotifyPropertyChanged("CustomerID");11 }12 }13 14 private string customername;15 public string Customername16 {17 get { return customername; }18 set19 {20 customername = value;21 NotifyPropertyChanged("Customername");22 }23 }24 25 private string city;26 public string City27 {28 get { return city; }29 set30 {31 city = value;32 NotifyPropertyChanged("City");33 }34 }35 36 public event PropertyChangedEventHandler PropertyChanged;37 38 public voID NotifyPropertyChanged(string propertyname)39 {40 if (PropertyChanged != null)41 PropertyChanged(this,new PropertyChangedEventArgs(propertyname));42 }43 } 下面是 MainPage 的后置代码:
01 public partial class MainPage : UserControl02 {03 public MainPage()04 {05 InitializeComponent();06 07 Messenger.Default.Register<string>(08 this,09 "MainWindow",10 msg =>11 {12 NewCustomerVIEw newCustomer = new NewCustomerVIEw();13 newCustomer.Title = msg;14 newCustomer.Show();15 });16 }17 } |
从上面的代码中可以看到,我使用 Mvvmlight 的 Messenger 在主窗体中注册了一个消息接收者,用于接收 viewmodel 发来的消息并d出子窗体。下面是子窗体 NewCustomerVIEw 的后置代码:
01 public partial class NewCustomerVIEw : ChilDWindow02 {03 public NewCustomerVIEw()04 {05 InitializeComponent();06 07 Messenger.Default.Register<Customer>(08 this,09 "ChilDWindow",10 msg =>11 {12 this.DialogResult = true;13 });14 }15 } |
我同样在子窗体中也注册一个消息接收者,接收 viewmodel 发来的消息并关闭子窗体。注意主窗体中注册的消息接收者的 Token 为 “MainWindow”,子窗体中注册的消息接收者的 Token 为 “ChilDWindow”,在 viewmodel 中发送消息时,只有与发送的消息的 Token 相同的接收者才收到消息。下面是 Mainviewmodel 的代码,这里只是为了演示,主窗体和子窗体共用了一个 viewmodel。
01 public class Mainviewmodel : viewmodelBase02 { 03 public Mainviewmodel()04 {05 OKbuttonCommand = new RelayCommand<Customer>(OKbuttonClick);06 NewCustomerCommand = new RelayCommand(NewCustomer);07 08 _customer = new Customer();09 _customers = new ObservableCollection<Customer>();10 // 注册一个接收者 Token 为 ChilDWindow11 Messenger.Default.Register<Customer>(this,"ChilDWindow",AddCustomer);12 }13 14 private voID AddCustomer(Customer param)15 {16 _customers.Add(param);17 RaisePropertyChanged("Customers");18 }19 20 // customer List21 private ObservableCollection<Customer> _customers;22 public ObservableCollection<Customer> Customers23 {24 get25 {26 return _customers;27 }28 }29 30 // customer model31 private Customer _customer;32 public Customer Model33 {34 get35 {36 return _customer;37 }38 set39 {40 _customer = value;41 RaisePropertyChanged("Model");42 }43 }44 45 // add customer command46 public RelayCommand NewCustomerCommand { get; private set; }47 private voID NewCustomer()48 {49 /*50 * 发送一个字符串信息 New Customer51 * Token 为 MainWindow 只有具有相同 Token 接收者都会接收到该信息52 */53 Messenger.Default.Send("New Customer","MainWindow");54 }55 56 public RelayCommand<Customer> OKbuttonCommand { get; private set; }57 private voID OKbuttonClick(Customer param)58 {59 /*60 * 发送一个 Customer 信息61 * Token 为 ChilDWindow 只有具有相同 Token 接收者都会接收到该信息62 */63 Messenger.Default.Send<Customer>(param,"ChilDWindow");64 }65 } |
在 viewmodel 中也注册了一个消息接收者,用于接收子窗体返回的数据。viewmodel 中的 NewCustomerCommand 是绑定到主窗体的 NewCustomer 按钮的,单击按钮 NewCustomer 时调用 NewCustomer() 方法向主窗体发送一个消息, 主窗体接收到消息后d出子窗体。viewmodel 中的 OKbuttonCommand 是绑定到子窗体的 OKbutton 的,单击按钮 OKbutton 时调用 OKbuttonClick() 向子窗体和 viewmodel 发送一个消息,子窗体接收到消息时关闭,viewmodel 接收到消息时将参数 Customer 添加 Customer 列表中。以下是按钮的事件绑定代码:
01 <button Content="New Customer" WIDth="120" Height="30">02 <i:In@R_301_6704@ction.Triggers>03 <i:EventTrigger Eventname="Click">04 <cmd:EventToCommand Command="{Binding NewCustomerCommand}" />05 </i:EventTrigger>06 </i:In@R_301_6704@ction.Triggers>07 </button>08 09 <button x:name="Okbutton" Content="OK" WIDth="75" Height="23" HorizontalAlignment="Right" margin="0,12,0" GrID.Row="1">10 <i:In@R_301_6704@ction.Triggers>11 <i:EventTrigger Eventname="Click">12 <cmd:EventToCommand Command="{Binding OKbuttonCommand}" CommandParameter="{Binding Elementname=Customer,Path=DataContext}" />13 </i:EventTrigger>14 </i:In@R_301_6704@ction.Triggers>15 </button> |
本示例只是提供一个在 MVVM 模式下与子窗体交互的解决方法,这个解决方法也并不是纯粹的 MVVM,完整的示例请查看附件的示例代码。
总结以上是内存溢出为你收集整理的Silverlight MVVM 模式下与子窗体交互全部内容,希望文章能够帮你解决Silverlight MVVM 模式下与子窗体交互所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)