![1a107e81f00cebee2f65dfb9db4b7241.png](https://i-blog.csdnimg.cn/blog_migrate/bfbcede5f06056e86f144030a1b9e2df.jpeg)
前面讲过跟随鼠标移动的遮罩效果,这里再进行升级讲解使用AS3代码制作黑板擦擦除文字的效果。
如何制作跟随鼠标的遮罩效果(AS3)jingyan.baidu.com FLASH如何制作半透明遮罩(AS3)jingyan.baidu.com主要知识点:鼠标跟随、动态遮罩
适用软件:所有支持AS3脚本的FLASH软件及Animate CC软件
制作步骤:
1.这里用的是Animate CC,打开软件,新建AS3文档。
![947633187bcdb28c271d6e8d83fc6cfb.png](https://i-blog.csdnimg.cn/blog_migrate/c3d1d1f3f578fdab189707b18c11e4f8.jpeg)
2.调舞台颜色为暗色,以对应黑板颜色。
![d7f1d7204e6a0c8838bdc1adf2a332ba.png](https://i-blog.csdnimg.cn/blog_migrate/ebd4250d19967bd1cb1e164f2f93e0ba.png)
3.使用文本工具在舞台上放置一个静态文本,并输入文字
![d3c731aea120dc261b75f4d5089f803f.png](https://i-blog.csdnimg.cn/blog_migrate/90be7379fde7c5fbb1fe160e7481e095.png)
![290295023e261b0662b5352a4fced379.png](https://i-blog.csdnimg.cn/blog_migrate/d582b450337287b58c306cc5cd383bd1.png)
4.选择文本,右键选择转换为元件,转换为影片剪辑
![3fe932b3da305ba3bdc8d6359315acc5.png](https://i-blog.csdnimg.cn/blog_migrate/54e130c9c2c7adf904a9d1efb2f5567a.png)
![8e5de1a6db89a51c974314c0dcd8d714.png](https://i-blog.csdnimg.cn/blog_migrate/91dbe366d6a60abb40064210a7fb2b4c.png)
5.设置影片剪辑实例名为txt_mc
![2b6300c4486f7f9d3058d96daed4385b.png](https://i-blog.csdnimg.cn/blog_migrate/04af71573dc0f737d479700b4c89fd11.png)
6.新建图层,使用矩形工具,填充为黑色画一个和舞台同样大小的矩形
![d71c670615ae5e5262c0a901277935bc.png](https://i-blog.csdnimg.cn/blog_migrate/44b94138c4103bc01c6bd3456a1d87e7.png)
![1db2a408a8d49cbbf548d27d2f001125.png](https://i-blog.csdnimg.cn/blog_migrate/8e29759127eb0b4d3ff9041d9bd8d6da.png)
![8378f21e9eb04be2ae58eb36225f71c5.png](https://i-blog.csdnimg.cn/blog_migrate/314bbb6a10d260a744a0490c918692a1.png)
7.将绘制的黑色矩形转换为影片剪辑,注意注册点在左上角
![508fc7e67f0dfccdf195f9d1b396be2c.png](https://i-blog.csdnimg.cn/blog_migrate/17d0a82b9775e026c633b7ea46581cd7.jpeg)
![516642b1abddbfcf6fdd0d615a8fc4aa.png](https://i-blog.csdnimg.cn/blog_migrate/9fbfdd32f7387cc678f081a8fc51ccbf.jpeg)
8.设置矩形元件的实例名为mask_mc
![1a5b39bb4bfe4bb7faaf689ea37d6a34.png](https://i-blog.csdnimg.cn/blog_migrate/eb833ba0c7209654fc11bfcda6015f99.png)
9.最后制作一个圆形影片剪辑元件,当作黑板擦,注意它的注册点在中心位置。
![dfd13e0a6ad267112efb1df0dba8ec8b.png](https://i-blog.csdnimg.cn/blog_migrate/f8eff044c8730d3dda1b2ba2eb64e754.png)
10.设置元件的实例名为clear_mc
![3e5c1535c9899b0761cee8cf9f14d001.png](https://i-blog.csdnimg.cn/blog_migrate/8f126cba9a01fc5e92ef43a01587eb8c.png)
11.准备工作已经结束,最后在主时间轴编写如下代码:
txt_mc.cacheAsBitmap=true;
mask_mc.cacheAsBitmap=true;
mask_mc.mask=txt_mc;
mask_mc.removeChildAt(0);
var shape:Shape=new Shape();
mask_mc.addChild(shape);
shape.graphics.beginFill(0xffffff);
shape.graphics.drawRect(0, 0, stage.stageWidth,stage.stageHeight);
shape.graphics.endFill();
shape.graphics.lineStyle(clear_mc.width,0x003333);//这里的颜色值为背景颜色
shape.graphics.moveTo(this.mouseX,this.mouseY);
this.addEventListener(Event.ENTER_FRAME,FollowMouseEvent);
function FollowMouseEvent(e:Event):void
{
clear_mc.x=this.mouseX;
clear_mc.y=this.mouseY;
shape.graphics.lineTo(this.mouseX,this.mouseY);
}
![7e02e1c712a330d8612ead237f6efae6.png](https://i-blog.csdnimg.cn/blog_migrate/f0363d44b778f109efca0bc2440dec26.jpeg)
12.运行后就可以移动鼠标看到文字被擦除掉了。
![2171408e068343eb9101e3d25f2e9a7f.png](https://i-blog.csdnimg.cn/blog_migrate/fe11b53c6f0053f0d2a18341665b0a46.png)
如果有相关的FLASH或者Animate操作及代码方面的问题可以私信或留言,尽力解答!
如果感觉我们的文章很有用,记得分享给朋友或同学,让更多人方便的学习到实用的Flash知识。