flash - 在 Flash 中重绘数百个粒子的有效方法？

Question

我刚刚开始学习 flash/actionscript 3，并决定编写一个简单的粒子模拟器。

最初的设计只是用一堆粒子填充屏幕，如果你点击，这些粒子就会从光标处散开。

这可以工作，但有点 react 迟钝。我使用graphics.drawCircle()来绘制粒子，每个粒子都是从Sprite继承的。

鼠标点击事件的监听器:

private function mouseClick(e:MouseEvent):void
{
    trace("click");
    var now:Date = new Date();
    trace("Before: "+now.getTime());
    for each (var p:Particle in particleList)
    {
        var dist:Number = distance(e.localX,e.localY,p.x,p.y);
        if (dist < 50)
        {
            var xVel:Number = p.x - e.localX;
            var yVel:Number = p.y - e.localY;

            xVel *=  Math.max(0,50 - dist) * 0.05;
            yVel *=  Math.max(0,50 - dist) * 0.05;
            p.xVel +=  xVel;
            p.yVel +=  yVel;
        }
    }

    var later:Date = new Date();
    trace("After: "+later.getTime());
    trace("Total: "+(later.getTime()-now.getTime()));

    //e.
}

在 Particle 中，有一个帧监听器每帧都运行它:

public function loop(e:Event):void
{
    if (xVel != 0 || yVel != 0 || setup)
    {
        setup = false;
        x +=  xVel;
        y +=  yVel;


        if (x < 0)
        {
            x = 0;
            xVel =  -  xVel;
        }
        if (x > stageRef.stageWidth)
        {
            x = stageRef.stageWidth;
            xVel =  -  xVel;
        }
        if (y < 0)
        {
            y = 0;
            yVel =  -  yVel;
        }
        if (y > stageRef.stageHeight)
        {
            y = stageRef.stageHeight;
            yVel =  -  yVel;
        }


        graphics.clear();
        graphics.lineStyle(.25,0xFFFFFF,0.5);
        graphics.drawCircle(0,0,1);

        xVel *=  Engine.friction;
        yVel *=  Engine.friction;
    }

    if (xVel < 0.01 && xVel > -0.01)
    {
        xVel = 0;
    }

    if (yVel < 0.01 && yVel > -0.01)
    {
        yVel = 0;
    }
}

我应该如何提高效率？我计划稍后进行碰撞检测和其他物理交互，即使没有我打算稍后添加的大量数字处理代码，这也已经有点慢了。

Answer 1

对于太多形状，使用图形非常慢...无需对代码进行太多更改，您可以尝试在每个帧中在 BitmapData 中绘制形状(首先以单个形状或多个形状绘制它们，然后使用 BitmapData 绘制，然后清除所有图形)。我认为你应该得到一个小小的改进。基本代码是这样的:

for(...) {
   shape.graphics.drawCircle(0,0,1);
}
bitmapData.draw(shape);
shape.graphics.clear();

另一方面，据我所知，对于 1 像素粒子，最快的方法是对每个粒子使用 BitmapData 和 setPixel:

bitmapData.fillRect(bitmapData.rect, 0);
bitmapData.lock();
for(...) {
   bitmapData.setPixel(x,y,0xFFFFFF);
}
bitmapData.unlock();

对于更大或更复杂的粒子，我听说 copyPixels 是可行的方法，但是您需要事先将所有不同的粒子进行位 block 传输(不过我对此没有太多经验，而且我我们发现很多情况下使用 BitmapData 绘制效果更好，甚至将每个 bitmapData 放在不同的 Sprite 中):

bitmapData.fillRect(bitmapData.rect, 0);
for(...) {
   bitmapData.copyPixels(myParticle10, myParticle10.rect, new Point(tx, ty));
}

<罢工>

我希望这会有所帮助。