hanyeah 专注于AS

用lineBitmapStyle画绳子

在flash中,线条笔触可以是纯色、渐变和位图,同样,用as3也可以实现。

这篇就来研究一下位图笔触。

位图笔触用lineBitmapStyle方法。

test01:

直接用lineBitmapStyle,指定bitmap,matrix初始化为默认值。

获得 Adobe Flash Player

为了看清楚,我将线宽设置为50像素,观察发现,位图的原点与线的原点重合,而线是上下对称的,也就是说我们的线宽是50像素的话,线的y坐标是从-25像素到25像素,我们需要matrix平移一下。而且,线宽50像素,画出来似乎是两条绳子,绳子位图是原始尺寸,所以我们还需要缩放一下。

test02:

直接用lineBitmapStyle,指定bitmap,matrix设置scale和translate。

获得 Adobe Flash Player

test03:

效果不错,下面我们再加上旋转(rotate)。需要注意旋转、平移缩放的顺序,不同的调用顺序,效果可能不一样。

获得 Adobe Flash Player

test04:

最后,我们让绳子跟着鼠标旋转。

获得 Adobe Flash Player

当然可以创建一个Shape,在Shape里画成水平的直线,再控制Shape的旋转。我比较倾向于这样做,简单不容易出错。


直线效果可以了,那么如果要做曲线呢?

直接用一次lineBitmapStyle,然后用贝塞尔曲线(比如curveTo),效果是不行的,其实我们可以通过分段的直线来画曲线。

画了一个圆形,如下。

获得 Adobe Flash Player

源码打包下载

2015年10月7日 | 发布:hanyeah | 分类:as3.0笔记 | 评论:2

留言列表:

  • fool_tiger 发布于 2015/12/17 10:14:07  回复
  • 如果线是动态画出的,如何用位图填充,且填充效果如test4那个效果?
  • fool_tiger 发布于 2015/12/17 10:43:21  回复
  • test04中如果p1点位置是鼠标是点击的位置,位图填充效果就不太对了。
    • hanyeah 发布于 2015/12/17 16:01:34  回复
    • 创建一个Shape对象,Shape对象的坐标挪到鼠标点下的位置,Shape里边不就是从(0,0)点开始画了吗。
      画斜线的话,就让Shape旋转。

发表留言: