分享
 
 
 

Atlas编程揭密之数据绑定

王朝other·作者佚名  2008-06-01
窄屏简体版  字體: |||超大  

Atlas架构提供了一种比asp.net中数据绑定(data binding)强大得多的客户端绑定模型。这种模型异常灵活,甚至有些类似WPF(Windows PResentation Foundation)中的绑定模型。Atlas提供的绑定模型答应您将某对象的任意一个属性绑定到另外一个对象的任意一个属性上。它不单单可以应用于数据绑定,甚至可以将某个控件的样式绑定到另外一个控件上。这样使得在Atlas中将一切关联起来变成可能。

在本文中,我将尝试分析一些Atlas实现代码来解释Atlas是如何完成Binding的。

首先让我们察看一小段应用Atlas Binding的代码。这里将一个textbox的text属性和一个select list的selectedValue属性绑定起来。无论你改变其中的哪个,在另一个上面都会有马上得到体现。

Html和ASPX,定义textbox和select list。(注重必须声明一个ScriptManager服务器端对象,以引入Atlas必须的javascript文件。)

<atlas:ScriptManagerID="ScriptManager1"runat="server"/>

<div>

Inputanintegerfrom1to5.<br/>

<inputid="myTextBox"type="text"/><br/>

Selectanitem.<br/>

<selectid="mySelect">

<optionvalue="1">value1</option>

<optionvalue="2">value2</option>

<optionvalue="3">value3</option>

<optionvalue="4">value4</option>

<optionvalue="5">value5</option>

</select>

</div>

Atlas脚本,将上面两个HTML控件“升级”成Atlas控件。

<pagexmlns:script="http://schemas.microsoft.com/xml-script/2005">

<references>

</references>

<components>

<textBoxid="myTextBox">

<bindings>

<bindingdataContext="mySelect"dataPath="selectedValue"property="text"direction="InOut"/>

</bindings>

</textBox>

<selectid="mySelect"/>

</components>

</page>

如上所示,我们只需要书写一小段简单的代码即可实现需要的绑定功能。

Atlas是如何实现这些的呢?首先,Atlas需要有一种途径来监听绑定控件的绑定属性的变化(除非你不需要Atlas提供的自动绑定功能)。在Atlas.js中定义了一个名为Sys.INotifyPropertyChanged的接口,类似.NET中提供的一样。对象可以实现这个接口以期让别的对象监听到自己的属性值的变化。Atlas中所有组件的基类,Sys.Component,实现了这个接口。Sys.Component同样提供一个方法raisePropertyChanged(propertyName),这个方法应该在每个属性的setter中被调用以发出INotifyPropertyChanged.propertyChanged事件。

目前为止,我们可以看一下Atlas控件中textbox的具体实现。看看textbox中是如何在相应的HTML事件发出时同样发出propertyChanged事件的。

var_text;

var_changeHandler;

this.get_text=function()
{

returnthis.element.value;

}

this.set_text=function(value)
{

if(this.element.value!=value)
{

this.element.value=value;

this.raisePropertyChanged('text');

}

}

this.initialize=function()
{

Sys.UI.TextBox.callBaseMethod(this,'initialize');

_text=this.element.value;

_changeHandler=Function.createDelegate(this,this._onChanged);

this.element.attachEvent('onchange',_changeHandler);

_keyPressHandler=Function.createDelegate(this,this._onKeyPress);

this.element.attachEvent('onkeypress',_keyPressHandler);

}

this._onChanged=function()
{

if(this.element.value!=_text)
{

_text=this.element.value;

this.raisePropertyChanged('text');

}

}

可以看到,当text属性改变时,Atlas发出了propertyChanged事件,这就使绑定到这个属性成为可能。

而后Atlas的绑定模型捕捉到了这个事件,再根据binding声明查找出与其相关的目的对象以及相应的属性,并调用这个属性的Setter来实现目的对象属性的变化。

假如源对象(source object)实现了INotifyPropertyChanged接口,并且改变的属性就是dataPath 中指定的属性,同时direction 设定为In或者InOut,Atlas绑定将通过分析引入(incoming)的binding来处理propertyChanged事件(参考下面将要介绍的evaluateIn()方法)。

类似的,假如目的对象(target object)实现了INotifyPropertyChanged接口,并且改变的属性就是property中指定的属性,同时direction 设定为Out或者InOut,Atlas绑定将通过分析流出(outgoing)的binding来处理propertyChanged事件(参考下面将要介绍的evaluateOut()方法)。

接下来让我们察看binding实现代码中的的公有方法和属性来分析一下Atlas绑定的核心实现。在这里没有必要列出涉及绑定的全部代码,假如您感爱好,可以用要害词Sys.BindingBase和Sys.Binding 在Atlas.js文件中进行搜索。首先是Sys.BindingBase提供的方法和属性。

属性automatic:指定当源对象的相应属性变化时(对于In和InOut),或者目的对象的相应属性变化时(对于Out和InOut),绑定是否将被自动执行。这个属性默认会被置为true。当然假如你需要完全控制绑定的开始时机时也可以设定为false。例如,某些情况下你决定在一个Ajax请求成功返回的时候才开始绑定数据源与显示控件,以确保显示控件真正绑定到了一些数据,这时你需要显示的调用binding的evaluate()方法以开始绑定。

属性dataContext:指定拥有待绑定属性的对象。假如不指定的话,Atlas binding将调用包含它的父控件的dataContext属性代替。控件可以通过返回设定的dataContext或是按照默认返回其父控件的dataContext来实现这个属性。例如,某个ListView控件可以在其创建ListView Item时设定它的dataContext为一个DataRow对象,以实现绑定。

属性dataPath:指定需要绑定的源对象的属性。Atlas binding还答应绑定一个嵌套的属性,类似:sourceObjectProperty.nestedProperty.nestedNestedProperty。源代码中可以看出Atlas能自动为你转化并运行这些代码。dataPath属性的默认值为空,也就是Atlas会绑定这个对象本身。

属性property:指定需要绑定的目标对象的属性。你应该总是指定这个属性,否则这个绑定就没有任何意义。

属性propertyKey:有时候我们可能需要绑定到某个对象的嵌套属性上。比如,假如需要绑定到style的属性color,我们可以指定property属性为style,并指定propertyKey属性为color。

属性transformerArgument:传递给Atlas transformer的参数,只有设定transform时才会用到。

事件transform:这个事件答应在绑定时指定一个transformer。当你需要在绑定的时候对数据做以处理时,transformer将会是个很好的选择。例如,假如你希望显示一个布尔值为Yes/No而不是默认的true/false,那么就应该使用一个自定义的transformer。Atlas同时提供了一些内建的transformer,例如Add,Multiply以及Compare等。

方法evaluateIn:处理引入的binding。假如direction属性设置成为In或者InOut,该方法将取得源对象的属性的值(根据binding中设定的dataContext以及dataPath属性),并调用目标对象相应属性的Setter。这也就是Atlas中实现binding的核心部分。

Sys.Binding(也在Atlas.js中)中也有一些重要的方法/属性:

属性direction:指定希望监听的属性变化的方向。可以设定为In,Out或者InOut。默认值为In。

方法evaluateOut:与基类中的方法evaluateIn类似,但是以相反的方向执行。当然,需要将directiton属性设定为Out或者InOut。 希望这些解释能够让您对Atlas的“神奇的”绑定有一些更深入的理解。欢迎留言探讨。

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有