WPF快速入门教程之绑定Binding

绑定(Binding)元素介绍

首先,盗用张图。这图形象的说明了Binding的机理。

此处主要介绍的绑定类是System.Windows.Data.Binding,如果涉及其他内容,将简要介绍,不会过多说明。

下面将简要介绍最基础(最常用)的三个属性:

1、Path —— 路径,用于索引到具体的属性,常常会省略书写,示例如下:

<TextBox Text="{Binding Path=A.B}" />

其中Path=可以省略,因为Binding元素含有一个带参构造函数,其参数为path。另外,示例中A.B需具体到属性,如果A已经是需要绑定的具体属性,则可以用A替换A.B。即最简单的格式是:

 <TextBox Text="{Binding A}" />

2、Mode —— 模式,用于指定数据的更新方向,它是一个枚举类型,共有一下四种方式:

  • OneTime —— 一次性更新(只更新一次),从数据源更新到当前使用的绑定属性。
  • OneWay —— 单向更新,从数据源更新到当前使用的属性。
  • OneWayToSource —— 单向更新,从当前使用的属性更新到数据源。
  • TwoWay —— 双向更新,当前属性与数据源同步。

注:如果未指定,即表示使用默认模式,而在不同的依赖属性上,其模式是不一样的。在使用时,如果不确定其默认模式是否是自己需要的模式时,则可以手动指定。

3、UpdateSourceTrigger —— 数据源更新触发器,用于指定控件上的属性值什么时候更新到数据源,它也是个枚举类型,有以下三种方式:

  • Explicit —— 显示更新,需要调用UpdateSource方法后才能更新。
  • LostFocus —— 失去焦点更新
  • PropertyChanged —— 属性值改变更新,大部分情况会使用此方式,但有时频繁的更新数据源会降低效率,如在TextBox中,如果数据源有较多的数据验证,此时在输入Text时,就有可能出现界面卡顿的情况。

注:当然,此处也有默认值设置,但不同的控件 属性的 默认 值也不一样,不过大部分情况下默认 值是PropertyChanged,比较特殊的有TextBox的Text属性,其默认值是LostFocus。

下面给一个最常用的绑定书写方式:

<TextBox Text="{Binding A,UpdateSourceTrigger=PropertyChanged,Mode=TwoWay}" />

控件绑定

控件绑定,即在同一个界面中不同控件之间的数据同步处理,最常见的就是滑动条与一个文本框之间的绑定。在控件绑定中,需要指定绑定类的ElementName属性值,即当前属性绑定到哪一个控件的属性上。示例如下:

<Slider Name="slider" Maximum="100" />
<TextBox Text="{Binding ElementName=slider,Path=Value,UpdateSourceTrigger=PropertyChanged,Mode=TwoWay}" />

注:在WPF开发中,我们常常是不为控件设置Name值的,而在控件绑定中,必须为源控件添加Name属性值;而有些控件可能会不含有Name属性,此时则使用x:Name来指定名称。

在控件绑定中有一个比较特殊的存在——模板绑定-TemplateBinding,它与Binding并不在一个继承结构上。TemplateBinding是用在控件模板定义中的,用于绑定模板对应控件中的属性,示例如下:

<TextBox x:Name="templatebinding">
 <TextBox.Template>
  <ControlTemplate TargetType="TextBox">
   <TextBlock Text="{TemplateBinding Text}" />
  </ControlTemplate>
 </TextBox.Template>
</TextBox>

TemplateBinding可以简单理解为在Binding中设置了ElementName为其父级控件 —— 事实并非如此,仅作为辅助理解。TemplateBinding相对与Binding要少很多属性内容。

数据绑定

此处数据绑定表示在WPF中的对象绑定,即常见场景 就是把数据库 数据显示到 界面上。而在真实的项目开发中 ,常 会用到MVVM模式,数据绑定将会在那里体现出来,但MVVM模式开发则不在此节中叙述。

下面以一个最简单的示例解释数据绑定:

后台类 —— 数据源结构:

class ForDataBinding
{
 public int Count { get; set; }
}

