Question

我目前正在使用blob代码并且遇到一个小问题。

问题在于，有时候斑点会被反转，所以白色的颜色会进入斑点本身并在其中形成一个我不想要的白洞。

关于如何解决这个问题的任何建议，所以blob一直都是一个小小的好东西？

class Blob extends Sprite
{

    private var speed    :Number = .01;
    private var grav     :Number = .25;
    private var dist     :Number = 27;
    private var k        :Number = .55;
    private var damp     :Number = .99;
    private var cx       :Number = 370;
    private var cy       :Number = 0;
    private var points   :Array  = [];
    private var mids     :Array  = [];
    private var numPoints:Number = 30;
    private var oneSlice :Number = Math.PI * 2 / numPoints;
    private var radius   :Number = 100;

    public function Blob()
    {
        for (var i:Number = 0; i < numPoints; i++)
        {
            var angle:Number = oneSlice * i;
            var obj:Object = {x:Math.cos(angle) * radius + cx, y:Math.sin(angle) * radius + cy, a:angle - Math.PI / 2, wave:i*.08, vx:0, vy:0};
            points[i] = obj;
        }

        this.addEventListener(Event.ENTER_FRAME, update);

    }

    private function update(event:Event):void
    {
        this.graphics.clear();
        this.graphics.lineStyle(1, 0x666666, 50);
        this.graphics.beginFill(0x000000, 100);
        for (var i:Number = 0; i < numPoints-1; i++)
        {
            mids[i] = {x:(points[i].x + points[i + 1].x) / 2, y:(points[i].y + points[i + 1].y) / 2};
        }
        mids[i] = {x:(points[i].x + points[0].x) / 2, y:(points[i].y + points[0].y) / 2};
        this.graphics.moveTo(mids[0].x, mids[0].y);
        for (var j:Number = 0; j < numPoints - 1; j++)
        {
            this.graphics.curveTo(points[j+1].x, points[j+1].y, mids[j+1].x, mids[j+1].y);
        }
        this.graphics.curveTo(points[0].x, points[0].y, mids[0].x, mids[0].y);
        this.graphics.endFill();

        var point:Object;
        for (var k:Number = 0; k < numPoints - 1; k++)
        {
            point = points[k];
            spring(point, points[k + 1]);
            mouseSpring(point);
        }
        spring(points[k], points[0]);
        mouseSpring(points[k]);

        for (var l:Number = 0; l < numPoints; l++)
        {
            point = points[l];
            point.vx *= damp;
            point.vy *= damp;
            point.vy += grav;
            point.x += point.vx;
            point.y += point.vy;

            if (point.y > stage.stageHeight)
            {
                point.y = stage.stageHeight;
                point.vy = 0;
            }
            if (point.x < 20)
            {
                point.x = 20;
                point.vx = 0;
            }
            else if (point.x > stage.stageWidth)
            {
                point.x = stage.stageWidth;
                point.vx = 0;
            }
        }
    }

    private function spring(p0:Object, p1:Object):void
    {
        var dx:Number = p0.x - p1.x;
        var dy:Number = p0.y - p1.y;
        var angle:Number = p0.a+Math.sin(p0.wave += speed)*2;
        var tx:Number = p1.x + dist * Math.cos(angle);
        var ty:Number = p1.y + dist * Math.sin(angle);
        var ax:Number = (tx - p0.x) * k;
        var ay:Number = (ty - p0.y) * k;
        p0.vx += ax * .5;
        p0.vy += ay * .5;
        p1.vx -= ax * .5;
        p1.vy -= ay * .5;
    }

    private function mouseSpring(p:Object):void
    {
        var dx:Number = p.x - stage.mouseX;
        var dy:Number = p.y - stage.mouseY;
        var dist:Number = Math.sqrt(dx * dx + dy * dy);
        if (dist < 40)
        {
            var angle:Number = Math.atan2(dy, dx);
            var tx:Number = stage.mouseX + Math.cos(angle) * 40;
            var ty:Number = stage.mouseY + Math.sin(angle) * 40;
            p.vx += (tx - p.x) * k;
            p.vy += (ty - p.y) * k;
        }
    }

}

Answer 1

默认情况下，Graphics API使用evenOdd绕组，这意味着如果填充路径与自身重叠，则会使填充无效。

您需要使用绕组值为“nonZero”的Graphics.drawPath功能。这将导致它在路径重叠时不会否定。看看这个little demo，制作一个与自身重叠的形状，然后将绕组从evenOdd切换到nonZero，看看它是如何工作的。

至于翻译代码，而不是在update（）例程中使用graphics.moveTo（）和.curveTo（）调用，您需要建立路径描述（也就是drawPath的输入）并最后将它们传递给graphics.drawPath（）。 Adobe显示了一个示例here。

as3中的动画“blob”

1 个答案: