flash as3使用curveTo

使用最少量的代码/迭代尝试在闪存中绘制圆弧，并绘制圆环楔（具有内部和外部圆弧的圆弧）。我从一个旧的AS2例子中移植了这个方法，但是它需要通过多个步骤循环才能使它看起来平滑，我宁愿避免这种情况。我看到AS3有一个“curveTo”命令，但它并不真正绘制圆弧，它绘制了一条贝塞尔曲线。闪光灯中是否有弧线命令？或者绘制一段圆的方法？flash as3使用curveTo

这里是我的旧代码：

function drawSolidArc (drawObj:Object, centerX:Number,centerY:Number,innerRadius:Number,outerRadius:Number,startAngle:Number,arcAngle:Number,steps:int=20):void { 
    if (Math.abs(startAngle)>360)startAngle%=360 
    if (Math.abs(arcAngle)>360)arcAngle%=360 
    startAngle/=360,arcAngle/=360 
    var twoPI:Number = 2 * Math.PI; 
    var angleStep:Number = arcAngle/steps; 
    var angle:Number, i:int, endAngle:Number; 
    var xx:Number = centerX + Math.cos(startAngle * twoPI) * innerRadius; 
    var yy:Number = centerY + Math.sin(startAngle * twoPI) * innerRadius; 
    var xxInit:Number=xx; 
    var yyInit:Number=yy; 
    drawObj.graphics.moveTo(xx,yy); 
    for(i=1; i<=steps; i++) { 
     angle = (startAngle + i * angleStep) * twoPI; 
     xx = centerX + Math.cos(angle) * innerRadius; 
     yy = centerY + Math.sin(angle) * innerRadius; 
     drawObj.graphics.lineTo(xx,yy); 
    } 
    endAngle = startAngle + arcAngle; 
    for(i=0;i<=steps;i++) { 
     angle = (endAngle - i * angleStep) * twoPI; 
     xx = centerX + Math.cos(angle) * outerRadius; 
     yy = centerY + Math.sin(angle) * outerRadius; 
     drawObj.graphics.lineTo(xx,yy); 
    } 

    drawObj.graphics.lineTo(xxInit,yyInit); 
}; 

var myArc:Shape = new Shape(); //or another DisplayObject 

myArc.graphics.beginFill(0xcccccc, 0.50); 
//objName, centerX,centerY, innerRadius, outerRadius, startAngle (12 o'clock is -90), arcAngle (degrees from startAngle), steps (smoothness) 
drawSolidArc (myArc,250, 250, 180, 200, -90, 65, 100); 
myArc.graphics.endFill(); 
this.addChild(myArc);

来源

2011-11-28 mheavers

我做了类似的杰里米的解决方案的东西，虽然我没有掩盖它。显然，如果从同一中心点创建另一个更小半径的圆弧，它将从现有形状中减去，所以我只是再次调用drawSolidArc之后的第一个，endFill之前，以零为中心点，以及外半径是第一个楔形的期望内径：

var myArc:Sprite = new Sprite(); 
myArc.graphics.beginFill(0xcccccc, 1); 
drawArc(myArc, 275, 200, 60, 150, 35); //spriteName, startX, startY, innerRadius, radius, arcAngle, startAngle 
drawArc(myArc, 275, 200, 0, 60, 35); //subtract out the middle by drawing a new circle over the top of it 
myArc.graphics.endFill(); 
this.addChild(myArc);

来源

2011-11-28 16:34:45 mheavers

Graphics.cubicCurveTo()会给你比curveTo的圆弧的更好的近似。但它仍然不完美。

来源

2011-11-28 15:21:43 Kodiak

我没有看到文件名为cubicCurveTo任何功能，当我尝试使用该功能我得到的错误。 – mheavers

只需按照联系;）语言版本：\t的ActionScript 3.0 运行时版本：\t的Flash Player 11，AIR 3 – Kodiak

我甚至无法在CS5发布到Flash Player 11 - 不是一个真正的可行的选择，我现在。我看到一个MXP增加了这个功能，但是你必须在计算机上以管理员身份运行才能安装它，这对我来说也不是一种选择。但在更新版本的闪光灯中使用更精确的曲线方法会很好。 – mheavers

这是我如何做它：

画一个甜甜圈和面膜吧：

_foreground = new Sprite(); 
_foreground.graphics.beginFill(_colour) 
_foreground.graphics.drawCircle(0, 0, _outerRadius); 
_foreground.graphics.drawCircle(0, 0, _innerRadius); 
_foreground.graphics.endFill(); 
_container.addChild(_foreground); 

_mask = new Sprite(); 
_mask.graphics.beginFill(0xff0000); 
_foreground.mask = _mask;

然后用这种方法绘制 - 画一个楔子插入面罩

private function draw(e:Event):void //Called each frame (if animating) 
{ 
// No need to draw more than 360 
if (Math.abs(_arc) > _endAngle) 
{ 
    _arc = _endAngle; 
    stop(); 
} 

_numOfSegs = Math.ceil(Math.abs(_arc)/45); 
_segAngle = _arc/_numOfSegs; 
_segAngle = (_segAngle/180) * Math.PI; 
_angle = (_startAngle/180) * Math.PI; 

// Calculate the start point 
_ax = Math.cos(_angle) * _outerRadius; 
_ay = Math.sin(-_angle) * _outerRadius; 

// Draw the first line 
_mask.graphics.lineTo(_ax, _ay); 

for (var i:int=0; i<_numOfSegs; i++) 
{ 
    _angle += _segAngle; 
    _angleMid = _angle - (_segAngle/2); 
    _bx = Math.cos(_angle) * _outerRadius; 
    _by = Math.sin(_angle) * _outerRadius; 
    _cx = Math.cos(_angleMid) * (_outerRadius/Math.cos(_segAngle/2)); 
    _cy = Math.sin(_angleMid) * (_outerRadius/Math.cos(_segAngle/2)); 
    _mask.graphics.curveTo(_cx, _cy, _bx, _by); 
} 

// Close the wedge 
_mask.graphics.lineTo(0, 0); 
_arc += 3.6; //This gives a 100 steps to complete the circle 
}

来源

2011-11-28 15:57:04 davivid

然后是this implementation。但是，这几乎和你发布的那样混乱。恐怕没有优雅的方式（几行左右）绘制弧线。

来源

2011-11-28 16:00:09 joncys

下面是我写的几个不同形状绘图类的链接。您可以通过绘制一个楔子并用第二个圆形遮盖它的中心来获得所需的圆弧段。

来源

2011-11-28 16:03:10 JeremyFromEarth

谢谢 - 这是一个不错的图书馆。 – mheavers

flash as3使用curveTo

回答

相关问题