使用 MVVMLight 命令绑定(转)
继上一篇文章的项目,我们实现了数据绑定到界面中。这篇文章我们将实现把命令绑定到按钮上,在XAML中的Button之类的都会有个Command属性可以让我们来绑定命令使用。
首先我们要实现的目标是,在界面中可以点击按钮添加数据,但是最多能添加5条数据,最少保证有1条数据。也就是两个按钮哈(增加数据/删除数据)。界面如下:
在界面中我们可以看见,已经增加了5条数据,按钮“增加一条数据”已经呈现灰色不可用状态。这正是因为我们在命令中做了命令是否可用进行的限制。
MVVMLight 之 RelayCommand
在 GalaSoft.MvvmLight.Command;
命名空间中我们可以找到一个名为 RelayCommand
的类,该类包含了两种构造函数,根据情况选择。
第一种:
RelayCommand(传入要执行的方法);
执行命令的就是执行你传入的这个方法啦,详细可以参考本文的示例代码。
第二种:
RelayCommand(传入要执行的方法, 传入判断命令是否可执行的方法);
第二种构造函数基本上就是第一种的升级版,可以控制命令是否可用。
下面来看看我们的UserViewModel的完整源码
其实只看命令部分即可,理解如何构造一个完整的命令。
- using System;
- using System.Collections.Generic;
- using System.Collections.ObjectModel;
- using System.Linq;
- using System.Text;
- using System.Threading.Tasks;
- using GalaSoft.MvvmLight;
- using MyModel;
- using GalaSoft.MvvmLight.Command;
- namespace MVVMLightDemo.ViewModel
- {
- public class UserViewModel : ViewModelBase
- {
- /*********** 构造函数 ************/
- public UserViewModel()
- {
- //初始化数据
- _userData = User.GetUserList();
- //初始化命令 (第一个参数是执行的命令方法,第二个参数是控制命令是否可用)
- AddUserCommand = new RelayCommand(ExecuteAddUser, CanExecuteAddUser);
- DeleteUserCommand = new RelayCommand(ExecuteDeleteUser, CanExecuteDeleteUser);
- }
- /************** 属性 **************/
- private ObservableCollection<User> _userData;
- /// <summary>
- /// 用户信息数据
- /// </summary>
- public ObservableCollection<User> UserData
- {
- get { return _userData; }
- set
- {
- _userData = value;
- RaisePropertyChanged("UserData");
- }
- }
- /************* 命令 ***************/
- #region 新增一个用户命令:AddUserCommand
- /// <summary>
- /// 新增一个用户
- /// </summary>
- public RelayCommand AddUserCommand { get; private set; }
- //新增一个用户 命令执行方法
- void ExecuteAddUser()
- {
- User user = new User();
- user.ID = 3;
- user.Name = "王旭";
- user.Domain = "无/" + DateTime.Now.ToString();
- UserData.Add(user);
- }
- //小于5条数据时命令可用
- bool CanExecuteAddUser()
- {
- return UserData.Count < 5;
- }
- #endregion
- #region 删除一个用户命令:DeleteUserCommand
- /// <summary>
- /// 删除一个用户
- /// </summary>
- public RelayCommand DeleteUserCommand { get; private set; }
- //删除一个用户 命令执行方法
- void ExecuteDeleteUser()
- {
- UserData.RemoveAt(0);
- }
- //最少保证有1条数据时命令可用
- bool CanExecuteDeleteUser()
- {
- return UserData.Count > 1;
- }
- #endregion
- }
- }
以上包含的两个命令实现了我们前面所提交的逻辑,在这里Execute开头命名的方法是命令执行的方法,CanExecute开头的命名的方法是执行之前所判断的条件,根据你所给的返回值来决定这个命令是否可用。至于方法命名方式你要随意,看习惯咯。
是不是很简单?没错,就这么简单,下面我们再看看View吧。
下面是UserView.xaml的XAML代码
相对上一篇文章其实就加了两个按钮而已。
- <Window x:Class="MVVMLightDemo.View.UserView"
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
- Title="UserView" Height="300" Width="300">
- <Grid>
- <Grid.RowDefinitions>
- <RowDefinition Height="auto" />
- <RowDefinition Height="*" />
- </Grid.RowDefinitions>
- <StackPanel Grid.Row="0">
- <Button Command="{Binding AddUserCommand}">增加一条数据</Button>
- <Button Command="{Binding DeleteUserCommand}">删除一条数据</Button>
- </StackPanel>
- <DataGrid Grid.Row="1" ItemsSource="{Binding UserData}"></DataGrid>
- </Grid>
- </Window>
在Button元素标签中使用 Command属性,将其绑定我们指定命令名称即可。
小提示:别忘了给自己的命令设置 public ,否则是没法成功绑定的。
至此我们就完成了对MVVMLight命令绑定的一个了解,没错还有一些问题我们现在没法解决。例如,在TextBox Lable Window 之类的没有Command命令。我们如何做,下一篇文章会详细对此进行阐述,我们将改进程序的加载方式,希望在界面呈现之后加载数据。
所以我们会在Load的时候加载数据,但是不违背MVVM设计模式的思想之代码分离。所以我们不会在View中编写代码实现,而是通过事件绑定命令的方式实现。
使用 MVVMLight 命令绑定(转)的更多相关文章
- 使用 MVVMLight 命令绑定
首先,如果您希望了解更多的MVVMLight技术或希望有顺序的学习MVVMLight,请查阅目录<MVVMLight 设计模式系列使用文章>. 继上一篇文章的项目,我们实现了数据绑定到界面 ...
- 将命令绑定到事件中(WPF)
绑定到指定名称控件的——>指定属性上 <i:Interaction.Triggers> <i:EventTrigger E ...
- MVVM模式解析和在WPF中的实现(三)命令绑定
MVVM模式解析和在WPF中的实现(三) 命令绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...
- 【2016-11-15】【坚持学习】【Day26】【WPF 命令绑定到事件】
今天同事跟我说了已经有用的东西. System.Windows.Interativity 这个命名空间可以让我在界面上将命令绑定到对应的事件上.解决了我一直的疑问,只有点击事件可以绑定??现在有答案了 ...
- C#使用Xamarin开发可移植移动应用(3.进阶篇MVVM双向绑定和命令绑定)附源码
前言 系列目录 C#使用Xamarin开发可移植移动应用目录 源码地址:https://github.com/l2999019/DemoApp 可以Star一下,随意 - - 说点什么.. 嗯..前面 ...
- C#使用Xamarin开发可移植移动应用(4.进阶篇MVVM双向绑定和命令绑定)附源码
前言 系列目录 C#使用Xamarin开发可移植移动应用目录 源码地址:https://github.com/l2999019/DemoApp 可以Star一下,随意 - - 说点什么.. 嗯..前面 ...
- WPF中的命令与命令绑定导航
1.WPF中的命令与命令绑定(一) (引入命令) 2.WPF中的命令与命令绑定(二)(详细介绍命令和命令绑定)
- MVVM模式的命令绑定
命令绑定要达到的效果 命令绑定要关注的核心就是两个方面的问题,命令能否执行和命令怎么执行.也就是说当View中的一个Button绑定了ViewModel中一个命令后,什么时候这个Button是可用的, ...
- PIE SDK图层树右键菜单与命令绑定
1. 功能简介 上一节已经介绍过图层树如何和地图和制图关联,图层树右键菜单主要是基于TocControl控件进行对菜单节点进行控制,TocControl主要作用是显示当前加载的图层有哪些.采用什么 ...
随机推荐
- git学习——Git 基础要点【转】
转自:http://blog.csdn.net/zeroboundary/article/details/10549555 简单地说,Git 究竟是怎样的一个系统呢?请注意,接下来的内容非常重要,若是 ...
- Service Mesh 及其主流开源实现解析(转)
什么是 Service mesh Service Mesh 直译过来是 服务网格,目的是解决系统架构微服务化后的服务间通信和治理问题.服务网格由 sidecar 节点组成.在介绍 service me ...
- CentOS 6 安装chromium
由于centos 6对C++11支持不足的缘故,目前chromium已经不再支持CentOS 6系列. 这里介绍如何在centos 6系列安装chromium. 1.添加chromium源 cd /e ...
- ORM,DAO,MVC,POJO
1.ORM 对象关系映射(Object Relational Mapping,简称ORM)是一种为了解决面向对象与关系数据库存在的互不匹配的现象的技术. 简单的说,ORM是通过使用描述对象和数据库之间 ...
- Git(五)IDEA应用Git
一.IDEA客户端git 1.提交代码到本地仓库 1. 关联Git,创建本地库 关联git 配置git环境变量 设置本地仓库目录,一般是IDEA工作空间,选择VCS->Import into V ...
- Qt_mingw搭建opencv开发环境
Qt在windows下共有2个版本:mingw和msvc.其中mingw使用gcc编译器,msvc使用微软的VC编译器.针对不同版本Qt,使用Opencv的方式也不同. 区别 msvc, 可以使用op ...
- 什么是Less、typescript与webpack?
前端常用技术概述--Less.typescript与webpack 前言:讲起前端,我们就不能不讲CSS与Javascript,在这两种技术广泛应用的今天,他们的扩展也是层出不穷,css的扩展有Les ...
- 【Java】 大话数据结构(16) 排序算法(3) (堆排序)
本文根据<大话数据结构>一书,实现了Java版的堆排序. 更多:数据结构与算法合集 基本概念 堆排序种的堆指的是数据结构中的堆,而不是内存模型中的堆. 堆:可以看成一棵完全二叉树,每个结点 ...
- 大数据小视角4:小议Lambda 与 Kappa 架构,不可变数据的计算探索
这个系列文章之前因为私事荒废了很久,继续更新--之前与老大谈论架构时,老大和我聊了聊分布式数据处理之中的Lambda结构,之前在<Designing Data-Intensive Applica ...
- Linux文件的所有权与权限
要了解Linux的权限,需要和Linux的用户与组的概念一并理解,不了解的同学请参考Linux的用户和组 简介 在Linux中,每个文件除了有用户和组的信息以外,还有其对应的权限.可使用来查看. [r ...