您的位置:首页 > 其它

FLEX个人学习点滴

2016-05-26 15:02 288 查看
FLEX个人学习点滴 http://hi.baidu.com/xuleit/blog/item/a1d001e94336c139b80e2d9a.html
2008-10-7 11:35

---------------addEventListener(参数类型,处理函数)---------------

myMenu.addEventListener(MenuEvent.ITEM_CLICK,menuClickHandler);

上边表示把myMenu对象的MenuEvent.ITEM_CLICK事件交给menuClickHandler函数来处理

--------------可以直接定义XML,并将它设置为菜单的内容mx:MenuBar------------

import mx.controls.Alert;        

import mx.events.MenuEvent;

private var mXML:XML =

                <menu label = "系统菜单">

                    <item label="文件">

                        <node label="新建画板" data="new"/>

                        <node label="清除画板" data="clear" enabled="false"/>

                        <node type="separator" />

                        <node label="退出系统" data="logout"/>

                    </item>

                    <item label="帮助">

                         <node label="帮助" data="help"/>

                         <node label="关于作者" data="about"/>

                     </item>

                </menu>;

            

internal function initApp():void{

    //为MenuBar添加数据源

    myMenu.dataProvider = mXML;

    //监听Menu的点击实践

    myMenu.addEventListener(MenuEvent.ITEM_CLICK,menuClickHandler);

}

            

internal function menuClickHandler(evt:MenuEvent):void{

    Alert.show("选择菜单:"+evt.item.@data,"提示信息");

}

<mx:MenuBar labelField="@label" height="30" id="myMenu" width="100%"></mx:MenuBar>

---------------用mx:Model来定义数组,关键词Model、id、item--------------

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" fontSize="12">

    <mx:Model id="myImages">

      <myImage2>

        <item label="图片12" data="images/Baby01.gif"/>

        <item label="图片22" data="images/Baby02.gif"/>

        <item label="图片32" data="images/Baby03.gif"/>

        <item label="图片42" data="images/Baby04.gif"/>

      </myImage2>

    </mx:Model>    

    <mx:List dataProvider="{myImages.item}" itemRenderer="ImageItem" x="41" y="52" height="235" width="130">

    </mx:List>

</mx:Application>

---------------文本有三种方式:TextArea、TextInput、htmlText------------------

<mx:TextArea x="51" y="96" text="文本区" editable="false" width="172" height="48"/>

<mx:TextInput x="51" y="171" text="输入框" displayAsPassword="true"/>

<mx:Text width="253" height="96" x="51" y="226">

    <mx:htmlText>

     <![CDATA[<font color="#0000FF">HTML文本</font> <u>支持html标签</u><img src="images/Baby01.gif"/>...    ]]>

    </mx:htmlText>

</mx:Text>

---------view:PenControl表示view目录下的PenControl.mxml文件中定义的钢笔控制面板:

<mx:Canvas width="100%" height="100%" id="paper">

   <view:PenControl id="control" x="10" y="23" />

   <view:Paper x="203" y="23" id="whitePaper">

   </view:Paper>

</mx:Canvas>

------------------super函数调用EventListener----------------

package bookEvent

{

    import flash.events.Event;

    public class cartEvent extends Event{

        public var isAdd:Boolean;

        public var book:Object;

        function cartEvent(_data:Object,_isAdd:Boolean):void{

            isAdd = _isAdd;

            book = _data;

            

            super("AddBook");

        }

    }

}

super函数将调用预先注册好的EventListener:

internal function initApp():void{

addEventListener("AddBook",AddHandler);

}

---------------------表格实现三要素:DCD-----------------------------------------

表格实现三要素:DataGrid,columns,DataGridColumn

<mx:DataGrid editable="true" id="book_DG" width="100%" height="156" itemEditEnd="checkInfo(event)" rowCount="5" dataProvider="{books.book}">

    <mx:columns>

       <mx:DataGridColumn dataField="name" headerText="书名"/>

       <mx:DataGridColumn dataField="author" headerText="作者"/>

       <mx:DataGridColumn dataField="date" headerText="出版日期" itemEditor="view.dateCell" />

       <mx:DataGridColumn headerText="购买" itemRenderer="view.cartCell" editable="false"/>

    </mx:columns>

