扩展Flex组件

1、flex包含一个基于组件的开发模型,你只需要按需求继承现有的组件并扩展相关的方法就可开发你的应用。
2、可视化组件包括以下主要特性:尺寸、事件、样式、效果、皮肤。
3、flex定义了两套组件。一套为Spark,放在spark.*包下。一套为MX,放在mx.*包下。Spark是在flex4中新添加的,mx为旧版本中定义的。两套组件的主要不同点在于样式及皮肤的使用。另外对于容器组件,布局的方式也改变了。
4、有些组件在两套UI中都存中,例如按钮,在这种情况下adobe建议你使用Spark中的组件。有些组件是某套UI特有的。例如Spark中的3d效果。mx组件中的数据可视化组件,例如DataGrid、AdvancedDataGrid。所以你的应用会包含两套UI中的组件。
5、可视化组件的继承层次结构:Object-EventDispatcher-DisplayObject-InteractiveObject-DisplayObjectContainer-Sprite-FlexSprite-UIComponent。flex中所有的可视化对像都继承自UIComponent。
6、UIComponent中需要注意以下属性。doubleClickEnabled:flex默认是不支持双击的,如果要开启双击,请把该属性设为true;height:在mxml中你可以设置值为数字,这时默认单位为pix。你也可以设置为70%这种比例。在as中,如果要设置百分比,你需要用percentHeight这个属性。x,y:这组属性只在layout为绝对布局时才有效。
7、每一个flex组件都有对应的mxml接口和as接口。两者之间是相等的。
8、每个一可视化组件都包含以下三个生命周期事件:preInitialize:组件刚被创建,还没有添加子节点,且不可见。initialize:把子节点初始化好,并尺寸也设置好,但仍然处于不可见状态。 creationComplete:组件已经被放在父容器中而且可见。你可以使用上面三个事件对组件做一些初始化工作。
9、flex提供了多种设置组件大小和布局的机制。默认大小:如果你不指定组件的大小或布局,flex会自动设置一个适合的值。显式设置大小:你可以显式地设置组件的height/width大小。基于比例的设置大小:例如在mxml中设置height/width=70%或在as中设置percentHeight/percentWidth=70。基于约束的布局:你可通过组件中的样式属性:top,buttom等设置组件的布局及大小。这种设置方式只可以使用在父组件为绝对布局的情况。
10、flex应用是基于事件驱动的。事件可以让程序员知道用户与UI的交互、组件的生命周期及外观变化。当一个组件分发事件,所以对该组件进行监听的监听器都会被通知。
11、除了用选择器设置组件的外观外,还可以直接调用元素的setStyle("proName","value")设置外观。
12、flex4中的类选择器需要使用命名空间。例子代码:@namespace s "library://ns.adobe.com/flex/spark"; s|BorderContainer{borderColor:red;}。
13、效果(effect)是组件在一段时间内的视觉或听觉上的变化,例如退色,位移等。
14、数据绑定是源属性(source)发生变化时,目的(destination)属性会自动产生变化。
15、flex提供了三种数据绑定的方式。第一种是在mxml中使用{}括号在目的属性中对源属性进行绑定。第二种是在mxml中使用<fx:Binding>标签对源属性与目标属性进行绑定。第三种是在as中使用BindingUtils方法对源属性与目标属性进行绑定。
16、数据绑定符{}可以直接对属性进行引用 ,也可以对方法进行引用。例如:{obj.text.toUperCase()}
17、数据绑定符{}和<fx:Binding>两种方式对数据进行绑定是从编译时就开始的。而BindingUtils即在运行时才开始绑定。
18、可绑定符[]的意思是当对应的属性变化时,会触发数据绑定事件,通知绑定的目标属性。
19、当源对像分发initialize事件以及在源对像变化时都会触发数据绑定事件。
20、如果你创建一个对像,并想让它可以成为数据绑定的源,那属性前面必需加上[Bindable]/[Bindable("eventname")]/[Bindable(event="eventname")]标签。当你直接使用[Bindable]标签时,实质上等价于[Bindable("propertyChange")]。当属性发生改变时,flex会分发propertyChange事件给绑定于此属性的绑定目标对像。
21、通过<fx:Binding>标签或BindingUtils可以把多个源属性绑定到一个目标对像。绑定后,任意一个源发生改变时,目标对像都会被更新。
22、双向绑定,数据的任意一方发生变化时,另一方都会被通知并改变。数据绑定表达式:@{}。数据绑定标签:<fx:Binding source="" distination="destination" twoWay="true" />。另外样式、效果、RPC中的request和arguments对像都不支持双向绑定。
23、使用方法作为数据绑定的源。当方法的参数为[Bindable]时,参数的改变会触发数据绑定事件,让目标属性的值更新为方法的结果。如果方法中没有[Bindable]参数,即目标属性只会在开始时被更新一次。
24、如果你想绑定一个方法作为源数据,但该方法又没有可绑定的参数时可以使用[Bindable(event="evenname")]标签,当该对像分发dispatchEvent(new Event("eventname"))时,绑定到方法的目标属性就会被更新。
25、在类定义的地方便用[Bindable]标签等价于在该类中的所有public属性以及有对应的set/get方法的属性中加上[Bindable]标签。
27、在定义一个属性的地方使用[Bindable]标签的作用是当该属性被替换成另一个值时,目标属性会接收到通知事件,并更新值。这里要注意的是只有被替换时才更新,如果只是该属性中的某个属性被改变的情况,目标对像是不会被更新的。
28、在数组(ArrayCollection)中使用[Bindable]标签时,无论是数组被替换还是数组中的元素改动,都会触发更新事件。
29、如果只绑定数组中的某个元素时,应使用getItemAt()。这样该元素被替换时会触发更新事件去更新目标对像。但如果使用[num]的形式进行绑定时,不会触发更新事件。
30、在数据绑定符({})和数据绑定标签(<fx:Binding>)中,你可以使用as表达式。例如{Number(obj.text)*6/7}和ex4表达式。但不能在BindingUtils.bingProperty()/bindSetter()中使用。
31、as中的方法绑定接口。BindingUtils.bindSetter(funToCall,sourceObj,sourceObj.property):ChangeWatcher。
32、你可以使用ChangeWatcher.watch("sourceobj","sourceobj.property",listener);方法添加一个监听器,当绑定时件触发时,listener会被调用。
33、如果源属性被替换,但被替换的对像与原对像是同一个对像,这种情况下更新更件不会被触发。如果你想自已控制事件触发,你可以在[Bindable("eventname")]中指定事件名,然后在想更新时通过dispatchEvent(new Event("eventname"))的方式触发。
34、数据绑定源中的整个属性链(chain)中的每一个节点都需要[Bindable],如果只有最未端属性是Bindable,那链中的其它层属性被更改时,不会触发更新事件。
35、如果你把对像绑定到dataProvider的话,当你需要改变其中一个对像的一个属性时,你需要以下代码obj.dataprovider.editField(index,"propername","value");这样更新对像才会同时更新到显视组件中。
36、如果你把Array绑定到显视组件中时,该组件只在初始化时更新一次值。初始化后,当Array中的项改变时,不会触发更新。
37、容器提供了一个层次结构让你去布局组件。
38、flex最顶层持容器叫application。
39、flex容器有两种,一种是布局容器(layout container),另一种为导航容器(navigator container)。布局容器用于布局子组件/子容器的大小和位置。导航容器用于多个容器的导航。导航容器只能够到mx容器及spark的NavigatorContent容器。
40、mx组件容器只能存放继承自UIComponent对像的组件,而spark容器可以放下实现IVisualElement接口的组件。IVisualElement在UIComponent对像的继承层次中被实现。
41、mx容器与spark容器的主要区别在于mx组件的布局是固定的,而spark组件的布局是可以被替换的。
42、创建策略(Creation Policy)。创建策略指定了容器对子组件的初始化进程。创建策略有三个选项:ContainerCreationPolicy.AUTO/NONE/ALL。all:开始时初始化所有容器。NONE:不初始化所有子容器。AUTO:子组件在被需要时才创建,例如如果设置了AUTO选项,导航容器中除首页外,其它页的子组件在点击后才会被创建。
43、如果把一个容器的layout属性设为null,即该容器会采用它父容器的布局。
44、初始化事件顺序:preinitialize(自外向内),contentCreationComplete(容器特有,自内向外),initialize(自内向外),cteationComplete(自内向外)。
45、容器中有一个enabled属性,如果该属性设为false,即所有节组件都处于enabled=false状态。

你可能感兴趣的:(扩展flex组件)