flash - 围绕有机形状绘制轮廓

Question

在 Flash IDE 中似乎特别容易做但用代码很难做的一件事是勾勒出一个有机的形状。在 IDE 中，您可以使用墨桶工具在某物周围画笔画。只使用代码似乎更棘手。我见过的一种方法是在有问题的形状上添加一个辉光滤镜，然后弄乱强度。但是，如果我只想显示轮廓怎么办？

我想做的是收集构成形状边缘的所有点，然后将这些点连接起来。实际上，我已经用我编写的一个快速而肮脏的边缘检测脚本收集了所有的点。所以现在我有一个构成我形状的所有点的向量。我如何以正确的顺序连接它们，使其实际上看起来像原始对象？

对于任何感兴趣的人来说，这是我的边缘检测脚本:

//创建一个我们将用于轮廓的新 Sprite 
        var sp:Sprite = new Sprite();
        变量半径:int = 50；
        sp.graphics.beginFill(0x00FF00, 1);
        sp.graphics.drawCircle(0, 0, 半径);
        sp.graphics.endFill();
        sp.x = stage.stageWidth/2;
        sp.y = stage.stageHeight/2;

       //创建一个位图数据对象来绘制我们的矢量数据
        var bmd:BitmapData = new BitmapData(sp.width, sp.height, true, 0);

       //使用变换矩阵来平移绘制的剪辑，使其不
       //像素位于负空间中。 draw 方法只会绘制开始
       //在 0,0
        var mat:Matrix = new Matrix(1, 0, 0, 1, radius, radius);
        bmd.draw(sp, mat);

       //将位图数据传递给实际的位图
        var bmp:Bitmap = new Bitmap(bmd);

       //将位图添加到舞台
        添加 child (bmp)；

       //从位图数据对象中获取所有像素数据
        var pixels:Vector.
    
      = bmd.getVector(bmd.rect);
     

     
 //设置一个向量来保存我们的笔划点
     
 var points:Vector.
     
       = new Vector.
      
       ;
       

       
 //遍历位图数据对象的所有像素并
       
 //为每个不是的像素位置创建一个点实例
       
 //透明的。
       
 var l:int = pixels.length;
       
 for(var i:int = 0; i < l;++i)
       
 {
       
 //检查像素是否透明
       
 如果(像素[i]!= 0)
       
 {
       
 变种点:点；
       

       
 //检查像素是在第一个还是最后一个
       
 //排。我们将从这些行中获取所有内容以关闭大纲
       
 如果(我 <= bmp.width || i >=(bmp.width * bmp.height)- bmp.width)
       
 {
       
 pt = 新点();
       
 pt.x = int(i % bmp.width);
       
 pt.y = int(i/bmp.width);
       
 points.push(pt);
       
 继续;
       
 }
       

       
 //检查当前像素是否在任一极端边缘
       
 如果(int(i % bmp.width) == 0 || int(i % bmp.width) == bmp.width - 1)
       
 {
       
 pt = 新点();
       
 pt.x = int(i % bmp.width);
       
 pt.y = int(i/bmp.width);
       
 points.push(pt);
       
 继续;
       
 }
       

       
 //检查前一个或下一个像素是否透明，
       
 //如果是这样保存当前的。
       
 如果(我 > 0 && 我 < bmp.width * bmp.height)
       
 {
       
 如果(像素[i - 1] == 0 || 像素[i + 1] == 0)
       
 {
       
 pt = 新点();
       
 pt.x = int(i % bmp.width);
       
 pt.y = int(i/bmp.width);
       
 points.push(pt);
       
 }
       
 }
       
 }
       
 }
       

      
     
    

Answer 1

目前无法反省您在设计时绘制的形状(即找出所有线条和填充的角所在的位置)，因此围绕任意形状绘制轮廓的唯一好方法是位图效果。但是，您执行此操作的方式可能不会富有成效。 Flash 为您提供了几种处理位图的方法，但任何涉及循环遍历每个像素的方法通常都不够快，无法在运行时使用。

相反，我会采用以下两种方法之一:最好和最简单的方法是使用内置过滤器。正如您所说，通常人们在绘制轮廓时，会使用强度大且半径短的辉光滤镜。如果只想显示轮廓，请选中 knockout 属性。 (您可以在脚本或 IDE 中执行此操作。)如果您不喜欢由此得到的结果，您可以尝试混合滤镜 - 例如，在发光之前或之后添加模糊。或者您可以使用代码将发光效果生成到空白位图中，然后您可以通过各种方式处理结果 - 例如，使用 BitmapData.threshold，我发现它非常强大。不管怎样，我会先试一试，确保它真的不能解决您的问题，然后再尝试其他方法，因为这是迄今为止最简单的解决方案。

另一个选项是 PixelBender。这是一个允许您使用类 C 语言定义自定义过滤器的功能，您可以预编译该过滤器，然后将其加载到您的 Flash 影片中，并应用于相关位图。该过程与编写 photoshop 滤镜非常相似。这使您可以完全控制要对位图进行何种处理，但它需要您在 Flash 和 actionscript 之外工作。

按照当前路线手动处理像素当然是第三种选择，但问题是您是否真的在做普通或自定义过滤器无法做的事情。如果你真的想完成你正在进行的工作，你可以尝试制作一个新的透明位图，并为你在上面的代码中捕获的每个点，在该点绘制一个白点(使用 setPixel32)。这会给你一个像素化的轮廓，然后你可能想要模糊或以其他方式处理。但实际上，您最终会得到与使用普通辉光滤镜可能得到的结果非常相似的结果，而且会花费更长的时间。