Silverlight中使用MVVM(1)--基础

Silverlight中使用MVVM(2)—提高

Silverlight中使用MVVM(3)—进阶

Silverlight中使用MVVM(4)—演练

这篇主要引申出Command结合MVVM模式在应用程序中的使用

我们要做出的效果是这样的

就是提供了一个简单的查询功能将结果绑定到DataGrid中,在前面的基础上,这个部分相对比较容易实现了

我们在PageViewModel中添加两个属性

         private string _searchText;
        //查询关键字
        public string SearchText
        {
            get { return _searchText; }
            set { _searchText = value;
            if (PropertyChanged != null)
            {
                this.PropertyChanged(this, new PropertyChangedEventArgs("SearchText"));
            }
            }
        }
        private List<Person> _resultText;
        //查询结果
        public List<Person> ResultText
        {
            get { return _resultText; }
            set { _resultText = value;
            if (PropertyChanged != null)
            {
                this.PropertyChanged(this, new PropertyChangedEventArgs("ResultText"));
            }
            }
        }

这两个属性我们后面将绑定到View中,下面实现查询方法

        //查询方法
        public void Searhing()
        {
            List<Person> person = null;
            if (!string.IsNullOrEmpty(SearchText))
            {
                person = new List<Person>();
                foreach (Person p in Human)
                {
                    if (p.name.Contains(SearchText))
                    {
                        person.Add(p);
                    }
                }
            }
            if (person != null)
            {
                ResultText = person;
            }
        }

我们这里就是通过查询到的集合person赋值给查询结果,这两步比较好理解,然后我们需要在ViewModel中声明一个Command对象来执行页面的单击事件

        private ICommand _cmd;
        //声明Command
        public ICommand Cmd
        {
            get { return _cmd; }
        }
        public PageViewModel()
        {
            Human = new List<Person>();
            Human = new Persons().getPerson();
            _cmd = new QueryCommand(this);
        }

在构造函数中实例了Command对象,在这里我们仍然有一步工作需要完成,就是对QueryCommand的实现

         public class QueryCommand:ICommand
       {
        public PageViewModel _pageVM = null;
        public QueryCommand(PageViewModel vm)
        {
            _pageVM = vm;
        }
        public bool CanExecute(object parameter)
        {
            return true;
        }

        public event EventHandler CanExecuteChanged
        {
            add { }
            remove { }
        }

        public void Execute(object parameter)
        {
            _pageVM.Searhing();
        }
      }

你可以看出来Command类是用ViewModel来实例的,自然这里面由Execute()完成查询这个工作。

最后我们将UI上做点小小的变动

        <data:DataGrid ItemsSource="{Binding ResultText}" Height="200" HorizontalAlignment="Left" Margin="12,88,0,0" Name="dataGrid1" VerticalAlignment="Top" Width="200" />
        <TextBox Height="23" Text="{Binding SearchText,Mode=TwoWay}" HorizontalAlignment="Left" Margin="12,46,0,0" Name="textBox1" VerticalAlignment="Top" Width="120" />
        <Button Content="查询" Height="23" HorizontalAlignment="Left" Margin="137,46,0,0" Name="btnSearch" VerticalAlignment="Top" Width="75" />

我们将DataGrid的ItemSource属性绑定到ResultText上,对于输入框我们则将其绑定到SearchText属性上,这样我们就完成了大部分的工作

下面就是将View和ViewModel两者之间如何关联了,因为Sl3中不支持Commnad这个属性,所以这里我们就在后台进行声明

        PageViewModel pageviewmodel=new PageViewModel();
        public PageView()
        {
            InitializeComponent();
            this.btnSearch.Click += new RoutedEventHandler(btnSearch_Click);
            this.DataContext =pageviewmodel;
        }
        void btnSearch_Click(object sender, RoutedEventArgs e)
        {
            pageviewmodel.SearchText = this.textBox1.Text.Trim();
            pageviewmodel.Cmd.Execute(null);
        }

