Silverlight View Model 通信

defwebserver

4.89/5 (13投票s)

2010年7月4日

MIT

2分钟阅读

78424

978

主 ViewModel 和子 ViewModel 之间 Silverlight ViewModel 通信的示例。

下载源代码 - 86.54 KB

在线示例: [点击这里]

另请参阅

简单的视图模型通信

使用 "视图模型风格" 编程，在 视图模型 之间如何通信可能会让人感到困惑。有多种可用方法，但本文探讨了一种我希望是简单易懂的方法。

View Model 风格

视图模型风格 允许程序员创建一个完全没有 UI（用户界面）的应用程序。程序员只创建 视图模型 和模型。然后，完全没有编程能力的设计师就可以从一个空白页面开始，完全使用 Microsoft Expression Blend 4（或更高版本）创建视图 (UI)。如果您是 视图模型风格 的新手，建议您阅读 Silverlight 视图模型风格：一个（过度）简化的解释以进行介绍。

子应用程序

首先，我们将创建一个 Silverlight 应用程序，它将是 子应用程序。我们使用以下代码作为 视图模型

public class ChildVMModel : INotifyPropertyChanged
{
    public ChildVMModel()
    {
        AddNewNameCommand = new DelegateCommand(AddNewName, CanAddNewName);
        DeleteNameCommand = new DelegateCommand(DeleteName, CanDeleteName);
    }
    
    #region AddNewNameCommand
    public ICommand AddNewNameCommand { get; set; }
    public void AddNewName(object param)
    {
        // Get the name
        string strName = (String)param;
        // Add the name to the collection
        colNames.Add(strName);
        
        // Update Number of Names
        NumberOfNames = colNames.Count;
    }
    
    private bool CanAddNewName(object param)
    {
        return true;
    }
    #endregion
    
    #region DeleteNameCommand
    public ICommand DeleteNameCommand { get; set; }
    public void DeleteName(object param)
    {
        // Get the name
        string strName = (String)param;
        // Remove the name
        colNames.Remove(strName);
        
        // Update Number of Names
        NumberOfNames = colNames.Count;
    }
    
    private bool CanDeleteName(object param)
    {
        return true;
    }
    #endregion
    
    // Properties
    
    #region NumberOfNames
    private int _NumberOfNames = 0;
    public int NumberOfNames
    {
        get { return _NumberOfNames; }
        private set
        {
            if (NumberOfNames == value)
            {
                return;
            }
            _NumberOfNames = value;
            this.NotifyPropertyChanged("NumberOfNames");
        }
    }
    #endregion
    
    // Collections
    
    #region colNames
    private ObservableCollection<String> _colNames
        = new ObservableCollection<String>();
    public ObservableCollection<String> colNames
    {
        get { return _colNames; }
        private set
        {
            if (colNames == value)
            {
                return;
            }
            _colNames = value;
            this.NotifyPropertyChanged("colNames");
        }
    }
    #endregion
    
    #region INotifyPropertyChanged
    public event PropertyChangedEventHandler PropertyChanged;
    
    private void NotifyPropertyChanged(String info)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(info));
        }
    }
    #endregion
}

然后，我们创建一个视图并将属性、集合和 ICommand 绑定到 视图模型。

然后，我们创建一个 MainPage 视图（它有自己的 视图模型），并且在 Assets > Project 中，我们抓取视图并将其放到页面上。

我们可以添加和删除列表中的项目。还会显示项目计数。

主视图

如果我们想从 MainPage 视图 与 子视图 通信，我们可以使用以下方法。

首先，我们将此代码添加到 MainPage 视图模型

private ChildVMModel _objChildVMModel = new ChildVMModel();
public ChildVMModel objChildVMModel
{
    get { return _objChildVMModel; }
    private set
    {
        if (objChildVMModel == value)
        {
            return;
        }
        _objChildVMModel = value;
        this.NotifyPropertyChanged("objChildVMModel");
    }
}

这提供了一个可以绑定 子视图 的属性。