posts - 17, comments - 4, trackbacks - 0, articles - 0
  BlogJava :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理

[原]自定义组件的属性与事件

Posted on 2007-08-28 12:07 愚人 阅读(208) 评论(0)  编辑  收藏 所属分类: Flex2
在开发Flex程序后经常会使用到自定义组件，通过设置它的属性来初始化一些值，最经常用到的就是自定义事件与属性了，当然还有方法。对于自定义事件可以在元数据标签中加入[Event(name="Login", type="flash.events.Event")]声明一个组件的事件，既然声明了肯定就有一个能够用来触发的事件，使用dispatchEvent(new Event("Login"))来分发时间。对于属性直接声明一个公有的属性即可，方法也是一样。

 1<?xml version="1.0" encoding="utf-8"?>
 2<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="275" height="150" title="untitled">
           <!-- 使用原数据标签声明一个事件Login，类型为flash.events.Event -->
 3    <mx:Metadata>
 4        [Event(name="Login", type="flash.events.Event")]
 5    </mx:Metadata>
 6    <mx:Script>
 7        <![CDATA[
                  //声明为public属性之后，就变成了组件的公有属性了
 8            [Bindable]
 9            public var upitem:String="";
10            [Bindable]
11            public var downitem:String="";
12            [Bindable]
13            public var eafterclk:Boolean = false ;
14            private function handleLoginEvent():void
15            {
16                txtUID.editable = eafterclk ;
17                txtPwd.editable = eafterclk ;
18                lblTest.htmlText = "<b>logging in</b>" ;
19                //分发事件Login
20                dispatchEvent(new Event("Login"));
21            }
22        ]]>
23    </mx:Script>
24    <mx:Model id="login">
25        <user>
26            <name>{txtUID.text}</name>
27            <password>{txtPwd.text}</password>
28        </user>
29    </mx:Model>
30    <mx:Label x="10" y="12" text="{upitem}"/>
31    <mx:Label x="10" y="42" text="{downitem}"/>
32    <mx:TextInput x="74" y="10" id="txtUID"/>
33    <mx:TextInput x="74" y="40" id="txtPwd" displayAsPassword="true"/>
34    <mx:Button x="178" y="70" label="Login" click="handleLoginEvent()"/>    
35    <mx:Label x="74" y="72" id="lblTest"/>
36</mx:Panel>





 1<?xml version="1.0" encoding="utf-8"?>
 2<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" backgroundGradientColors="[#804000, #ffffff]" xmlns:ns1="*">
 3    <mx:states>
 4        <mx:State name="t">
 5            <mx:RemoveChild target="{user}"/>
 6            <mx:AddChild position="lastChild">
 7                <mx:ProgressBar maximum="100" minimum="0" enabled="true" labelPlacement="center" horizontalCenter="0" verticalCenter="0"/>
 8            </mx:AddChild>
 9            <mx:AddChild position="lastChild">
10                <mx:HBox width="195" right="2" top="2">
11                    <mx:Image right="84" top="10" source="file:///D|/www/images/icon_acct_active.gif"/>
12                    <mx:Label text="Welcome,{user.login.name}" color="#ffffff" right="22" top="10"/>
13                </mx:HBox>
14            </mx:AddChild>
15        </mx:State>
16    </mx:states>
17    <mx:Script>
18        <![CDATA[
19            import mx.controls.Alert ;
20            public function login():void{
21                if( user.login.name == "Fisher" )
22                {
23                    //Alert.show("User:"+user.login.name+"\n\nPass:******","Login");
24                    this.currentState = "t";
25                }
26            }
27        ]]>
28    </mx:Script>
29    <ns1:LoginBox title="LOGIN" upitem="Username" eafterclk="true" downitem="Password" id="user" y="181" horizontalCenter="0" Login="login()">
30    </ns1:LoginBox>
31    
32</mx:Application>

只有注册用户登录后才能发表评论。
网站导航: