Flex友好提示、警告

Flex 自带的Alert带给用户的体验并不好，对于一些简单的提示来说，这个小题大作了。

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">

<fx:Script>
<![CDATA[
protected function popupBtn_clickHandler(event:MouseEvent):void
{
AlertUtil.show(this,"hello,world","保存成功");
}
]]>
</fx:Script>

<fx:Declarations>

</fx:Declarations>
<s:Button id="popupBtn" x="562" y="273" label="弹窗" click="popupBtn_clickHandler(event)"/>
</s:Application>

 

<p>/**
* hisuper_hjx,上午10:49:24
*/
package
{
import flash.events.TimerEvent;
import flash.utils.Timer;

import mx.core.FlexGlobals;
import mx.core.IFlexDisplayObject;
import mx.core.UIComponent;
import mx.events.EffectEvent;
import mx.managers.PopUpManager;

import spark.components.Application;
import spark.effects.Fade;</p><p> public class AlertUtil
{
public function AlertUtil()
{

}

//显示内容
public static function show(title:String="",content:String="",time:Number=1000):void{
var application:Application=FlexGlobals.topLevelApplication as Application;
var alertLabel:AlertLabel=new AlertLabel();//弹窗组件；
var timer:Timer=new Timer(time);//计时器
var fade:Fade=new Fade();//渐变
fade.alphaFrom=0;
fade.alphaTo=1;
fade.target=alertLabel;
fade.duration=300;

alertLabel.text=content;
PopUpManager.addPopUp(alertLabel,application);//弹窗；
PopUpManager.centerPopUp(alertLabel);
fade.play();

timer.addEventListener(TimerEvent.TIMER,function timerEventHandler(event:TimerEvent):void{
fade.alphaFrom=1;
fade.alphaTo=0;
fade.play();
fade.addEventListener(EffectEvent.EFFECT_END,function fadeEndHandler(event:EffectEvent):void{
PopUpManager.removePopUp(alertLabel);
});
});

timer.start();
}

}
}</p>

/**
* hisuper_hjx,上午11:05:47
*/
package
{
import skins.AlertLabelSkin;

import spark.components.supportClasses.SkinnableComponent;

public class AlertLabel extends SkinnableComponent
{

private var _text:String

public function AlertLabel()
{
super();
setStyle("skinClass",AlertLabelSkin);
}

[Bindable]
public function get text():String
{
return _text;
}

public function set text(value:String):void
{
_text = value;
}

}
}

 

<?xml version="1.0" encoding="utf-8"?>
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
width="160" height="100">
<!-- host component -->
<fx:Metadata>
[HostComponent("AlertLabel")]
</fx:Metadata>
<s:Group left="0" right="0" top="0" bottom="0">
<s:Group left="0" right="0" top="0" bottom="0">
<s:Rect left="0" right="0" top="0" bottom="0" radiusX="20" radiusY="20">
<s:fill>
<s:SolidColor color="0"/>
</s:fill>
</s:Rect>
</s:Group>

<s:Label id="label" color="0xffffff" fontSize="18" horizontalCenter="0"
text="{hostComponent.text}" verticalCenter="0"
fontFamily="微软雅黑"/>
</s:Group>
</s:Skin>