桑葚干最好不要买:利用透明遮罩实现的一种图片切换效果

来源:百度文库 编辑:偶看新闻 时间:2024/04/29 12:01:16
 

利用透明遮罩实现的一种图片切换效果

第一步:新建 flash文档,文档属性默认,另存为图片切换。

将三张图片导入到库,并重命名为图 1、图 2、图 3。

分别将三张图片处理一下:将图 1 拖到场景中并选中,

打开对齐面板,选中“相对于舞台” ,

匹配宽与高后全居中对齐(水平中齐、垂直中齐) 。

按f8 将图1 转换为影片剪辑元件,名称为 p1,

处理后将场景中的元件删除;

图 2、图 3 也如上处理,

并分别命名为 p2、p3,清空场景。

现在库里有图 1、图 2、图 3 三张位图

和 p1、p2、p3 三个影片剪辑元件。

第二步:将场景中的图层一命名为 p1,

并将 p1 元件拖进场景,全居中对齐,

在第 30 帧插入帧。p1 层上锁。

第三步:新加一图层,命名为 p2,

在第一帧将 p2 元件拖入场景中,全居中对齐。

选中 p2 元件,在属性面板上,

将实例名称改为p2,

并选中使用运行时位图缓存(如下图) 。

将 p2 层延长至 60 帧。
 第四步:新加一图层,命名为 m1 。

在第一帧,选中矩形工具,2 笔触不选,填充色为线性,

色值任意,色块设置如图,

第一个色块 alpha 值为 20%,其他 alpha 值为 100%。

在场景中画一宽为 800,高为 500 的矩形。

垂直中齐、右对齐后向右移 50 像素。

这个不用很精确,

主要就是遮罩这一层不透明的部分能够把图片完全遮住即可。

选中矩形,按 f8,将矩形转换为元件,

行为是影片剪辑,名称为 m1。

选中 m1 影片剪辑,

在属性面板上设置实例名称为 m1,然后添加模糊滤镜。

模糊 x,y值都为 50。

在第30 帧按 f6 插入关键帧。

回到第一帧,将 m1 元件向右移至场景外。

在第1帧至第30帧间建立动作补间。

最后将这一图层延长至第60帧。

第五步:新加一图层,命名为 as,选中第一帧,

打开动作面板,

输入语句:p2.setmask(m1);

现在可以测试一下,图片切换效果出来了吧!

第六步:在 m1 图层上新加两个图层,

下面的图层命名为 p3,

上面的图层命名为 m2,

在 p3 层的第 31 帧插入一空白关键帧,

将库中的 p3 元件拖入场景中居中对齐,

在属性面板中,将实例名称改为p3,

选中使用运行时位图缓存。

然后将此层延长至 90 帧。


在库里 m1 元件上点右键,

直接复制,

复制的 m1 副本命名为m2.在 m2 层的第 31 帧插入空白关键帧,

将 m2 元件拖入场景垂直居中, 右对齐,

然后向右移 50 像素。
 
在属性面板中将实例名称改为 m2,


添加模糊滤镜,

模糊 x、y 值均为 50。在第 60 帧插入关键帧。

将31帧的 m2 元件向右拖出场景。

在第 31 帧创建动作补间。

as 层的第 31 帧插入空白关键帧,

打开动作面板,输入:p3.setmask(m2);

第七步:前六步实现了从第一张图片到第三张图片的切换,

我们在测试的时候,发现影片循环的时候,

从第三张图片到第一张图片

是直接跳转的,所以我们再加一步,完成整个图片的切换。

在 m2 层上新加两个图层,

下面的命名为 pic1

(这个图层放的实际上就是 p1 元件,

但为了与 p1 层区别,所以命名为 pic1),

上面的命名为 m3.在 pic1 层的第 61 帧插入空白关键帧,

将 p1 元件拖入场景中居中对齐,

并将实例名称改为 pic1,

选中使用运行时位图缓存。

将图层延长至第 90 帧。

在库里的 m1 元件上点右键,

选直接复制,并将复制的元件命名为 m3。

在 m3 层的第 61 帧插入空白关键帧,

将库中的 m3 元件拖进场景,

垂直中齐,右对齐后向右移 50 像素。

选中 m3 元件,在属性面板上将实例名称命名为 m3,

并添加模糊滤镜,模糊 x、y 值均为50。

第 90 帧插入关键帧。

在第 61 帧将 m3 元件向右拖出场景,

创建动作补间。

as 层的第 61 帧插入空白关键帧,

打开动作面板,输入:pic1.setmask(m3);

测试存盘。