FLEX学习笔记

一、PopUpManger 是专门处理弹出窗口的对象。
1、addpopup(被弹出的窗口，其父对象(如this),model(true/fasle 是否让父对象失去交互能力）
其下的 popupbutton 这个按钮的弹出的内容要用 new 弹出的对象
2、popupmenubutton,指定datapriva时，内容为XML时，要加上 showRoot="false"
菜单的事件为 item.click 可用 evt.label来接收选择的菜单名称。

二、导航控件的子级元素必须是容器类

三、ViewStack每次只有一个容器是可见的，需要用AS来控件切换里面的容器。用 vew_1.selectchild=xxx哪个容器

四、表单验证
<mx:stringvalidator source={文本控件} property="text" ...../>

五、ComBox控件的弹出或收回，都会分派 DropdownEvent 的OPEN和CLOSE事件

六、可以用来作为itemRender的组件有一个共同的特点，那就是拥有一个名为 data 的属性，FLEX是通过"data"属性将数据传递给 itemRender的。

七、Alert组件
alert.show(文本，标题，ALERT.YES|ALERT.NO,窗口居中的参照对象(this),关闭后的函数用于捕捉用户选择，图标，默认选择的按钮）
其接受的事件是 CloseEvent

八、DataGrid自定义 itemrenderer 步骤[]
1、创建一个自定义组件 mx:checkbox，并定义一个函数用于状态改变时，向外派发事件。
2、自定义控件中的函数用 this.parentapplication.dispatchevent(new 自定义的事件(data,chk.selected)
parentapplication. [指向应用程序的application]
3、自定义事件 cartEvent()
cartEvent:Event{
定义要让事件接收者要接收的变量var1，变量var2
function 构造函数(_data:object,_isvar2):void{
var1=_data;
var2=_isvar;
super("事件名") -------- 事件的名称
}
在其构造函数中，定义了参数，参数赋给事件的变量，当接收函数接收这个事件时就可以访问事件中定义的变量了

4、在主程序中的initApp()中监听事件
addEventListener("事件名",处理函数）

5、在处理函数中接收 evt中的变量并处理
evt.var1

另一种方法：
直接在DataGrid的列下定义
<mx:itemRenderer>
<mx:Component>
<mx:LinkButton 内部控件 click="outerDocument.buttonDel()">
//调用外部的函数，必须用 outerDocument
<<mx:Component>
</mx:itemRenderer>

示例：
// Define event listener for the itemEditEnd event.
private function getCellInfo(event:DataGridEvent):void {

// Get the cell editor and cast it to TextInput.
var myEditor:TextInput =
TextInput(event.currentTarget.itemEditorInstance);

// Get the new value from the editor.
var newVal:String = myEditor.text;

// Get the old value.
var oldVal:String =
event.currentTarget.editedItemRenderer.data[event.dataField];

// Write out the cell coordinates, new value,
// and old value to the TextArea control.
cellInfo.text = "cell edited./n";
cellInfo.text += "Row, column: " + event.rowIndex + ", " +
event.columnIndex + "/n";
cellInfo.text += "New value: " + newVal + "/n";
cellInfo.text += "Old value: " + oldVal;
}

7、DataGrid的选择项可由 selectitem.data 得到后面加上 selectedItem.data.字段名。可得到此字段的值
datagrid 的 dataprovider 可由xmllistcollection 得到

var data_xml:XMLListCollection=dg_szjz.dataProvider as XMLListCollection;
var data_array:Array=data_xml.toArray();
var data_myarray:ArrayCollection=new ArrayCollection(data_array)

DataGrid绑定 data_myarray 用这个
dg_datasource=DataUtil.xmltoarray(myxmla);
dg_szjz.dataProvider=dg_datasource.source[0].data;

九、dataGrid编辑功能的实现
1、在dataGrid定义中添加事件声明 itemeditend=函数名(event)

2、完成事件代码
chkinfo(evt:DatagridEvent
{
if (evt.reason==DataGridEventReason.CANCELLED){
return}
if (evt.dataField=="date"){
evt.preventDefault();
bg.editedItemRender.data.date=dateCell(DataGrid(evt.target).itemEditorInstance).num_year.value;
bg.destroyItemEditor();
bg.dataProfider.itemUpdataed(evt.itemRenderer.data);
}
}

十、设置字体
@font-face{
src:local("Arial");或者 src:url("./arial.swf")
fontFamily:myFont; 别名
fontyle:normal;
fontweight:normal;
flashtype:true} -------抗锯齿

十一、访问 xmllist的子节点值，在名称前要加 @，如访问菜单 evt.item@data
XMLLIST是多个XML数据的集合，根节点被忽略，ITEM节点被解析为独立的XML数据,item节点必须有一个根节点。
过滤 var myxml:XMLList=menuxml.children().(@name=="Ö÷±ä").children();

十二、colorPicker取得的seleceedcolor值可以直接使用

十三、动画并行和串行效果
1、定义并行 定义串行
<mx:parallel id="xxx"> <mx:sequence>
动画1
动画2
</mx:parallel>

2、使用 同并行
xxx.play()

十四、state使用及过渡动画
在window--->state 中创建，另：动画效果必须用在容器上，才能实现。

十五、拖曳事件
1、在initApp()中对被拖的控件添加 dragevent.drag_enter,dragevent.drag_drop 分别注册事件函数，对拖的控件注册鼠标事件函数

2、在被拖的控件中的鼠标事件函数中
1> 得到拖曳的对象
var tg:image =image(evt.currentTarget);
2>创建拖曳的数据源
var ds:dragsource=new dragsource();
ds.add(object,"名称)
3>创建拖曳时显示的内容
var imgpxy=new imge();
imgpxy.source=xxxx
imgpxy.width=12
imgpxy.height=12;
4>开始拖曳
dragmanager.dodrag(被拖的对象，数据源，此函数所属鼠标事件[如evt],拖曳时显示的对象）

5>定义进入拖曳对象的函数 [用于响应dragevent.drag_enter]
enterhandel(evt:dragevent)
if (event.dragSource.hasFormat("img"))
{
DragManager.acceptDragDrop(Canvas(event.currentTarget));
}
-----------------将原来不允许目标拖曳的属性设为TRUE

}

6>处理鼠标入下后的事件
drophandler{
var obj:object =evt.dragsource.dataforformat("名称")；
......处理函数.........
}

[注意：被拖曳的容器一定要设样式，设BoardStyle和BoardColor也亦，设空的样式名称也行]

十六、[Bindable] 主要用于绑定已经存在着组件和对象。
1、变量级别的绑定，放在变量前，只要变量值发生变化，会引起使用它的控件更新
2、函数级别的绑定，函数必须是通过 setter 和 getter 方式定义的
在大括号中使用函数，函数的参数必须支持绑定，否则绑定不起作用
3、对象级别的绑定，用在公有类之前，此类的所有公有变量，都可以用于绑定。

bindproperty 绑定不存在的对象

绑定出现问题有3种情况
1、数据源没有被子更改。如拼写错误或数据误操作
2、绑定事件未派发出去
3、目标对象没有收到资料，所以也无法更新了。

十七、XML的操作
1、. 和 .. 可以直接访问XML对象的子节点
2、@ 访问某一节点的属性

十八、使用 HttpService 通讯
1、发送消息
<mx:HTTPService id="srv" url="list.php" method="GET" />

<mx:request>
<aaa>{xxxxx}</aaa>
<bbb>{zzzzz}</bbb>
</mx:request>
</mx:HTTPService>

或者：

var par:object=new object);
par.aaa="xxxxx";
par.bbb="zzzz";
src.send(par);

示例：
initialize="sdk.send();"
<mx:HTTPService id="charts" url="charts_explorer.xml" resultFormat="e4x" result="chartsLoaded();" fault="populateTree()" />
private function chartsLoaded():void
{
explorerTree.appendChild(charts.lastResult.node);
populateTree()
}

//we don't use data binding because the timing of the charts loading can be off
private function populateTree():void
{
compLibTree.dataProvider = explorerTree;
}

var data_xml:XMLListCollection=dg_szjz.dataProvider as XMLListCollection;

2、接收消息
当收到服务器端的数据时，evt:resultEvent 会被触发，失败会触发 evt:faultEvent
返回的数据会存放在 resultEvent 的 result 中，类型为 Object,如果是XML格式，会解析成树形结构的对象，可以直接读取了。

resultFormat默认的值是OBJECT，可选格式还有 text

如果是用AS方法则写法如下：
1> 定义 HttpService 对象
var httpser:HttpService=new HttpService();

2> 设置要读取的外部文件的路径，添加事件监听
httpser.usr="http://xxxx/a.asp"

3>定义其使用的方法
httpser.method="POST"

4>为其定义成功，失败监听事件
httpser.addeventListenner("result",resultHandelr); //事件为 ResultEVENT
httpser.addeventListenner("fault",failHandelr); //事件为 FailEvent

5>为其定义参数
var par:object=new object);
par.aaa="xxxxx";
par.bbb="zzzz";
src.send(par);

6>在监听函数中用 evt.result得到返回值，如果返回值想转换成OBJ，直接将XML文件传过去就OK了
employeesService.removeEventListener(ResultEvent.RESULT,resultHandler);
employeesService.addEventListener(ResultEvent.RESULT,insertItemHandler);
employeesService.method = "POST";
params = {"method": "InsertEmployee", "id": NaN, "firstName": inputFirst.text,
"lastName": inputLast.text, "officePhone": inputPhone.text};
employeesService.cancel();
employeesService.send(params);

var xmllist:XMLList=XMLList(xmla)
var myxmllist:XMLListCollection=new XMLListCollection(xmllist);
var data_array:Array=myxmllist.toArray();
var data_myarray:ArrayCollection=new ArrayCollection(data_array)

7、在客户端对用户转入的参数进行解析，分别执行增，删，改

十九、WEBSERVICE
1、定义请求
<mx:WebService
id="userRequest"
wsdl="http://localhost:8500/flexapp/returnusers.cfc?wsdl">

<mx:operation name="returnRecords" resultFormat="object"
fault="mx.controls.Alert.show(event.fault.faultString)"
result="remotingCFCHandler(event)"/>
<mx:operation name="insertRecord" result="insertCFCHandler()"
fault="mx.controls.Alert.show(event.fault.faultString)"/>
<mx:request>
<aa>{aa}</aa>
<bb>{bb}</bb>
</mx:request>
</mx:operation>
</mx:WebService>
2、发送请求
ws.函数名.send()

3、接收请求
返回的数据会存放在 resultEvent 的 result 中,类型为 Object,如果是XML格式，会解析成树形结构的对象，可以直接读取了。

客户端传过来的VO类在JAVA中被转换成MAP类型
服务器返回的HashMap类型被自动转换成 ArrayCollection类型。其无法参与数据绑定，需转换成VO的类型。如
for (var i:* in obj)
{
this=obj[i]
}

AS3 支持不定个数的参数传递 用 ...参数就可以了,在静态函数中，只能访问类的静态变量和静态函数，而无法访问类的成员变量和成员函数。因为成员变量和函数只存在于类的实例中。
dotest(s:string,... rest){
for (var i=1 ;i<rest.lenght;i++){
trace(reset[i])
}
数组的push可以传二维进去
myarr.push(["jyrq",str_date])

如果是用AS方法则写法如下：
1> 定义 webservice 对象
2>指定其wsdl属性
3>调用其方法 loadwsdl() [亦可直接用 loadwsd("xxx.asmx?wsdl")]
4>注册其成功与失败函数 [同 HttpService]
5>ws.函数名(参数1，参数2)
当参数1，为一实体类时，。NET会接收成什么啊？
6> 在监听函数中用 evt.result得到返回值

接收过来的值要用 XML()进行转化 用 as 是不行的，会报错
var myxml:XML=new XML()
myxml=XML(evt.result) ;

二十、读取服务器文本文件，XML
var urlload :urlloader();
urlload.dataFormat=dataformat.varlables; -------------data为ojbect型
urload.load(new urlrequest("xxx.txt"))

调用 load（）方法后，flash会读取URL的数据填充urlloader.data.完成后会发出 complete事件，此时设定处理函数来处理。loader.addeventlistener(Event.COMPLETE,处理函数)

处理函数写法
var loader:URLLoader=URLLoader(evt.target);
for (var i:string in loader.data)
{
xx=loader.data[i]
}
或者
function xmlLoaded(evtObj:Event){
myXML=XML(myLoader.data); 或者 var dataXML:XML = XML(event.target.data);

trace("数据装载完成.");
trace(myXML);
}

----如果知道名称，可以直接用
load.data.变量名

XML的读取直接设置 dataformat .Text ------------------ data为 string 类型
XMLLIST可以累加的
var xList:XMLList =myxml2.children()+myxml3.children()+myxml;

二十一、ShareObject
1、创建或打开共享对象
var exp:SharedObject =new ShareObject.getLocal("expm");

2、添加数据到LSO上
exp.data.变量="xxxx"

3、保存LSO到客户机上
var aa:string=exp.flush()
该方法出错可throw,但 shareobjectflashstatus.pending[即本机空间不够]和.flushed[用户没分配本地空间]不会抛出需判断
try{
}

4、从共享对象中读取数据
前提是打开了共享对象
if (exp.data.previouslyviewed) ---------如果是第一次读
else
{
exp.data.previouslyviewed=true
exp.flush();
}

5、删除整个共享对象
前提是打开了共享对象
exp.clear();

二十二、MENUBAR
如果只要显示一项用 <menu label="xx"> 其下是子节点就可以了
如果显示多个，则要用 xmllist ，最前最后要用 <> 和 </>
得到单击事件
if (event.item.@data != "top") {
Alert.show("Label: " + event.item.@label

二十三、自定义格式化字符串

1、要导入 Formatter和SwitchSymbolFormatter类
2、类要继承于 Formatter
3、类的构造函数中要调用 super()
4、覆盖 override format()方法

使用
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:MyComp="*">

<!-- Declare a formatter and specify formatting properties. -->

<MyComp:SimpleFormatter id="upperFormat" myFormatString="upper" />
<!-- Trigger the formatter while populating a string with data. -->
<mx:TextInput id="myTI" />

<mx:TextArea text="Your uppercase string is {upperFormat.format(myTI.text)}" />

</mx:Application>

二十四、自定义校验
1、定义
1> 导入.Validator 类的 validator 和 ValidationResult
2> 类要继承于 Validator
3> 类中定义一个数组供 doValidation()返回数组值 private var results:Array;
4> 构造函数中调用 super();
5> 覆盖 override doValidation():Array 方法
并定义如下代码:
var fName:String = value.first;
var mName:String = value.middle;
var lName:String = value.last;

// 清除返回数组
results = [];

// 用父类产生的结果填充返回数组，如果父类调用的长度>0 ,就返回错误。
results = super.doValidation(value);
if (results.length > 0) return results;

// 进行自己的判断。如果有错误，就用 push 压入数组。
// Check first name field.
if (fName == "" || fName == null) {
results.push(new ValidationResult(true,
"first", "noFirstName", "No First Name."));
return results;
}

// Check middle name field.
if (mName == "" || mName == null) {
results.push(new ValidationResult(true,
"middle", "noMiddleName", "No Middle Name."));
return results;
}

说明：ValidationResult说明如下：
ValidationResult(isError:Boolean, subField:String = "", errorCode:String = "", errorMessage:String = "")
results.push(new ValidationResult(true, null, "tooYoung", "You must be 18."));

2> 使用
MyComp:NameValidator id="nameVal"
source="{person}" property="custName"
listener="{firstInput}"/>

<mx:Button label="Validate" click="nameVal.validate();"/>

3>可以取代默认事件。
<mx:Validator id="reqValid" required="true"
source="{fname}" property="text"
valid="handleValid(event)" invalid="handleValid(event)"/>

private function handleValid(eventObj:ValidationResultEvent):void {
if(eventObj.type==ValidationResultEvent.VALID)
。。。。。。。。。
else
submitButton.enabled = false;
}

二十五、DataGrid过滤及排序
过滤在弹出窗口的回调函数中指定，arraycollection的filterfunc就可以了，此函数会循环DATAGRID的每一条记录，看是否返回满足条件，如果代码返回TRUE就表示满足过滤的条件

二十六、为自定义组件添加属性
[Inspectable(defaultValue="请在此指定图片")]
public function set img_source(val:String):void {
str_img = val;
}
如果要得到属性定义一个 get 函数即可。

二十七、回调函数用法
回调函数用于一个窗口向另一个窗口传值。所以首先要将A窗口传给B窗口定义的一个 object对象，
使用步骤：
1、在被调用的窗口中声明。要传递的
public var mainApp:Object = null;
public var callbackFunction:Function;
//调用父窗体的方法并以参数形式返回选择结果
callbackFunction.call(mainApp,str_chk);

2、调用窗口
msg.mainApp=this;
msg.callbackFunction = this.userchoose;

二十八、ArrayCollection 中的记录发生改变时会触发CollectionEvent 事件.CollectionEventKind.ADD:等可以知道事件类型。如addItem等
这对数据源用数组绑定的很有用处。

二十九、Romoting与ASP.NET通讯
1、安装vs2005,flex3,fluorine
2、在VS2005新建 fluorine网站。
如果网站以后变动了位置，在项目的flex properties 在弹出的界面中左侧选择 “Flex Server”
修改右边的Root folder 和Root URL， 左侧选择 “Flex Build Path” 修改右边的 Output folder
3、.打开Flex 3，File-->New-->Flex Proje )，
Server technology 的Application Server Type选择CodeFusion之CodeFusion Flash Remoting，
在最后一步的“Output Folder”项， 将其指向.Net项目所在的文件夹下的“Flex”文件夹（如果不存在，创建它），单击 Finish

三十、用MX:filter指定的滤镜要放在组件之内，否则会影响整个程序。

三十一、使用自定义光标
1、嵌入准备做光标的图片
[Embed(source="assets/hourglass.swf")]
public var HourGlassAnimation:Class;

2、添加光标
CursorManager.setCursor(HourGlassAnimation);

3、删除光标
CursorManager.setCursor(HourGlassAnimation);

三十二、类当参数传递的方法
private static var DEFAULT_TOOL:Class = LineTool;
LineTool 必须派生于 DrawingTool ,以便生成时有个类型撒
createTool(className:Class,event:MouseEvent):DrawingTool
var newClass:DrawingTool = new className();

三十三、springgraph 用法
1、声明引用自定义控件
xmlns:fc="com.adobe.flex.extras.controls.springgraph.*"

2、定义gp用于画图
private var gp: Graph = new Graph();

3、设计界面加入主控件SpringGraph
<fc:SpringGraph id="s" itemRenderer="control.btnimg_see">
并在 itemRenderer 中设定要画线的控件.
或用：
<fc:itemRenderer>
<mx:Component>
<mx:VBox backgroundAlpha="0.3" backgroundColor="0x444444"
paddingBottom="5" paddingLeft="5" paddingRight="5" paddingTop="5">
<mx:Label text="{data.id}" fontSize="{outerDocument.fontSizeSlider.value}" color="0xffffff" textAlign="center"/>
</mx:VBox>
</mx:Component>
</fc:itemRenderer>

4、在按钮中生成新的item供加入.
private function newItem(name,title,x,y): void {
var item: Item = new Item(new Number(++ic).toString());
item.name = name;
item.title = title;
item.x = x;
item.y = y;
gp.add(item);
prevItem = item;
s.dataProvider = gp;
}

6、定义画线方法，去线方法
添加链接线
private function linkItems(fromId: String, toId: String): void {
var fromItem: Item = gp.find(fromId);
var toItem: Item = gp.find(toId);
gp.link(fromItem, toItem);
s.dataProvider = gp;
}
取消链线
private function unlinkItems(fromId: String, toId: String): void {
var fromItem: Item = gp.find(fromId);
var toItem: Item = gp.find(toId);
gp.unlink(fromItem, toItem);
s.dataProvider = gp;
}
删除要链线的对象，其线也会消失。
public function removeItem(id : String) : void {
var item : Item = gp.find(id);
gp.remove(item);
s.dataProvider = gp;
}

7、在合适的事件中画线
s.listenDrawLine();
s.addEventListener(MouseEvent.CLICK,mouseDownListener);

8、进行处理。
private function mouseDownListener(e:MouseEvent):void
{
try {
if(e.target.parent is Image) {
if(pos==1) {
arr[pos] = e.target.parent.name;
Alert.show("È·ÈÏÁ¬Ïߣ¿","Ìáʾ",3,null,check,null,Alert.YES);
[i]//CursorManager.removeCursor(cid);
}
else {

arr[pos] = e.target.parent.name;
pos ++;
}
}
}
catch(e) {}
}

private function check(e: CloseEvent) : void {
if(e.detail == Alert.YES) {
linkItems(arr[0],arr[1]);
}
pos = 0;
s.removeEventListener(MouseEvent.CLICK,mouseDownListener);
s.restoreLink();
}

三十三、brokenImageSkin
图片无法加载时显示的图片
<mx:Style>
Image {
brokenImageSkin: Embed("assets/flex_logo.jpg");
}
</mx:Style>

三十四、Ti
leList 中的数据源必须用 <mx:Model id 来加载 xml文件