代码奇迹吧 关注:4贴子:49
  • 2回复贴,共1

【笔记】AS3 graphics.drawPath VS moveTo, lineTo 方法-透明度

只看楼主收藏回复

在flash Player 10API里新增的方法graphics.drawPath加快了运行时的绘制速度,尤其是lineTo和moveTo被多次调用的时候。可惜,它绘制半透明线条的效果并不理想。线条的交叉处平淡无奇,并没有半透明物间的遮盖效果。当我们使用move To和line To方法的时候,这种糟糕的行为就能被阻止,从而得到预想的遮盖效果。看测试swf的截图:
代码和注释:
下面的代码实现了上面四种图形示例,一些出现了透明度的重叠,另一些没有。我们给出注释以便增加代码清晰度。
import flash.display.Sprite;
//We will draw line segments in a Sprite 'sp'.
var sp:Sprite = new Sprite();
sp.x = 50;
sp.y = 50;
this.addChild(sp);
/*
在这里,graphics.drawpath方法使用了两个参数:一个矢量数组用来储存路径上连贯坐标点,一个矢量数组用来存储命令参数。(最后一个可选参数‘winding’在这次试验里用不到)我们接下来创建矢量数组变量。
*/
var drawCoords:Vector.<Number> = new Vector.<Number>();
var drawCommands:Vector.<int> = new Vector.<int>();
//我们将要绘制粗细为12,不透明度为0.2的黑色线条。
sp.graphics.lineStyle(12,0x000000,0.2);
//绘制左上方的十字。可以看到,交叉处的alpha符合预期。
sp.graphics.moveTo(0,10);
sp.graphics.lineTo(100,110);
sp.graphics.moveTo(100,10);
sp.graphics.lineTo(0,110);
/*
我们填充这些将在drawpath方法里用到的数组。在command(命令)数组里,1表示moveTo,2表示lineTo。这样,这个被命令参数填充的数组就表示:moveTo,lineTo,moveTo在lineTo。然后,我们调用drawPath方法。右上方的十字就画出来了。很显然,交叉处并不正常,它不符合两个半透明物体互相遮盖的预期现象。
*/
drawCoords.push(200,10);
drawCommands.push(1);
drawCoords.push(300,110);
drawCommands.push(2);
drawCoords.push(300,10);
drawCommands.push(1);
drawCoords.push(200,110);
drawCommands.push(2);
sp.graphics.drawPath(drawCommands,drawCoords);
/*
下面我们绘制靠底下的图例。在第一个图例里,我们使用使用3次lineTo并只使用一次moveTo。我们看到绘制的交叉出并不正常。最后一个图例,我们在每一个lineTo前面都加上一个moveTo(虽然画笔并没有真正的移动)。显示的交叉处呈现正常的透明度。
*/
sp.graphics.moveTo(0,310);
sp.graphics.lineTo(100,410);
sp.graphics.lineTo(100,310);
sp.graphics.lineTo(0,410);
sp.graphics.moveTo(200,310);
sp.graphics.lineTo(300,410);
sp.graphics.moveTo(300,410);
sp.graphics.lineTo(300,310);
sp.graphics.moveTo(300,310);
sp.graphics.lineTo(200,410);
似乎当moveTo被调用的时候,就在原先的形状(Shape)层上新建一层形状(Shae)。两个具有透明度的显示对象在重叠时候便出现透明度的叠加。而当lineTo被连续调用的时候,它就一直在同一个(注:这里说同一层更形象)Shape对象里绘制各段,也就只有一个alpha值了。类似的,在drawPath方法里也是在同一个Object对象里绘制所有片段,这里就不管moveTo是否包含在command数组里了。但是,上面都还仅限于我们的猜测。毕竟在drawPath或者是moveTo里用到的那些对象,不管它们是什么,我们都无法直观的获得。


1楼2015-05-05 19:34回复
    原文 http://bbs.9ria.com/thread-102032-1-1.html


    2楼2015-05-05 19:34
    回复