这一步完成后,我们就实现了开头的功能,这个功能虽然实现了,但是你可能会发现一个问题,我们将Searching()的执行写在了QueryCommand.Execute()中,

在这种情况下我们需要为每一个方法声明一个Command类,自然这不是我们期望做的事情,所以我们下面将这个问题优化一下:

我们先声明一个RelayCommand类

       public class RelayCommand : ICommand
      {
        private Action _handler;
        public RelayCommand(Action handler)
        {
            _handler = handler;
        }

        private bool _isEnabled;
        public bool IsEnabled
        {
            get { return _isEnabled; }
            set
            {
                if (value != _isEnabled)
                {
                    _isEnabled = value;
                    if (CanExecuteChanged != null)
                    {
                        CanExecuteChanged(this, EventArgs.Empty);
                    }
                }
            }
        }
        public bool CanExecute(object parameter)
        {
            return IsEnabled;
        }

        public event EventHandler CanExecuteChanged;

        public void Execute(object parameter)
        {
            _handler();
        }

这里RelayCommand类可以作为一个派生类用于与页面Command的实现,那么ViewModel中,我们声明一个ICommand属性

        private readonly ICommand _searchCommand;
        public ICommand SearchCommand
        {
            get { return _searchCommand; }
        } 

自然我们需要将构造函数变动一下

        public PageViewModel()
        {
            Human = new List<Person>();
            Human = new Persons().getPerson();
            _searchCommand = new RelayCommand(Searhing) { IsEnabled = true };
        }

通过第3行代码,我们其实就是将ViewModel与Command分离了,最后我们将button事件代码修改一下

        void btnSearch_Click(object sender, RoutedEventArgs e)
        {
            pageviewmodel.SearchText = this.textBox1.Text.Trim();
            pageviewmodel.SearchCommand.Execute(null);
        }

这样的话,看起来似乎优雅了点,关于这部分内容网上资源也比较多,就不多解释了。下篇我将结合MVVM与Command实现一个简单的CRUD操作

代码下载:CommandInMVVMSL3+VS2010

原文引入:http://www.cnblogs.com/626498301/archive/2010/08/19/1802974.html

Silverlight中使用MVVM(3)的更多相关文章

  1. Silverlight中使用MVVM(1)--基础

    Silverlight中使用MVVM(1)--基础 Silverlight中使用MVVM(2)—提高 Silverlight中使用MVVM(3)—进阶 Silverlight中使用MVVM(4)—演练 ...

  2. Silverlight中使用MVVM(4)

    Silverlight中使用MVVM(1)--基础 Silverlight中使用MVVM(2)—提高 Silverlight中使用MVVM(3)—进阶 Silverlight中使用MVVM(4)—演练 ...

  3. Silverlight中使用MVVM(2)

    Silverlight中使用MVVM(1)--基础 Silverlight中使用MVVM(2)—提高 Silverlight中使用MVVM(3)—进阶 Silverlight中使用MVVM(4)—演练 ...

  4. Silverlight中使用MVVM(1)

    Silverlight中使用MVVM(1)   Silverlight中使用MVVM(1)--基础 Silverlight中使用MVVM(2)—提高 Silverlight中使用MVVM(3)—进阶 ...

  5. Silverlight中在MVVM模式下对DatagridRow选择控件封装

    在项目中,凡是涉及到表格的地方用的最多的控件,自然少不了DataGrid的身影,它明了的展示各种数据让人十分喜欢.现在要实现一个功能,使DataGrid具有全选和项选中的功能,如果在传统后台代码中完成 ...

  6. 三、Silverlight中使用MVVM(三)——进阶

    这篇主要引申出Command结合MVVM模式在应用程序中的使用 我们要做出的效果是这样的 就是提供了一个简单的查询功能将结果绑定到DataGrid中,在前面的基础上,这个部分相对比较容易实现了 我们在 ...

  7. Silverlight中使用MVVM(2)-(提高)

    在第一篇文章中的示例中,我们已经简单的了解了应用MVVM模式的流程,我的本意是你已经了解了一点MVVM的概念,然后又没有一个较好的例子学习,可以跟着我一起学习MVVM模式,所以这个部分,都是没有理论知 ...

  8. 二、Silverlight中使用MVVM(二)——提高

    在第一篇文章中的示例中,我们已经简单的了解了应用MVVM模式的流程,我的本意是你已经了解了一点MVVM的概念,然后又没有一个较好的例子学习,可以跟着我一起学习MVVM模式,所以这个部分,都是没有理论知 ...

  9. Silverlight中使用MVVM(4)—演练

    本来打算用MVVM实现CRUD操作的,这方面例子网上资源还挺多的,毕竟CRUD算是基本功了,因为最近已经开始学习Cailburn框架了,感觉时间 挺紧的,这篇就实现其中的更新操作吧.         ...

随机推荐

  1. (转)java 中变量存储位置总结

    1.寄存器:最快的存储区, 由编译器根据需求进行分配,我们在程序中无法控制. 2. 栈:存放基本类型的变量数据和对象的引用,但对象本身不存放在栈中,而是存放在堆(new 出来的对象)或者常量池中(字符 ...

  2. 用GDB远程调试android native程序

    上次写了几个native程序,想着如何调试,经过一阵子搜索和测试,终于完成了.有几个关键点: 1 gdb和gdbserver 因为这两个需要配套,建议使用同一个ndk下面的gdb和gdbserver ...

  3. MongoDB数据关系的表达

    虽说MongoDB是非关系型数据库,但由于大部分情况下数据之间是存在关系的,所以MongoDB也需要一些方式来表达数据之间的关系.MongoDB表达数据关系的方式有两种:文档嵌套和数据库引用. 一.文 ...

  4. raspberrypi树莓派liunx下安装golang1.9环境(debian)

    直接安装go1.6以上版本会出现提示 Set $GOROOT_BOOTSTRAP to a working Go tree >= Go 1.4. Go1.9的构建过程需要用于引导的 Go1.4二 ...

  5. html5对各浏览器的支持情况

    考虑到HTML5标准的制定原则:新特性基于HTML.CSS.DOM 以及 JavaScript:减少对外部插件的需求(比如Flash):独立于设备等,我们选取了HTML 5的几项主要特性来评价浏览器系 ...

  6. Netty构建游戏服务器(二)--Hello World

    一,准备工作 1,netty-all-4.1.5.Final.jar(官网下载) 2,eclipse 二,步骤概要 1,服务器开发 (1),创建Server类 该类是程序的主入口,有main方法,服务 ...

  7. java学习笔记总略

    二.正文(一)Java1.接口和抽象类的区别①抽象类里可以有构造方法,而接口内不能有构造方法.②抽象类中可以有普通成员变量,而接口中不能有普通成员变量.③抽象类中可以包含非抽象的普通方法,而接口中所有 ...

  8. Ubuntu 16.04下快速在当前目录打开终端的快捷键设置

    说明:不一定每次都准确打开,80%的机会是行的. 原理:使用xdotool模拟键盘按键,打开的文件夹管理界面,然后通过Ctrl+L获取地址栏地址,然后传递到终端上. 安装: 1.安装xdotool s ...

  9. 【swagger】1.swagger提供开发者文档--简单集成到spring boot中【spring mvc】【spring boot】

    swagger提供开发者文档 ======================================================== 作用:想使用swagger的同学,一定是想用它来做前后台 ...

  10. nuxt.js 加百度统计

    Mark一下: 在 Nuxt.js应用中使用Google统计分析服务,或者百度统计分析服务,推荐在 plugins 目录下创建 plugins/ga.js 文件.统计统计分析我们可以获取网站pv,uv ...