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

回答

相關問題