数据源初始化 —— 创建数据并将数据绑定到界面:

ForDataBinding data = new ForDataBinding();
data.Count = 10;
this.fordatabinding.DataContext = data;

界面控件设置 —— 指定控件绑定到源数据的哪个属性:

<Grid x:Name="fordatabinding">
 <TextBox Text="{Binding Count}" />
</Grid>

其中设置了Grid的DataContext,即表示Grid内部数据上下文是以设置的数据源为基础,在此示例中,Text属性绑定的Count就是以ForDataBinding类对象为基础查找属性。 —— 即绑定路径是以当前位置以树形结构往下查找对应属性。

其他元素

Binding除了以上内容,还有其他的属性设置,本小节将简要介绍几个较为常用的内容。

数据格式化转换

在数据绑定中,有时我们需要显示的数据与源数据不一样,如时间格式,浮点数格式,或者更复杂一些的想要一个类对象中的多个属性组合一起显示。

对于简单的数据格式化,可以通过StringFormat来处理,如时间格式化为yyyy-MM-dd,浮点数保留两位小数等等。其代码示例如下:

后台类:

class SimpleDataConvert
{
 public DateTime Date { get; set; } = DateTime.Now;
 public float Price { get; set; } = 100.123456f;
}

使用:

this.simpleconvert.DataContext = new SimpleDataConvert();

界面处理:

<StackPanel x:Name="simpleconvert">
 <TextBox Text="{Binding Date,StringFormat=yyyy-MM/dd}" />
 <TextBlock Text="{Binding Price,StringFormat=f2}" />
</StackPanel>

上述示例结果就是将Date日期格式化为yyyy-MM/dd;将Price保留两位小数显示。

但是有些数据显示要求无法通过StringFormat处理,则需要使用Binding的属性Converter来处理了 —— 即通过值转换器来处理。下面我们以上面用到的时间转化为例,假如我们要在前台显示yyyyMMdd格式的日期,此时从数据源显示到界面可以正确处理,但是在界面输入,它无法正确转化为源数据,即内置的Converter不支持,此时我们就需要自己实现值转换,示例 如下:

首先定义DateConverter,实现接口IValueConverter,代码如下:

class DateConverter : IValueConverter
{
 /// <summary>
 /// 数据源转界面显示
 /// </summary>
 /// <param name="value"></param>
 /// <param name="targetType"></param>
 /// <param name="parameter"></param>
 /// <param name="culture"></param>
 /// <returns></returns>
 public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
 {
  if (value.GetType() == typeof(System.DateTime))
  {
   return ((System.DateTime)value).ToString("yyyyMMdd");
  }
  else
  {
   return value;
  }
 }

 /// <summary>
 /// 界面显示转数据源
 /// </summary>
 /// <param name="value"></param>
 /// <param name="targetType"></param>
 /// <param name="parameter"></param>
 /// <param name="culture"></param>
 /// <returns></returns>
 public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
 {
  if (targetType == typeof(System.DateTime) && value != null)
  {
   DateTime dt = DateTime.Now;
   string valuestr = value.ToString();
   if (DateTime.TryParse(valuestr, out dt))
   {
    return dt;
   }
   else if (valuestr.Length == 8)
   {
    string yearstr = valuestr.Substring(0, 4);
    string monthstr = valuestr.Substring(4, 2);
    string daystr = valuestr.Substring(6, 2);
    if (DateTime.TryParse(string.Format("{0}-{1}-{2}", yearstr, monthstr, daystr), out dt))
    {
     return dt;
    }
   }
  }
  return value;
 }
}

然后在Xaml文件中添加引用:

由于此处DateConvert直接定义在当前窗体类命名空间下,所以其已经默认添加了如下空间,如果定义在其他位置,则需要手动添加空间引用。

xmlns:local="clr-namespace:Binding_Demo"

资源定义,以便于在控件中引用

<Window.Resources>
 <local:DateConverter x:Key="dateconvert" />
</Window.Resources>

最后,则将值转换器应用到控件上,代码如下:

