走近Flex组件系列(二):简单实用的Alert组件
Flex中为我们提供的简单实用的Alert组件,可以为我们在项目开发中完成很多的应用控制和提示操作。其功能和Windows Form的MessageBox,JavaScript中的alert()一样,其作用我就不用我多说了。
本文将介绍Flex的Alert组件比较常见的几种应用模式,详细请坐下听我慢慢道来。
最常见的莫过于只做消息提示的功能应用,那Flex的Alert该怎么来实现呢?Flex的Alert组件位于mx.controls包下,Alert类提供了静态的show方法来完成我们常见的功能。使用很简单,如下便是只做消息提示的应用:
1 internal function onClick():void
2 {
3 Alert.show("Hello World!");
4 }
2 {
3 Alert.show("Hello World!");
4 }
如果照上面的应用,在弹出的消息对话框中就只有提示消息,对话框没有标题。要让对话框显示标题该怎么办呢?很简单,如下代码示例:
1 internal function onClickTitle():void
2 {
3 Alert.show("Hello World!","这里是标题");
4 }
2 {
3 Alert.show("Hello World!","这里是标题");
4 }
或许有人会问,以前做简单的提示操作已经学会了,确实很简单。如果我需要提供两个按扭让我选择,然后根据我的选择做不同的程序控制该怎么做呢?其实这正是我接下来要讲到的,详细见如下代码定义:
1 internal function onClickConfrm():void
2 {
3 Alert.yesLabel="是";
4 Alert.noLabel="否";
5 Alert.show("Hello World!","这里是标题",3,this,onCloseHandler);
6 }
2 {
3 Alert.yesLabel="是";
4 Alert.noLabel="否";
5 Alert.show("Hello World!","这里是标题",3,this,onCloseHandler);
6 }
方法的参数很容易理解,第一个为消息内容,第二个为标题显示内容,第三个为标识取值默认为4,第四个为当前Alert组件要显示的父容器,最后一个则为点击Alert组件的按扭(如:是、否、确定、取消等)后的回调函数,或者叫做事件处理函数。如下代码定义(alertResult是个标签组件Label):
1 internal function onCloseHandler(evt:CloseEvent):void
2 {
3 if(evt.detail==Alert.YES)
4 {
5 alertResult.text = "你选择的是:“是”!";
6 }
7 else
8 {
9 alertResult.text = "你选择的是:“否”!";
10 }
11 }
2 {
3 if(evt.detail==Alert.YES)
4 {
5 alertResult.text = "你选择的是:“是”!";
6 }
7 else
8 {
9 alertResult.text = "你选择的是:“否”!";
10 }
11 }
最后来看看对话框上出三个按扭(是,否,取消)的应用,代码定义如下:
1 internal function onClickHandler():void
2 {
3 Alert.yesLabel="是";
4 Alert.noLabel="否";
5 Alert.cancelLabel="取消";
6 Alert.show("Hello World!","这里是标题",1|2|8,this,onCloseHandler);
7 }
2 {
3 Alert.yesLabel="是";
4 Alert.noLabel="否";
5 Alert.cancelLabel="取消";
6 Alert.show("Hello World!","这里是标题",1|2|8,this,onCloseHandler);
7 }
同样通过设置的事件处理函数来获取用户点击的是那一项操作。运行效果如下图:
以下是Alert组件的全部示例代码:
Alert组件示例代码