当前位置：网站首页>An动画优化之遮罩层动画

An动画优化之遮罩层动画

2022-08-03 12:29:00 【雨翼轻尘】

在这里插入图片描述

文章目录

一、介绍
二、案例

一、介绍

遮罩层动画：不要的地方遮住，把想看的地方提出来。

导入一张图片。

并不能很好的贴合边框。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-MefwCy8A-1659423884342)(D:\Typora图片\image-20220802093901815.png)]$

将它F8转化为元件，类型为影片剪辑。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-SPbwEnIf-1659423884344)(D:\Typora图片\image-20220802094003042.png)]$

我们新建一个图层。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-c3X8iMrt-1659423884348)(D:\Typora图片\image-20220802094019628.png)]$

然后画一个黑色的矩形，并调整大小刚好是舞台大小。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-dSciXfhW-1659423884349)(D:\Typora图片\image-20220802094150029.png)]$

然后点击图层2，右键“添加遮罩层”。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-mB0BZ2MC-1659423884349)(D:\Typora图片\image-20220802094311050.png)]$

看一下效果（将不需要的地方遮住了）。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-BOnpWMrT-1659423884349)(D:\Typora图片\image-20220802094357225.png)]$

为什么不是遮住的地方看不见？
因为是把要看到的遮住，然后做成遮罩层后，遮住的地方会显现出来。

二、案例

接下来，咱们做一个小案例。

（1）解除锁定

先解除它们的锁定。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-4M94ji29-1659423884350)(D:\Typora图片\image-20220802141738248.png)]$

双击进入小猫咪。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-LAtB0ImA-1659423884350)(D:\Typora图片\image-20220802141808414.png)]$

（2）新建图层

然后我们新建一个图层2。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-TElYE8gW-1659423884350)(D:\Typora图片\image-20220802142049063.png)]$

（3）画一个椭圆

用【椭圆工具】画一个椭圆。

放大图片，在最中心画。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-xE7pQDFY-1659423884351)(D:\Typora图片\image-20220802142207564.png)]$

（4）创建关键帧

上下选中图层，按F6创建关键帧。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Zi4R5R86-1659423884352)(D:\Typora图片\image-20220802142358700.png)]$

然后在30帧的位置，将椭圆放大。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-co0ChDn5-1659423884353)(D:\Typora图片\image-20220802142652078.png)]$

（5）创建补间形状

对图层2，右键“创建补间形状”。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ztlArvmj-1659423884353)(D:\Typora图片\image-20220802142854983.png)]$

（6）设为遮罩层

右键，将图层2设为遮罩层。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-UlNu5vC0-1659423884354)(D:\Typora图片\image-20220802142956480.png)]$

（7）缓和帧

先解锁。（点击这个小锁即可）

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-tnDyGZSW-1659423884354)(D:\Typora图片\image-20220802143328673.png)]$

将整体向后移动。（鼠标左键全部选中，按住不动拖拽）

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-hLJuZ5Fm-1659423884354)(D:\Typora图片\image-20220802143433024.png)]$

点击这个点（第25帧），按Ctrl+C复制。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-zgMcO6gW-1659423884354)(D:\Typora图片\image-20220802143228201.png)]$

然后在第1帧，按Ctrl+Shift+V原位复制。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-rYVZLomP-1659423884355)(D:\Typora图片\image-20220802143356391.png)]$

图层1同理。（将第25帧复制到第1帧）

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-U0Pt42p2-1659423884355)(D:\Typora图片\image-20220802143502117.png)]$

后边添加帧直接按F5即可。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-P4Bw9B1E-1659423884356)(D:\Typora图片\image-20220802143616914.png)]$

（8）复制

将这一段选中（上下都有），按Alt键复制，拖拽到后边。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-B5ZZ2Zx1-1659423884356)(D:\Typora图片\image-20220802144023650.png)]$

然后将这一段，右键“翻转帧”。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-BY6pHjrP-1659423884357)(D:\Typora图片\image-20220802144042400.png)]$

（9）锁定看效果

然后咱们点小锁锁定它们。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-afhx9E2m-1659423884357)(D:\Typora图片\image-20220802144316060.png)]$

然后Ctrl+Enter看一下效果：

请添加图片描述

（10）效果

回到场景1。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-HRwrdH3Q-1659423884365)(D:\Typora图片\image-20220802144941032.png)]$

点击小锁锁上。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-QU1AH0CY-1659423884367)(D:\Typora图片\image-20220802145019845.png)]$

然后看一下最终效果。

请添加图片描述
今天的分享就到这啦，拜拜~
在这里插入图片描述

原网站

版权声明
本文为[雨翼轻尘]所创，转载请带上原文链接，感谢
https://blog.csdn.net/m0_55746113/article/details/126122750