flex画渐变圆
MXML:::::::::::::::::::::::::::如下 <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"?? ??? ??? ??? ?layout="vertical" backgroundColor="white"> ?? ?<mx:Style> ?? ??? ?.gradient ?? ??? ?{ ?? ??? ??? ?border-style: solid; ?? ??? ??? ?border-thickness: 0; ?? ??? ??? ?border-skin: ClassReference("GradientBorder"); ?? ??? ??? ?fill-colors: #0099FF,#000099; ?? ??? ??? ?corner-radius: 10; ?? ??? ??? ?drop-shadow-enabled: true; ?? ??? ?} ?? ?</mx:Style> ?? ? ?? ?<mx:Script> ?? ??? ?<![CDATA[ ?? ??? ??? ?private function changeStyle():void ?? ??? ??? ?{ ?? ??? ??? ??? ?box.setStyle("fillColors",[col1.value,col2.value]); ?? ??? ??? ??? ?box.setStyle("cornerRadius",corner.value); ?? ??? ??? ?} ?? ??? ?]]> ?? ?</mx:Script> ?? ? ?? ?<mx:VBox id="box" styleName="gradient" width="400" height="300" verticalAlign="middle" horizontalAlign="center"> ?? ??? ?<mx:FormItem label="Color 1:"> ?? ??? ??? ?<mx:ColorPicker id="col1" change="changeStyle()" selectedColor="0x0099FF"/> ?? ??? ?</mx:FormItem> ?? ??? ?<mx:FormItem label="Color 2:"> ?? ??? ??? ?<mx:ColorPicker id="col2" change="changeStyle()" selectedColor="0x000099"/> ?? ??? ?</mx:FormItem> ?? ??? ?<mx:FormItem label="Corner radius:"> ?? ??? ??? ?<mx:HSlider id="corner" value="10" minimum="0" maximum="100" change="changeStyle()"/> ?? ??? ?</mx:FormItem> ?? ?</mx:VBox> ?? ? </mx:Application> AS::::::::::::::::::::::::如下 /** ?* 背景渐变色 ?* whisht ?* */ package { ?? ? ?? ?import flash.display.*; ?? ?import flash.geom.*; ?? ?import flash.utils.*; ?? ? ?? ?import mx.core.EdgeMetrics; ?? ?import mx.skins.halo.HaloBorder; ?? ?import mx.utils.ColorUtil; ?? ?import mx.utils.GraphicsUtil; ?? ? ?? ?public class GradientBorder extends HaloBorder ?? ?{ ?? ??? ? ?? ??? ?private var topCornerRadius:Number;??????? // top corner radius ?? ??? ?private var bottomCornerRadius:Number;??? // bottom corner radius ?? ??? ?private var fillColors:Array;??????????? // fill colors (two) ?? ??? ?private var setup:Boolean; ?? ??? ? ?? ??? ? ?? ??? ?private function setupStyles():void ?? ??? ?{ ?? ??? ??? ?fillColors = getStyle("fillColors") as Array; ?? ??? ??? ?if (!fillColors) fillColors = [0xFFFFFF,0xFFFFFF]; ?? ??? ??? ? ?? ??? ??? ?topCornerRadius = getStyle("cornerRadius") as Number; ?? ??? ??? ?if (!topCornerRadius) topCornerRadius = 0;?? ? ?? ??? ??? ? ?? ??? ??? ?bottomCornerRadius = getStyle("bottomCornerRadius") as Number; ?? ??? ??? ?if (!bottomCornerRadius) bottomCornerRadius = topCornerRadius;?? ? ?? ??? ??? ? ?? ??? ?} ?? ??? ? ?? ??? ? ?? ??? ?override protected function updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void ?? ??? ?{ ?? ??? ??? ?super.updateDisplayList(unscaledWidth,unscaledHeight);?? ? ?? ??? ??? ? ?? ??? ??? ?setupStyles(); ?? ??? ??? ? ?? ??? ??? ?var g:Graphics = graphics; ?? ??? ??? ?var b:EdgeMetrics = borderMetrics; ?? ??? ??? ?var w:Number = unscaledWidth - b.left - b.right; ?? ??? ??? ?var h:Number = unscaledHeight - b.top - b.bottom; ?? ??? ??? ?var m:Matrix = verticalGradientMatrix(0,w,h); ?? ??? ??? ? ?? ??? ??? ?g.beginGradientFill("linear",fillColors,[1,1],[0,255],m); ?? ??? ??? ? ?? ??? ??? ?var tr:Number = Math.max(topCornerRadius-2,0); ?? ??? ??? ?var br:Number = Math.max(bottomCornerRadius-2,0); ?? ??? ??? ? ?? ??? ??? ?GraphicsUtil.drawRoundRectComplex(g,b.left,b.top,h,tr,br,br); ?? ??? ??? ?g.endFill(); ?? ??? ??? ? ?? ??? ?} ?? ??? ? ?? ?} } (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |