加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

flex画渐变圆

发布时间:2020-12-15 04:17:51 所属栏目:百科 来源:网络整理
导读:MXML:::::::::::::::::::::::::::如下 ?xml version="1.0" encoding="utf-8"? mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" ?? ??? ??? ??? ?layout="vertical" backgroundColor="white" ?? ?mx:Style ?? ??? ?.gr

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(); ?? ??? ??? ? ?? ??? ?} ?? ??? ? ?? ?} }

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读