Flex消息提示框Alert

本文章转自：http://blessht.iteye.com/blog/1108623

 

在任何BS项目中，消息提示框都是非常常见的功能组件，flex在AIR的渲染下，消息提示框也是做得非常漂亮美观。

 

Flex的消息提示框由mx.controls.Alert类负责创建，通常通过调用静态方法show(即可实现提示框的创建)：

Java代码  

1. public static show (   
2.     text:String,                        //消息提示内容   
3.     title:String=null,                  //标题   
4.     flags:uint=mx.controls.Alert.OK,    //按钮组合   
5.     parent:Sprite=null,                 //Alert 控件的父对象   
6.     clickListener:Function=null,        //指定 click 事件的侦听器   
7.     iconClass:Class=null,               //指定对话框中消息文本左侧的图标   
8.     defaultButton:uint=mx.controls.Alert.OK  //使用一个标志参数的合法值指定默认按钮。当用户按下回车时，此按钮就被选中，其默认值是 Alert.OK.   
9.     )  

public static show (
	text:String,                        //消息提示内容
	title:String=null,                  //标题
	flags:uint=mx.controls.Alert.OK,    //按钮组合
	parent:Sprite=null,                 //Alert 控件的父对象
	clickListener:Function=null,        //指定 click 事件的侦听器
	iconClass:Class=null,               //指定对话框中消息文本左侧的图标
	defaultButton:uint=mx.controls.Alert.OK  //使用一个标志参数的合法值指定默认按钮。当用户按下回车时，此按钮就被选中，其默认值是 Alert.OK.
	)

 

show方法内所有参数都是非必选的。

参数flags表示弹出框下面生成几种按钮，alert类提供了四个按钮：是、否、确定和取消，由四个整数抽象表示：

Java代码  

1. Alert.OK         4      
2. Alert.NO         2  
3. Alert.YES        1  
4. Alert.CANCEL 8  

Alert.OK         4   
Alert.NO         2
Alert.YES        1
Alert.CANCEL 8

 具体使用方法详见后面的代码。

参数clickListener可实现点击按钮事件监听，也就是说可以通过监听来判断用户点击的是哪个按钮，从而根据不同选择实现不同操作。

 

 

下面来看一个实例：在界面上有三个按钮，每点击一个按钮弹出一个提示框。这个功能非常简单，只需要给每个button绑定click事件即可：

Xml代码  

1. <fx:Script>  
2.         <![CDATA[  
3.             import mx.controls.Alert;  
4.             import mx.events.CloseEvent;  
5.               
6.               
7.             protected function button1_clickHandler(event:MouseEvent):void  
8.             {  
9.                 var myAlert:Alert = Alert.show("显示对话框...","提示");  
10.                 myAlert.height = 200; //高度  
11.                 myAlert.width = 200;  //宽度  
12.             }  
13.  
14.             protected function button2_clickHandler(event:MouseEvent):void  
15.             {  
16.                 Alert.show("你确定此操作吗？","提示",Alert.OK|Alert.CANCEL|Alert.YES|Alert.NO,this,handler);  
17.             }                 
18.                  
19.             protected function button3_clickHandler(event:MouseEvent):void  
20.             {  
21.                 Alert.yesLabel = "哟系yes";  
22.                 Alert.noLabel = "呀灭no";  
23.                 Alert.cancelLabel = "哦cancel";  
24.                 var myAlert:Alert = Alert.show("选择操作...","提示",1|2,this,handler);  
25.             }  
26.               
27.             private function handler(e:CloseEvent):void{  
28.                 //显示事件选择的值  
29.                 Alert.show(e.detail.toString());  
30.             }  
31.  
32.         ]]>  
33.     </fx:Script>  
34.   
35.     <fx:Declarations>  
36.         <!-- 将非可视元素（例如服务、值对象）放在此处 -->  
37.     </fx:Declarations>  
38.     <s:Button label="按钮1" click="button1_clickHandler(event)"/>  
39.     <s:Button label="按钮2" click="button2_clickHandler(event)"/>  
40.     <s:Button label="按钮3" click="button3_clickHandler(event)"/>  

<fx:Script>
		<![CDATA[
			import mx.controls.Alert;
			import mx.events.CloseEvent;
			
			
			protected function button1_clickHandler(event:MouseEvent):void
			{
				var myAlert:Alert = Alert.show("显示对话框...","提示");
				myAlert.height = 200; //高度
				myAlert.width = 200;  //宽度
			}

			protected function button2_clickHandler(event:MouseEvent):void
			{
				Alert.show("你确定此操作吗？","提示",Alert.OK|Alert.CANCEL|Alert.YES|Alert.NO,this,handler);
			}				
			   
			protected function button3_clickHandler(event:MouseEvent):void
			{
				Alert.yesLabel = "哟系yes";
				Alert.noLabel = "呀灭no";
				Alert.cancelLabel = "哦cancel";
				var myAlert:Alert = Alert.show("选择操作...","提示",1|2,this,handler);
			}
			
			private function handler(e:CloseEvent):void{
				//显示事件选择的值
				Alert.show(e.detail.toString());
			}

		]]>
	</fx:Script>

	<fx:Declarations>
		<!-- 将非可视元素（例如服务、值对象）放在此处 -->
	</fx:Declarations>
	<s:Button label="按钮1" click="button1_clickHandler(event)"/>
	<s:Button label="按钮2" click="button2_clickHandler(event)"/>
	<s:Button label="按钮3" click="button3_clickHandler(event)"/>

 需要注意的是Alert.yesLabel、Alert.noLabel、Alert.cancelLabel等等set方法是全局的，如果相应属性值改变，则其它Alert对象也会跟着改变。

 

 

最后看下运行效果：