这里演示一个完整的例子,
示例说明:一个简单的用户登录,在登录的时候做一些常见的判断,然后提示用户当前登录情况
1、新建工程
2、新建类,自定义事件,并且在类中声明变量用于存放用户名密码
package com.anmo
{
import flash.events.Event;
/**
* 此类用于存放用户名和密码
*/
public class LoginFormEvent extends Event
{
public var name:String = "";
public var password:String = "";
public function LoginFormEvent(type:String)
{
super(type, false, false);
}
}
}
3、新建组件,就是将类库中已经有的控件组合成一个新的组件,比如组合成一个登陆的表单
new -> MXML Component -> 输入名称(LoginForm),并且选择从panel继承 -> finish
然后向组件中拖入label、文本框和按钮,取好名字,保存后会再components中的custom下面就会多了一个LoginForm控件,然后将空间拖到页面中
用MXML标签向LoginForm中添加事件:事件的名称是什么,类型是什么
<mx:Metadata>
[EVENT(name="loginEvent",type="com.anmo.LoginFormEvent")]
</mx:Metadata>
在LoginForm中为点击按钮时注册事件流
<mx:Script>
<![CDATA[
import com.anmo.LoginFormEvent;
//定义鼠标单击事件,将用户名、密码带着发送了出去
internal function onClick(evt:MouseEvent):void{
var e:LoginFormEvent = new LoginFormEvent("loginEvent");
e.name = txt_username.text;
e.password = txt_password.text;
dispatchEvent(e);
}
]]>
</mx:Script>
然后将事件添加到按钮中,和HTML添加方式一样click="onClick(event)"
4、现在当点击按钮时会发送事件,并且带上用户名、密码,但是没有地方接收,所以要在主页面中接收
<ns1:LoginForm x="256" y="87" id="loginForm" loginEvent="login(event)">
</ns1:LoginForm>
//loginEvent="login(event)"等同于loginForm.addEventListerner("loginEvent",login)
login方法的代码:
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import com.anmo.LoginFormEvent;
//响应事件,在方法中接收发送的用户名、密码
internal function login(evt:LoginFormEvent):void{
if(evt.name == "anmo" && evt.password == "admin"){
Alert.show("你已经成功登陆","提示");
}else{
Alert.show("对不起,输入的信息有误","提示");
}
}
]]>
</mx:Script>
———————————————————————————————————————————————————————————
下面是全代码:
主页面:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:ns1="*">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import com.anmo.LoginFormEvent;
//响应事件,在方法中接收发送的用户名、密码
internal function login(evt:LoginFormEvent):void{
if(evt.name == "anmo" && evt.password == "admin"){
Alert.show("你已经成功登陆","提示");
}else{
Alert.show("对不起,输入的信息有误","提示");
}
}
]]>
</mx:Script>
<ns1:LoginForm x="256" y="87" id="loginForm" loginEvent="login(event)">
</ns1:LoginForm>
</mx:Application>
LoginForm组件:
<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="400" height="200" borderColor="#5DD8F2" title="用户登录" fontSize="12">
<mx:Metadata>
[Event(name="loginEvent",type="com.anmo.LoginFormEvent")]
</mx:Metadata>
<mx:Script>
<![CDATA[
import com.anmo.LoginFormEvent;
//定义鼠标单击事件,将用户名、密码带着发送了出去
internal function onClick(evt:MouseEvent):void{
var e:LoginFormEvent = new LoginFormEvent("loginEvent");
e.name = txt_username.text;
e.password = txt_password.text;
dispatchEvent(e);
}
]]>
</mx:Script>
<mx:Label x="72" y="36" text="用户名:" fontSize="12" fontWeight="bold"/>
<mx:Label x="72" y="82" text="密 码:" fontWeight="bold" fontSize="12"/>
<mx:TextInput x="146" y="34" id="txt_username"/>
<mx:TextInput x="146" y="80" id="txt_password" displayAsPassword="true"/>
<mx:Button x="158" y="126" label="登 录" id="btn_submit" fontWeight="bold"
fontSize="12" click="onClick(event)"/>
</mx:Panel>
自定义事件类:LoginFormEvent
package com.anmo
{
import flash.events.Event;
/**
* 此类用于存放用户名和密码
*/
public class LoginFormEvent extends Event
{
public var name:String = "";
public var password:String = "";
public function LoginFormEvent(type:String)
{
super(type, false, false);
}
}
}
分享到:
相关推荐
总的来说,Flex项目由MXML和ActionScript协同完成,MXML负责界面展示,ActionScript负责逻辑处理。命名空间作为类的组织方式,避免了类名冲突。掌握MXML的基础知识,对于高效开发Flex应用至关重要。通过深入学习和...
XML(eXtensible Markup Language)是一种用于标记数据的语言,广泛应用在互联网上,用于存储和传输结构化数据。本文将详细介绍基于C语言...对于需要处理XML数据的C程序员来说,掌握Minixml是提高开发效率的有效途径。
在Flex3项目开发中,随着项目规模的扩大,MXML文件内的`<mx:script>`区域逐渐充斥着各种事件处理、业务逻辑等代码,这不仅使得MXML文件变得庞大难于管理,还增加了定位特定代码片段的难度。为了解决这一问题,开发者...
事件监听器是处理事件的方法;事件流描述了事件从源传播到目标的路径。 2. **事件类型** Flex中有多种内置事件类型,如`MouseEvent`(鼠标事件)、`KeyboardEvent`(键盘事件)、`FocusEvent`(焦点事件)和`...
有两种方法可以关联按钮单击事件与监听器:一种是在MXML标签中直接指定`click`属性,另一种是使用ActionScript编写事件处理函数。 - **TextInput与Label控件**:文档展示了如何使用`TextInput`控件接收用户输入,...
通常,我们使用 `<mx:Application>` 标签来创建应用程序,但如果使用ActionScript创建,建议避免在构造函数中创建组件,而是放在`createChildren()`函数中,以优化性能。 Flex的SWF文件包含两帧:第一帧包含了...
使用mxml.vim,VIM将能够识别MXML标签,提供相应的语法高亮,并可能包含对XML属性的补全功能,提升开发效率。 接下来,设置VIM的工作环境。这通常涉及配置.vimrc文件,这是一个存放VIM个性化设置的文本文件。在....
4. **编写ActionScript和MXML代码:** 将ActionScript代码嵌入MXML文件中可以更方便地处理事件和数据。例如,使用`<mx:Script>`标签在MXML文件内编写ActionScript代码。 5. **创建函数声明:** 在ActionScript中定义...
- **定义**:除了直接标记变量外,还可以通过结合使用 getter 和 setter 方法来增强 `[Bindable]` 标签的功能。这种方式可以更加灵活地控制数据的访问和修改行为,并且可以在数据更改前后执行额外的操作。 - **用途*...
总之,使用FLEX和ACTIONSCRIPT开发FLASH游戏,你需要掌握MXML和ACTIONSCRIPT的结合使用,理解事件处理机制,以及如何处理图形和动画。随着系列教程的深入,你将逐步学习如何构建游戏逻辑、处理用户输入、实现物理...
MXML用于定义界面结构,而ActionScript负责处理事件、业务逻辑和数据操作。例如,一个 `<mx:Button>` 标签在MXML中定义了一个按钮,而相应的ActionScript代码可以创建按钮实例,设置其属性和响应事件。 MXML文件...
- **ActionScript**:这种脚本语言用来处理事件和应用程序的逻辑控制。它可以在 MXML 文件内的 `<mx:Script>` 标签中嵌入。 - **MXML 与 ActionScript 的联系**: - 例如,下面的 MXML 代码和 ActionScript 代码...
- MXML文件中的`<mx:Script>`标签使用 - ActionScript在MXML之外的独立应用限制 - 循环、函数定义与条件语句的实现方式 - 创建组件与类的方法 - 添加事件监听器 - 编写ActionScript与MXML代码的最佳实践 - ...
在Flex4中,我们可以使用Spark容器(如VGroup或HGroup)来组织组件,并通过ActionScript或MXML绑定事件处理函数来实现窗口的拖动功能。窗口的最大化、最小化和关闭按钮通常作为子组件添加到窗口中,这在后面几个文件...
在MXML中,可以通过动作标签或事件处理函数与ActionScript代码进行交互。例如,上面的按钮点击事件处理函数可能是这样的: ```actionscript private function handleClick(event:Event):void { trace("按钮被点击...
在提供的代码段中,我们看到`mx:Application`包含了事件监听器和控件,如`FileReference`,用于处理文件选择、上传进度和完成事件。 - `Security.allowDomain("*")`允许从任何域加载数据,这对于测试和开发是必要的...