如何在Flex中绘制同心圆?

时间:2011-04-19 16:31:29

标签: actionscript-3 graphics flex3 geometry

我需要在Flex应用程序中绘制同心圆。我试图使用graphics util来做到这一点。我面临的问题是两个圈子的中心。任何人都有建议或知道如何解决这个问题?请帮忙。

由于

1 个答案:

答案 0 :(得分:4)

使用Graphics.drawCircle()方法(documentation),您应该传递相同的中心点(两个起始参数)。

要使用不同颜色填充圆圈,请使用以下代码:

<?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[
        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
        {
            super.updateDisplayList(unscaledWidth,unscaledHeight);

            var centerX:Number = unscaledWidth / 2;
            var centerY:Number = unscaledHeight / 2;

            var g:Graphics = circleHolder.graphics;
            g.clear();
            g.beginFill(0xFF00FF);
            g.drawCircle(centerX, centerY, 300);
            g.endFill();
            g.beginFill(0x0000FF);
            g.drawCircle(centerX, centerY, 200);
            g.endFill();
            g.beginFill(0x000000);
            g.drawCircle(centerX, centerY, 100);
            g.endFill();
        }
    ]]>
    </fx:Script>
    <mx:UIComponent left="0" right="0" top="0" bottom="0" id="circleHolder" />
</s:Application>