数据绑定(一)

简介:


在.net中,数据绑定对程序的快速开发提供了一个便利,像一些列表控件,combox,Listbox,datagridview等,都是通过这种简单的绑定,来实现批量数据的展示。WPF中的数据绑定又提升了一个等级,不但数据库与UI控件能绑定,UI控件与UI控件的绑定都可以实现,并且绑定到控件上的属性也得到了大的扩展(以前最常用的绑定属性是DataSource)。

image

绑定这个词就告诉我们,应该是把两个或更多的事或物结合在一起,是的,在WPF中的绑定,是把绑定目标和绑定源(通常是数据集合,对象,元素控件)结合在一起,这种结合是有选择的结合,所以在绑定目标和绑定源中,都要先择出绑定的属性。举个例子,我们有一个下拉列表,有一个文本框,我们希望选中的下拉项,显示到文本框中,这时,下拉列表就是一个绑定源,选中的项就是绑定源属性,文本框就是绑定目标,Text属性就是绑定目标属性。要注意的是,绑定源没有限制,可以是WPF的元素控件,也可以是一个集合,可以是对象,可以是XML数据等,但绑定目标中的绑定属性就有限制了,它必需是依赖项属性。

在绑定中,绑定源和绑定目标有一个桥梁,这个桥量是有方向的,这个方向是通过一个BindingMode枚举来区分的,这个枚举代码如下:

    public enum BindingMode

    {

       // 绑定源和绑定目标双方触发更新

        TwoWay = 0,

       // 绑定源触发绑定目标更新

        OneWay = 1,

        //绑定源触发绑定目标更新一次(只是在初始化的时侯)

        OneTime = 2,

        //绑定目标触发绑定源更新

        OneWayToSource = 3,

        //默认值,根据控件来确定是单向还是双向,一般情况下,可编辑控件是双向绑定,不可编辑控件是单向绑定(即OneWay方式)

        Default = 4,

    }

}

接下来,先看一个简单的元素控件和元素控件的绑定。

<Label Content="{Binding ElementName=textBox1,Path=Text}" Height="28" HorizontalAlignment="Left" Margin="146,10,0,0" Name="label1" ;57" />

Content是用绑定来实现的,当然Lable是绑定目标对象,Content就是绑定目标属性了,绑定源就是ElementName=textBox1,绑定源属性是Path=Text,由于Lable是不可编辑的,所以Lable.Content的变化只能依据TextBox.Text了。

上面是通过属性绑定,代码绑定如下:

            label1.DataContext = textBox1;

            label1.SetBinding(Label.ContentProperty, "Text");

接下来,绑定一个对象,对象生成的类如下:

public class Person

    {

int age;

public int Age

        {

get

            {

return age;

            }

set

            {

                age = value;

            }

        }

string name;

public string Name

        {

get

            {

return name;

            }

set

            {

                name = value;

            }

        }

    }

接下来,用TextBox来显示这个对象的Age属性,可以承载TextBox 的窗里的构造里实例化一个对象:

person = new Person();

person.Age = 25;

textBox1.DataContext = person;

让文本框的数据绑定到person这个对象上(也以把person对象绑定到textBox1的父对元素的DataContext上)。

然后把textBox1的Text绑定到对象的Age上,可以用标签属性,也可以用代码,分别如下:

<TextBox  Height="23" Text="{Binding Path=Age}" Margin="12,31,0,0" Name="textBox1"  ;120" >

textBox1.SetBinding(TextBox.TextProperty, "Age")

上面的绑定都比较简单,有时间要进行比较特别的绑定,那就是绑定源属性与绑定目标属性类型不一样,这样的话就需要作一个类型转换。在窗体上放置一个label2,它的背景色根据Age的变化而变化,小于等20岁为红色,大于20小于等于50为绿色,大于50为蓝色,这如何实现?

首先得构造类型转换类,在绑定中的转换,微软提供了一个接口IValueConverter,我们必需实现这个接口,才能实现绑定的类型转换。转换定意如下:

[ValueConversion(typeof(int), typeof(Brush))]

class ConvertClass : IValueConverter

    {

public object Convert(object value, Type targetType, object parameter, CultureInfo culture)

        {

if (targetType != typeof(Brush))

            {

return null;

            }

int age = int.Parse(value.ToString());

SolidColorBrush scb = Brushes.White; ;          

if (age <= 20)

            {

                scb = Brushes.Red;

            }

if (age &lt;= 50 && age > 20)

            {

                scb = Brushes.Green;

            }

if (age &gt; 50)

            {

                scb = Brushes.Blue ;

            }

return scb;

        }

public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)

        {

throw new Exception();

        }

    }

这个接口有两个方法,一个Convert和一个ConvertBack,即两个类型的转换“来”和转换“去”。

在XAML元素中设置,首先设置一个Windows资源(就类似于实例化一个ConvertClass对象一样)

<Window.Resources>

<m:ConvertClass x:Key="Conv"></m:ConvertClass>

</Window.Resources>

然后绑定label2:

<Label  Height="28" Background="{Binding Path=Age,Converter={StaticResource Conv}}"  Margin="66,60,0,0" Name="label2" ;106" />

代码实现如下:

Binding bd = new Binding();

  bd.Path = new PropertyPath("Age");

  bd.Converter = new ConvertClass();

  label2.SetBinding(Label.BackgroundProperty, bd);




















本文转自桂素伟51CTO博客,原文链接:http://blog.51cto.com/axzxs/414344 ,如需转载请自行联系原作者


相关文章
|
JavaScript 前端开发
双向数据绑定是什么
双向数据绑定是什么
151 2
|
2月前
|
SQL 开发框架 .NET
C#一分钟浅谈:数据绑定与数据源控件
在Web开发中,数据绑定和数据源控件是实现动态网页的关键技术。本文从基础概念入手,详细讲解数据绑定的原理及其在ASP.NET中的应用,并介绍常见数据绑定方式:手动绑定和自动绑定。接着,文章重点介绍了ASP.NET中的数据源控件,如`SqlDataSource`、`ObjectDataSource`、`XmlDataSource`和`LinqDataSource`,并通过具体示例演示如何使用`SqlDataSource`和`GridView`进行数据绑定。最后,还列举了一些常见问题及其解决办法,帮助读者更好地理解和应用这些技术。
85 4
|
4月前
|
JavaScript 开发者
vue学习之响应式数据绑定
响应式数据绑定
58 0
|
2月前
|
JavaScript UED
Vue双向数据绑定的原理
【10月更文挑战第7天】
|
JavaScript 前端开发 Go
深入理解Vue响应式系统:数据绑定探索
深入理解Vue响应式系统:数据绑定探索
231 0
|
7月前
|
JavaScript
Vue之数据绑定
vue的简单的数据绑定操作
|
7月前
|
JavaScript 开发者
如何在 Vue 中实现数据绑定?
如何在 Vue 中实现数据绑定?
56 0
|
7月前
|
JavaScript API
vue3双向数据绑定
vue3双向数据绑定
|
JavaScript 前端开发
Vue 数据绑定 和 数据渲染
Vue 快速入门——数据绑定及数据渲染,事件绑定机制 介绍及演示。
123 0
|
JavaScript 开发者
Vue 双向数据绑定
Vue 双向数据绑定