<TextBox Text="{Binding Date,Converter={StaticResource dateconvert}}" />

至此,一个简单的值转换器就完成了。

数据验证

在绑定中的验证主要设计四个属性:

  • ValidatesOnDataErrors或者ValidatesOnNotifyDataErrors(WPF 4.5之后才有的)—— 与DataErrorValidationRule或NotifyDataErrorValidationRule组合使用
  • ValidatesOnExceptions —— 与ExceptionValidationRule组合使用
  • NotifyOnValidationError —— 控制是否触发Validation.Error事件,用于额外的内容处理
  • ValidationRules —— 验证规则,用于定义验证规则集合

下面我们以异常验证规则来简要介绍验证规则的使用 —— 验证处理涉及的内容有很多,单此一节无法描述完整,故仅列举最简单的使用方式:

首先是后台类的定义:

class ForExceptionValidate
{
 private int max;
 public int Max
 {
  get { return max; }
  set
  {
   if (value > 100)
   {
    throw new Exception("Max不能超过100");
   }
   max = value;
  }
 }
}

this.forvalidate.DataContext = new ForExceptionValidate();

然后是界面使用:

<StackPanel x:Name="forvalidate">
 <TextBox >
  <TextBox.Text>
   <Binding Path="Max" >
    <Binding.ValidationRules>
     <ExceptionValidationRule></ExceptionValidationRule>
    </Binding.ValidationRules>
   </Binding>
  </TextBox.Text>
 </TextBox>
</StackPanel>

在此 示例 中,后台类中抛出的异常,会作为界面的验证结果来处理 —— 所以此处虽然没有明确使用异常捕获,但程序并 不会崩溃。

依赖属性

最后,简要说下依赖属性,所有上面的绑定基础都需要靠依赖属性。所有需要绑定功能的属性都进行了对应依赖属性(System.Windows.DependencyProperty)定义。在WPF中,我们大部分时间是在用依赖属性 —— 各种绑定,而自己的定义依赖属性的情况相对较少,所以此处就不再介绍如何定义依赖属性 —— 作为入门介绍教程。

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对我们的支持。

(0)

相关推荐

  • WPF基础教程之元素绑定详解

    前言 简单的说,数据绑定是一种关系,该关系告诉WPF从一个源对象提取一些信息,并使用这些信息设置目标对象的属性.目标属性总是以来属性,并且通常位于WPF元素中,毕竟,WPF数据绑定的最终目的是在用户界面中显示一些信息.然而,源对象可以是任何内容,从另一个WPF元素到ADO.NET数据对象(如DataTable和DataRow对象)或自己创建的纯数据对象. 下面话不多说了,来一起看看详细的介绍吧 元素绑定 数据绑定最简单的形式是源对象是WPF元素而且源属性是依赖项属性.依赖项属性具有内置的更改通知

  • C#中WPF ListView绑定数据的实例详解

    C#中WPF ListView绑定数据的实例详解 WPF中ListView用来显示数据十分方便, 我们可以将它分成几个列,每一个列用来显示一条数据,但是又是在一方之中. 那么怎样实现这样的效果的呢,这就要用绑定了. 我们先来看一看他的xmal代码 <ListView Name="receiveList" Grid.Row="0"> <ListView.View> <GridView> <GridView.Columns>

  • WPF中的ListBox实现按块显示元素的方法

    本文实例讲述了WPF中的ListBox实现按块显示元素的方法.分享给大家供大家参考,具体如下: 注意:需要设置ListBox的属性 ScrollViewer.HorizontalScrollBarVisibility="Disabled" 关键代码,WPF中有内置的WrapPanel控件,在ListBox.ItemsPanel中使用可以让元素按块显示 <ListBox.ItemsPanel> <ItemsPanelTemplate> <WrapPanel/

  • MVVM模式下WPF动态绑定展示图片

    MVVM模式下WPF动态展示图片,界面选择图标,复制到项目中固定目录下面,保存到数据库的是相对路径,再次读取的时候是根据数据库的相对路径去获取项目中绝对路径的图片展示. 首先在ViewModel中 //属性定义 BitmapImage _ImageSource; /// <summary> /// 显示的图标 /// </summary> public BitmapImage ImageSource { get { return _ImageSource; } set { _Ima

  • WPF绑定实例详解

    本文详细讲述了WPF绑定的用法,分享给大家供大家参考.具体用法分析如下: 1.WPF绑定使用的源属性必须是依赖项属性,这是因为依赖项属性具有内置的更改通知支持,元素绑定表达式使用了Xaml扩展标记,WPF绑定一个控件是使用Binding.ElementName,绑定非控件对象时使用Source,RelativeSource,DataContext属性(WPF特有,而非XAML),只能绑定对象的共有字段. 下边是部分Binding 属性名,完整列表参考 :http://msdn.microsoft

  • 解析WPF绑定层次结构数据的应用详解

    在实际项目应用中会存在多种类型的层次结构数据,WPF提供了良好的数据绑定机制.其中运用最频繁的就是ListBox和TreeView控件. 一.ListBox和TreeView控件的区别1.ListBox显示单层次数据集合,TreeView可以显示单层次和多层次数据集合:2.通过ListBox在UI层面可以展示良好的数据显示效果,对数据集合可以进行排序.分组.过滤操作:3.TreeView显示为一个多层次的数据集合为树形结构,通过Templete和Style属性同样可以为其定义良好的数据显示效果:

  • WPF的数据绑定详细介绍

    一.WPF数据绑定的概要 数据绑定:是应用程序 UI 与业务逻辑之间建立连接的过程. 如果绑定正确设置并且数据提供正确通知,则当数据的值发生更改时,绑定到数据的视觉元素会自动反映更改. 数据绑定可能还意味着如果视觉元素中数据的外部表现形式发生更改,则基础数据可以自动更新以反映更改. 例如:如果用户编辑 TextBox 元素中的值,则基础数据值会自动更新以反映该更改. 1. 数据绑定涉及到两个方面: 一个是绑定源,一个是绑定目标.绑定源即控件绑定所使用的源数据,绑定目标即数据显示的控件. 2. 对

  • WPF快速入门教程之绑定Binding

    绑定(Binding)元素介绍 首先,盗用张图.这图形象的说明了Binding的机理. 此处主要介绍的绑定类是System.Windows.Data.Binding,如果涉及其他内容,将简要介绍,不会过多说明. 下面将简要介绍最基础(最常用)的三个属性: 1.Path -- 路径,用于索引到具体的属性,常常会省略书写,示例如下: <TextBox Text="{Binding Path=A.B}" /> 其中Path=可以省略,因为Binding元素含有一个带参构造函数,其

  • OpenStack云计算快速入门教程(1)之OpenStack及其构成简介

    该教程基于Ubuntu12.04版,它将帮助读者建立起一份OpenStack最小化安装.我是五岳之巅,翻译中多采用意译法,所以个别词与原版有出入,请大家谅解.我不是英语专业,我觉着搞技术最重要的就是理解,而不是四级和考研中那烦人的英译汉,所以我的目标是忠于原意.通俗表达,Over.英文原文在这里(http://docs.openstack.org/es@***/openstack-compute/starter/content/ ,请将ex@***中的@去掉,CU屏蔽的F词),下面步入正题: 第

  • ReactJs快速入门教程(精华版)

    现在最热门的前端框架有AngularJS.React.Bootstrap等.自从接触了ReactJS,ReactJs的虚拟DOM(Virtual DOM)和组件化的开发深深的吸引了我,下面来跟我一起领略ReactJs的风采吧~~ 文章有点长,耐心读完,你会有很大收获哦~   一.ReactJS简介 React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站.做出来以后,发现这套东西

  • Vue.js快速入门教程

    像AngularJS这种前端框架可以让我们非常方便地开发出强大的单页应用,然而有时候Angular这种大型框架对于我们的项目来说过于庞大,很多功能不一定会用到.这时候我们就需要评估一下使用它的必要性了.如果我们仅仅需要在一个简单的网页里添加屈指可数的几个功能,那么用Angular就太麻烦了,必要的安装.配置.编写路由和设计控制器等等工作显得过于繁琐. 这时候我们需要一个更加轻量级的解决方案.Vue.js就是一个不错的选择.Vue.js是一个专注于视图模型(ViewModal)的框架.视图模型是U

  • Vue.js 60分钟快速入门教程

    vuejs是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的.相比于Angular.js,Vue.js提供了更加简洁.更易于理解的API,使得我们能够快速地上手并使用Vue.js. 如果你之前已经习惯了用jQuery操作DOM,学习Vue.js时请先抛开手动操作DOM的思维,因为Vue.js是数据驱动的,你无需手动操作DOM.它通过一些特殊的HTML语法,将DOM和数据绑定起来.一旦你创建了绑定,DOM将和数据保持同步,每当变更了数据,DOM也会相应地更新. 当

  • ASP.NET Core快速入门教程

    目录 第一课 基本概念 第二课 控制器的介绍 第三课 视图与表单 第四课 数据验证 第五课 路由规则 第六课 应用发布与部署 源码地址 第一课 基本概念 基本概念 Asp.Net Core Mvc是.NET Core平台下的一种Web应用开发框架 符合Web应用特点 .NET Core跨平台解决方案 MVC设计模式的一种实现 环境准备 安装最新版Visual Studio 2017 安装最新版.NET Core Sdk 第二课 控制器的介绍 控制器定义方式: 命名以Controller结尾 使用

  • 微信小程序开发实战快速入门教程

    目录 注册微信小程序 微信开发者工具 第一个小程序 新建项目 项目目录结构 目标成果 步骤分解 页头页尾 个人中心 生活指南 模拟弹窗 预览图片 注册微信小程序 如果你还没有微信公众平台的账号,请先进入微信公众平台首页,点击 “立即注册” 按钮进行注册.注册的账号类型可以是订阅号.服务号.小程序以及企业微信,我们选择 “小程序” 即可. 接着填写账号信息,需要注意的是,填写的邮箱必须是未被微信公众平台注册.未被个人微信号绑定的邮箱,而且每个邮箱仅能申请一个小程序. 激活邮箱之后,选择主体类型为

  • jQuery Easyui快速入门教程

    1.什么是JQuery EasyUI jQuery EasyUI是一组基于JQuery的UI插件集合,而JQueryEasyUI的目标就是帮助开发者更轻松的打造出功能丰富并且美观的UI界面.开发者不需要编写复杂的JavaScript,也不需要对css样式有深入的了解,开发者需要了解的只是一些简单的html标签. 2.学习jQuery EasyUI的条件 因为JQueryEasyUI是基于jQuery的UI库,所以,必须需要JQuery课程的基础. 3.JQuery EasyUI的特点 基于JQu

  • Yii2框架制作RESTful风格的API快速入门教程

    先给大家说下什么是REST restful REST全称是Representational State Transfer,中文意思是表述(编者注:通常译为表征)性状态转移. 它首次出现在2000年Roy Fielding的博士论文中,Roy Fielding是HTTP规范的主要编写者之一. 他在论文中提到:"我这篇文章的写作目的,就是想在符合架构原理的前提下,理解和评估以网络为基础的应用软件的架构设计,得到一个功能强.性能好.适宜通信的架构.REST指的是一组架构约束条件和原则." 如

  • Java的JNI快速入门教程(推荐)

    1. JNI简介 JNI是Java Native Interface的英文缩写,意为Java本地接口. 问题来源:由于Java编写底层的应用较难实现,在一些实时性要求非常高的部分Java较难胜任(实时性要求高的地方目前还未涉及,实时性这类话题有待考究). 解决办法:Java使用JNI可以调用现有的本地库(C/C++开发任何和系统相关的程序和类库),极大地灵活Java的开发. 2. JNI快速学习教程 2.1 问题: 使用JNI写一段代码,实现string_Java_Test_helloworld

随机推荐