</mx:DataGrid>

view.cartCell表示view目录下的cartCell.mxml文件中的内容.

itemEditor定义了当前数据项应该由哪个编辑器来修改它:

<mx:DataGridColumn dataField="date" headerText="出版日期" itemEditor="view.dateCell" />

2008-10-6 16:35

<mx:Move id="myMove" target="{img}" xFrom="50" xTo="350" duration="10000"/>

xFrom、xTo定义了水平移动的起点和终点。

<mx:Style source="style.css" />

mx:Style设置了css文件

Application{

    fontSize:12;

    backgroundGradientColors: #c0c0c0, #c0c0c0

}

模糊效果的blureXFrom和blurXTo定义了模糊效果相对于应用对象的位置。只有当blurXFrom为0或者blurXTo为0时,才有可能看到清晰的文字.

为0表示没有水平模糊偏移.

<mx:Blur id="Effect_Blur" effectEnd="endBlur()"

        blurXFrom="0" blurXTo="30" duration="1500"/>

数组和<mx:Blur的应用:

Effect_Blur.targets = [myPanel];                

//var arr:Array = new Array();

//arr.push(myPanel);

三种擦除效果:

<mx:Iris id= "myIris" effectStart="effectStartHandler()" effectEnd="effectEndHandler()" />

<mx:WipeLeft id= "myWipe" />

<mx:WipeRight id= "myWipe2" repeatCount="2" repeatDelay="500"/>

通过一行多个等于符合可以给多个变量赋值:

<mx:Button label="改变图片" x="37" y="153" click="image.visible = image2.visible= !image.visible"/>

2008-9-25 11:30

ViewStack里边可以放多个Canvas。

ViewStack支持selectedChild属性

2008-9-24 15:37

分析:Tile用来显示列表内容,其中tileHeight,tileWidth用来定义小方格的高和宽:

<mx:Tile id="holder" x="41" y="45" width="330" height="280" horizontalGap="2"

   direction="horizontal" tileHeight="80" tileWidth="80">

//----------可以根据id来显示或者隐藏一个控件-------------下边的win1就是一个id号----

<mx:Script>

    <![CDATA[

        //点击后出发 close 事件,执行该函数

        import mx.controls.Button;

        

        internal function doClose():void{

            txt.text = "关闭按钮被点击了";

            win1.visible = false;

        }

        

        internal function doShow():void{

        win1.visible = true;

        }

    ]]>

</mx:Script>

2008-9-24 13:39

TabNavigator里边多放一个Canvas,上边的标签处就会多一个tab标签

优化flex builder的方法:

preferences => general => workspace

去掉Build automatically和 Refresh automatically前边的勾

<tree:Panel2 x="54" y="24">        

</tree:Panel2>

使用tree可以载入另外一个mxml文件的内容

应用程序放在标签<mx:Application中

2008-9-24 12:55

表单的相关元素:

放在Panel里

Form里边有FormHeading元素定义表单的头

一个FormItem定义一个表单的具体元素,里边包含TextInput元素输入填写内容

按钮放在ControlBar里边,它里边再放入Button

输入验证包含如下几个验证器:

StringValidator

EmailValidator

PhoneNumberValidator

DateValidator

2008-9-23 15:14

flex build去除网上粘贴的代码的前边的行号:

[\d]+{1,2}\.

记住一行一行操作,因为<?xml1.0 这样的也可以被替换。

2008-9-23 14:23

1 flex发布:file => export => Release build

2 CSS的使用

<?xml version="1.0" encoding="utf-8"?> 

    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> 

           

        <mx:Style> 

            Button {   

               color: #ff0000;   

               borderColor: #cccccc;   

               themeColor: #00ff00;   

               fontFamily: Arial;   

              fontSize: 12;   

              fontWeight: normal;   

           }   

           .mylinkButton {   

              rollOverColor: #00ff00;   

              selectionColor: #00ff00;   

              color: #ffff00;   

           }   

       </mx:Style> 

          

       <mx:Button x="10" y="10" label="Button"/> 

       <mx:LinkButton styleName="mylinkButton" label="LinkButton" x="10" y="40"/> 

          

</mx:Application> 

2008-9-18 14:22

1 constraintColumns和constraintColumn定义了<mx:Canvas>的列和列的数量,一个Canvas只能定义一个constraintColumns

<mx:constraintColumns>

<mx:ConstraintColumn

跟html表格不同的是,Canvas的列宽ConstraintColumn可以随意指定,只需要定义好列里边的元素的 width就可以了!

2 constraintRows定义了<mx:Canvas>的列和列的数量,一个Canvas只能定义一个ConstraintRows

<mx:constraintRows>

<mx:ConstraintRow 

3 left和top属性里边可以访问其他别的id里边的位置,例如left="column1:0",表示,左边距为id为column1的元素的0像素的位置。

<mx:Button label="Row 2 Col 1" width="100" left="column1:0" top="row2:0"/>

4 DividedBox定义了分割的区域,相互之间还可以拖动。<mx:Panel定义了其中的一块区域。用起来真是相当棒!!!!

<mx:DividedBox direction="horizontal" width="100%" height="100%">

<mx:Panel title="Panel 1" width="25%" height="100%" backgroundColor="0xCCCCCC">

5 表单用Form、FormHeading、FormItem、TextInput,注意FormItem和TextInput必须成对出现,表示一个输入项。

<mx:Form width="100%" height="100%">

<mx:FormHeading label="Enter values into the form."/>

<mx:FormItem label="First name">

<mx:TextInput id="fname" width="200"/>

6 HBox是水平方向的布局框,H2O就是水的化学分子式嘛.

<mx:ComboBox/>是下拉列表框,下拉列表框的内容用

<mx:Array>

<mx:Object label="请选择性别"/>    

来显示

2008-9-16 13:46

1 用VedioDispaly这个组件加上button来实现视频和mp3的播放

2 RemoteObject是最快速的(相比WebService,httpservice这些数据方式)

3 RO走的是AMF协议

4 trace("My name is " + userName + ".");

这样就可以在flex builder的console视图显示出变量username的值了。

5 监控按下的字符代码:

private function onKeyDown(event:KeyboardEvent):void {

trace("key down: " + event.charCode);

}

6 关闭强类型检测:

trace(5 == 6); // : false

trace(6 == 6); // : true

trace(6 == "6"); // : true

trace(5 == "6"); // : false

默认的工程项目,在运行上面的代码会出错。因为编译器被设置为强类型编译检测。关掉强类

型检测,会把数字型转换为字符型,然后再进行比较。一般不推荐关闭强类型检测,这样可能会

引发一些隐蔽的错误不利于程序稳定。

7 HTTPService组件读取XML产生乱码问题。(Skey)

我是用HTTPService组件读取XML 而我的XML是gb2312的编码 

事后才发现 加一句flash.system.System.useCodePage=true 可以解决乱码问题

8 由于AMF采用二进制编码,这种方式可以高度压缩数据,因此非常适合用来传递大量的资料。数据量越大,Flash Remoting的传输效能就越高,远远超过Web Service

9 定义数组用<mx:Array,定义XML用<mx:XML,定义列表用<mx:List,定义树形菜单用<mx:Tree,相当棒!

10 <mx:Tree的labelField="@label" dataProvider="{myData}",其中dataProvider定义了数据显示来源,labelField利用@来访问每个node的对应属性值,"@label"

11 Accordion是手风琴的意思,菜单会像手风琴那样滑动。

12 tab_menu.selectedIndex = 1;

其中tab_menu是id名,selectedIndex表示当前显示那个菜单。如果值为1,表示显示第二个菜单。id都可以直接访问

13 Canvas是画布的意思,在画布里边的任何组件均可以被放置在任意位置,例如:<mx:ColorPicker,<mx:Label,均可以被放置在画布的任意位置。

