快速业务通道

dynamic mask动态遮罩[高级]

作者 佚名技术 来源 服务器技术 浏览 发布时间 2012-07-12


DYNAMIC MASK 动态遮罩

Flash DRAWING API除了可以让我们绘制图形外,我们还可以应用它绘制遮罩,而这种绘制的遮罩的特点就是我们可以动态的绘制.

怎样使用FLASH DRAWING API 绘制遮罩

MM提供的遮罩的有如下这几种:
代码:

MovieClip.beginFill
MovieClip.beginGradientFill
MovieClip.clear
MovieClip.curveTo
MovieClip.endFill
MovieClip.lineStyle
MovieClip.lineTo
MovieClip.moveTo


在实际的应用中我们可能不会全都用上,如下面的例子中我们会应用到beginfill,lineto,moveto,endfill等.

下面我们就开始学习,先看一个简单的例子.

我们要在屏幕上绘制一个遮罩,并用它的来做遮罩,为了实现上面的效果,我们需要在场景中导入一个图片,并将其转换为影片剪辑,命名为maskee.然后我们在主帧上加入如下代码:

代码:

this.createEmptyMovieClip(''square'',0);
with(_root.square)
{
moveTo(0,0);
beginFill(0x000088)
lineTo(100,0);
lineTo(100,100);
lineTo(0,100);
endFill();
}



上面的代码我们已经完成了方形的绘制,现在你可以测试你的影片,同时你可能注意到这里使用了with,目的是使我们的代码看起来更清晰,当然你也可选择其它的方法,如下,你可进行一下对比,你会认为哪一种更清晰,更易读一些.
代码:

this.createEmptyMovieClip(''square'',0);
_root.square.moveTo(0,0);
_root.square.beginFill(0x000088)
_root.square.lineTo(100,0);
_root.square.lineTo(100,100);
_root.square.lineTo(0,100);
_root.square.endFill();


上面的代码我们只是绘制了方形,现在你就可以测试你的影片,如果想把我们绘制的形体指定为遮罩只需要在下面加上一行代码:
代码:


_root.maskee.setMask(_root.square);


这一行代码的意义在于将我们绘制的方形指定为maskee的遮罩,同时我们在上面应用了clear()方法,它的作用是清除square之前的动作。
测试你的影片

接下来我们来看几个例子:
影片1:可拖动的遮罩

根据上面我做的基础,仍然使用上面的maskee影片剪辑,将主帧上的代码清除,我们将下面的代码加在maskee影片剪辑上,而不影片剪辑的帧上,
代码:

onClipEvent(load)
{
_root.createEmptyMovieClip(''square'',0);
function drawSquare()
{
x = _root._xmouse;
y = _root._ymouse;
with(_root.square)
{
clear();
moveTo(x-50,y-50);
beginFill(0x000088)
lineTo(x+50,y-50);
lineTo(x+50,y+50);
lineTo(x-50,y+50);
endFill();
}
}
this.setMask (_root.square)
}
onClipEvent(mouseMove)
{
drawSquare();
updateAfterEvent();
}


测试你的影片,你会发现一个100*100的方形在随着光标移动并可为一个遮罩,与上个例了不同的是我们将绘制方形的代码定义为一个函数drawSquare();因为我们要在光标移动的时不断的调用它。另外上面用到了clear()方法,它的作用是清除square剪辑之前的所有动作。

观看演示1
http://www.webstudio.com.cn/forum/showthread.PHP?p=66#post66

刚才我们提到一个问题就clear()方法的应用,试想一下如果我们不加clear()这一行代码。你可以想象一下会发生什么。现在我们将clear()这一行删除或是加上注释.测试你的影片,你就会看到一种擦除效果,你还可以加上你自已的创意,变成任意的形状。

观看演示2
http://www.webstudio.com.cn/forum/showthread.php?p=66#post66

影片2:像素淡出遮罩效果

这种效果你可能会在PowerPoint或是在Director中见过,在本例中不需要你理解每一行的意义,这里只是对淡入遮罩的一个提示。我们仍使用上文中的例子,清除原有maskee上的代码,加入如下代码

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号