flex3可编程皮肤
flex3可编程皮肤
效果图：

package com{import mx.skins.ProgrammaticSkin;public class MySkin extends ProgrammaticSkin{public function MySkin(){super();}overrideprotected function updateDisplayList(unscaledWidth:Number,     unscaledHeight:Number):void{var line:Number=4;var backgroundColoe:Number;switch(name){case "upSkin":backgroundColoe=0xEA800C;break;case "overSkin":backgroundColoe=0xF8B872;break;case "downSkin":backgroundColoe=0xB06109;break;case "disabledSkin":backgroundColoe=0xB06109;break;}graphics.clear();graphics.beginFill(backgroundColoe);graphics.drawEllipse(0,0,unscaledWidth,unscaledHeight);graphics.endFill();}}}

mxml使用
<mx:Style>
.mySkin
{
up-skin:ClassReference('com.MySkin');
over-skin:ClassReference('com.MySkin');
down-skin:ClassReference('com.MySkin');
disabled-skin:ClassReference('com.MySkin');
}
</mx:Style>
<!-- 其中'com.MySkin'为自定义皮肤的as类路径 -->
<mx:Button id="demo" label="demotext" styleName="mySkin">

</mx:Button>

flex-css渐变色
css-code
.myColor{
fill-alphas:0.33,0.67,0.75,0.65;
fill-colors:#000000,#006666,#00ff99,#cccc00;
}
mxml-code:
<mx:Panel width="446" height="226" headerColors="[0xEA800C,0xF8B872]">
borderSkin创建背景图片的应用（类似BackgroundImage）

package{import flash.display.Bitmap;        import flash.display.BitmapData;        import mx.skins.RectangularBorder;           public class MetalBackground extends RectangularBorder          {             [Embed(source='file.png')]             private var backgroundImageClass:Class;             private var backgroundBitmapData:BitmapData;              public function MetalBackground()             {                 super();                 var backgroundImage:Bitmap = new backgroundImageClass();                 backgroundBitmapData = new BitmapData(backgroundImage.width,backgroundImage.height);                 backgroundBitmapData.draw(backgroundImage);             }               override protected function updateDisplayList(unscaledWidth:Number,unscaledHeight:Number ):void             {                super.updateDisplayList(unscaledWidth,unscaledHeight );                var cornerRadius:Number = getStyle("cornerRadius");                graphics.clear();                graphics.beginBitmapFill( backgroundBitmapData );                graphics.drawRoundRectComplex(0,0,unscaledWidth,unscaledHeight,cornerRadius,cornerRadius,cornerRadius,cornerRadius );                graphics.endFill();             }          }    }  

mxml应用
<mx:Canvas borderSkin="MetalBackground" x="576" y="49" width="142" height="169">