14 <mx:VBox是竖向排列的布局组件,<mx:Text text="这里插入内容"用来显示文字内容。 <mx:ComboBox>实现下拉列表框,下拉列表框里边的元素是<mx:Array>。

15 数组使用实例:

<mx:Array>

      <mx:Object label="请选择性别"/>                    

      <mx:Object label="女"/>

      <mx:Object label="男"/>

</mx:Array>

16 Panel也是布局组件,翻译为面板。

<mx:Panel title="内嵌的Panel" label="Item 3" width="90%" height="90%">

17 画布、VBox、Panel均可以直接放在Accordion里边,实现一个手风琴的按钮。

-----------------MovieClip有play,stop,和gotoAndStop方法----------------------------

下面的代码指示名为 shortFilm 的 MovieClip 开始播放:

shortFilm.play();

下面的代码行使名为 shortFilm 的 MovieClip 停止播放(播放头停在原地,就像暂停播放

视频一样):

shortFilm.stop();

下面的代码使名为 shortFilm 的 MovieClip 将其播放头移到第 1 帧,然后停止播放(就像

后退视频一样):

shortFilm.gotoAndStop(1);

-----------------数字应该调用toString()方法来显示在文本字段中:----------------------------

var numericData:Number = 9;

var textData:String = numericData.toString();

例如,如果希望在屏幕上的文本字段中显示 Number 变量的值,应使用 toString() 方法。

TextField 类的 text 属性(表示实际在屏幕上显示的文本内容)被定义为 String,所以它

只能包含文本值。下面的一行代码将变量 numericData 中的数值转换为文本,然后使这些文

本显示在屏幕上名为 calculatorDisplay 的 TextField 对象中:

calculatorDisplay.text = numericData.toString();

----------------先定义响应函数,再用addEventListener绑定响应函数---------------------------

function eventResponse(eventObject:EventType):void

{

// 此处是为响应事件而执行的动作。

}

eventSource.addEventListener(EventType.EVENT_NAME, eventResponse);

此代码执行两个操作。首先,定义一个函数,这是指定为响应事件而要执行的动作的方法。接

下来,调用源对象的 addEventListener() 方法,实际上就是为指定事件“订阅”该函数,

程序员实际编写的代码如下所示:

function eventResponse(event:MouseEvent):void

{

// 此处是为响应事件而执行的动作。

}

myButton.addEventListener(MouseEvent.CLICK, eventResponse);

2008-10-14

------------脚本标识---------------

<mx:Script>

-----------导入相关包--------------

import mx.rpc.events.ResultEvent; //WEB请求结果处理包

import mx.rpc.events.FaultEvent; //WEB请求失败后的处理包

import mx.controls.Alert;         //弹出信息框

--------函数的返回类型也用冒号-----

public function handleXML(event:ResultEvent):void

这里():void表示该函数不返回任何变量

--声明变量直接用var,用:来指定类型--

private var shippingInfo:XMLList;

-------------文本输入框------------

<mx:TextInput 

---------------按钮----------------

<mx:Button

---------------表格----------------

<mx:DataGrid

-------------表格的列--------------

<mx:columns>

------------表格的列头-------------

<mx:DataGridColumn headerText="Service" 

-------------文本标签--------------

<mx:Label

-----x表示离最左边有多远,y表示离最顶端有多远-----

<mx:Label x="400" y="32" 

x表示水平左边距,y表示垂直上边距

-----------HTTPService描述web请求-----------------

<mx:HTTPService result="handleXML(event);" fault="handleFault(event);" id="xmlRPC" resultFormat="e4x"

        url="http://examples.adobe.com/flex3app/flex3samples/exchangingdata/xml/xmlHttpService.jsp" useProxy="false">

result设置结果处理函数,fault设置错误处理函数,resultFormat="e4x"设置返回的xml格式,url定义访问地址

注意:函数声明时需要指定形参的类型,但是函数调用的时候不用指定

-----------request描述web请求的参数和参数值-------

<mx:request xmlns="">

<zipcode>{zipcode.text}</zipcode>

----------类型转换用as----------------------------

hippingInfo = event.result.option as XMLList;

这里as表示类型转换
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: