mx|Alert{

       borderSkin:Cla***eference("skins.AlertSkin");

       buttonStyleName: "alertButton";

}

.alertButton {

       upSkin: Embed(source="flexlib/assets/assets.swf",symbol="Button_upskin");

       downSkin: Embed(source="flexlib/assets/assets.swf",symbol="Button_downskin");

       overSkin: Embed(source="flexlib/assets/assets.swf",symbol="Button_overskin");

       disabledSkin: Embed(source="flexlib/assets/assets.swf",symbol="Button_disabledskin");

}

上面的这段CSS样式。一共设置flex Alert的两个部分，一个是皮肤，一个是按钮。先说按钮，下面这个是标识按钮的样式。我们是通过载入SWF中的库文件达到获取按钮的各状态皮肤。

<?xml version="1.0" encoding="utf-8"?>

<s:SparkSkin name="CustomPanelBorderSkin"

                        xmlns:fx="http://ns.adobe.com/mxml/2009"

                        xmlns:s="library://ns.adobe.com/flex/spark"

                        implements="mx.core.IRectangularBorder">

       <fx:Script>

               <![CDATA[

                       import mx.core.EdgeMetrics;

                       import mx.core.IUIComponent;

                       static private const exclusions:Array = ["background"];

                       override public function get colorizeExclusions():Array {

                               return exclusions;

                       }

                       static private const contentFill:Array = [];

                       override public function get contentItems():Array {

                               return contentFill

                       };

                       private var _metrics:EdgeMetrics = new EdgeMetrics(1, 32, 1, 1);

                       public function get borderMetrics():EdgeMetrics {

                               var hasPanelParent:Boolean = isPanel(parent);

                               var controlBar:IUIComponent = hasPanelParent ? Object(parent).mx_internal::_controlBar : null;

                               if (controlBar && controlBar.includeInLayout) {

                                       _metrics.bottom = controlBar.getExplicitOrMeasuredHeight() + 1;

                               } else {

                                       _metrics.bottom = 1;

                               }

                               return _metrics;

                       }

                       public function get backgroundImageBounds():Rectangle {

                               return null;

                       }

                       public function set backgroundImageBounds(value:Rectangle):void {

                       }

                       public function get hasBackgroundImage():Boolean {

                               return false;

                       }

                       public function layoutBackgroundImage():void {

                       }

                       override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {

                               var em:EdgeMetrics = borderMetrics;

                               if (em.bottom > 1) {

                                       cbbg.height = em.bottom - 1;

                                       cbdiv.bottom = cbbg.height;

                                       cbbg.visible = cbdiv.visible = true;

                               } else {

                                       cbbg.visible = cbdiv.visible = false;

                               }

                               super.updateDisplayList(unscaledWidth, unscaledHeight);

                       }

                       private static var panels:Object = {};

                       private static function isPanel(parent:Object):Boolean {

                               var s:String = getQualifiedClassName(parent);

                               if (panels[s] == 1) {

                                       return true;

                               }

                               if (panels[s] == 0) {

                                       return false;

                               }

                               if (s == "mx.containers::Panel") {

                                       panels[s] == 1;

                                       return true;

                               }

                               var x:XML = describeType(parent);

                               var xmllist:XMLList = x.extendsClass.(@type == "mx.containers::Panel");

                               if (xmllist.length() == 0) {

                                       panels[s] = 0;

                                       return false;

                               }

                               panels[s] = 1;

                               return true;

                       }

               ]]>

       </fx:Script>

       <!-- 阴影 -->

       <s:Rect left="0" top="0" right="0" bottom="0">

               <s:filters>

                       <s:DropShadowFilter blurX="20" blurY="20" alpha="0.32" distance="11" angle="90" knockout="true" />

               </s:filters>

               <s:fill>

                       <s:SolidColor color="0" />

               </s:fill>

       </s:Rect>

       <!-- layer 1:边框-->

       <s:Rect left="0" right="0" top="0" bottom="0">

               <s:stroke>

                       <s:SolidColorStroke color="0xAECDF6" alpha="1" weight="1" />

               </s:stroke>

       </s:Rect>

       <!-- layer 2: 背景色-->

       <s:Rect id="background" left="1" top="1" right="1" bottom="1" alpha="1">

               <s:fill>

                       <s:SolidColor color="0xFFFFFF"/>

               </s:fill>

       </s:Rect>

       <!-- layer 3: 标题栏-->

       <s:Rect left="1" right="1" top="1" height="30">

               <s:fill>

                       <s:LinearGradient rotation="90">

                               <s:GradientEntry color="0xe8f0fc" />

                               <s:GradientEntry color="0xd0e7ff" />

                       </s:LinearGradient>

               </s:fill>

       </s:Rect>

       <!-- layer 4:标题栏高亮-->

       <s:Rect left="1" right="1" top="1" height="30">

               <s:stroke>

                       <s:LinearGradientStroke rotation="90" weight="1">

                               <s:GradientEntry color="0xe8f0fc" />

                               <s:GradientEntry color="0xd0e7ff" />

                       </s:LinearGradientStroke>

               </s:stroke>

       </s:Rect>

       <s:Rect left="1" right="1" top="31" height="1">

               <s:fill>

                       <s:SolidColor color="0xC0C0C0" />

               </s:fill>

       </s:Rect>

       <!-- layer 5: 控制栏背景色-->

       <s:Rect id="cbbg" left="1" right="1" bottom="1" height="20">

               <s:fill>

                       <s:SolidColor color="0xE8E8E8" />

               </s:fill>

       </s:Rect>

       <!-- layer 6: 控制栏分割线-->

       <s:Rect id="cbdiv" left="1" right="1" bottom="20" height="1">

               <s:fill>

                       <s:SolidColor color="0xCDCDCD" />

               </s:fill>

       </s:Rect>

</s:SparkSkin>

这段文字是Alert的皮肤设置，这个是应用在Flash Builder4以上版本的。


更多关于flex alert的信息，可查询天地会http://bbs.9ria.com/thread-98412-1-1.html