| Flash MX Action画线方法(完结篇) 织梦帝国>汉译计划 未经许可谢绝商业及个人站点转载,如需要转载请联系 织梦帝国 Flash MX Action画线方法(完结) 文章简介:这里介绍如何使用as动态画出曲线(一个圆);以及如何设置渐变填充动态画出的图形。 原作者:Ric Ewing 翻译者:alan (续) MovieClip.curveTo(controlX, controlY,anchorX, anchorY) 此方法从当前的钢笔位置到指明的(anchorX,anchorY)坐标画一条曲线,使用(controlX,controlY)坐标来定义曲线的尺寸和方向。 controlX和controlY: 曲线控点的水平和垂直位置。你可以把它想象为起点和终点的控制手柄。 AnchorX和anchorY: 曲线终点的水平和垂直位置。这也将是虚拟钢笔在这个方法完成以后所在的位置。 注意:在Macromedia Flash MX中,每条曲线,无论它是由何种方法创建,都是使用二次贝塞尔曲线来渲染的。但这究竟意味着什么呢?画向量曲线的方法不止一种,每种方法都有它的优点和局限性。Macromedia Flash使用二次贝塞尔曲线是因为它们渲染快而且存储时使用的数据少。象你所想象的那样,二次贝塞尔曲线有一个起点和一个终点,但它只使用一个单一的控点。这个控点对曲线的起点和终点都有影响。这意味着Flash只要储存三个点就可以定义一条曲线。目前为止这一切听起来很不错,但有一点要注意的是它们无法真正画出一个圆,最多也就是画一个近似的圆。你用的曲线越多,近似的程度也就越大。在它的画圆工具中,Macromedia Flash使用了8条二次贝塞尔曲线来画一个圆,就我们的目的来说,它达到的近似程度已经足够。我之所以提起这一点是因为,这对于那些习惯于使用三次贝塞尔曲线(比如Freehand中的画圆工具,四条曲线定义一个圆)的人可能会引起一些意想不到的麻烦。 如果想要更多细节的话,可以参考Macromedia的TechNote(为Flash 5而写,但现在仍适用)。里面讲述了二次贝塞尔曲线的细节以及它和其它曲线的不同之处。 由于我已经不止一次提到圆的概念,所以我给出一些代码,它以(200,200)为圆心画一个100 px的圆。和上面快速但蹩脚的版本不同,这个需要花费更大的工作量(以及一些不那么简单的数学)。它的优势在于,它和你在MM Flash中用画圆工具画出的圆完全一样而且会以你期待的方式工作: var x = 200; // 设置圆心的X坐标 var y = 200; // 设置圆心的Y坐标 var radius = 50; // 圆的半径 100/2 = 50 var theta = (45/180)*Math.PI; // 每一部分45度, 并化为弧度. var ctrlRadius = radius/Math.cos(theta/2); // 获得控点的半径 _root.lineStyle(1); // 设置我们的线条样式 _root.moveTo(x+radius, y); //从最右端开始画 var angle = 0; // 从0度开始; // 下面的循环画出圆的8个部分 for (var i = 0; i<8; i++) { // 增加度数 angle += theta; angleMid = angle-(theta/2); //计算控点 cx = x+Math.cos(angleMid)*(ctrlRadius); cy = y+Math.sin(angleMid)*(ctrlRadius); // 计算终点 px = x+Math.cos(angle)*radius; py = y+Math.sin(angle)*radius; // 画出圆的一个部分 _root.curveTo(cx, cy, px, py); } 诚然,上面的代码也并不会有很的改进,但如果你要画一个自己的圆的话,它应该是一个很不错的开端。下面的范例是以三个点为手柄的一个单一的曲线。你可以任意拖动它来感受一下这些东西是如何工作的。这是示例文件curveto.fla。 点击浏览该文件 |
