最近在网上看到许多精美的PS翻页倒计时模板,深受启发,便萌生了制作动画版的想法。经过尝试,终于成功实现了动态翻页效果,现在分享给大家。为了阅读体验更佳,避免内容过长令人疲惫,我将分段呈现,先展示最终的动画效果,后续再逐步讲解实现过程。
1、 本文有一定难度,初学者慎入,为节省篇幅部分配图已省略。
2、 启动Flash CS6,选择新建文件,点击ActionScript 3.0项目(注意不是ActionScript 3.0类模板),创建空白文档即可开始操作。
3、 选用矩形工具,将颜色设为灰黑色,圆角调整为8,在画面中绘制合适尺寸的长方形,效果所示。
4、 使用文字工具,选取较粗字体并设文字颜色为白色,在灰黑方块上方输入数字0,调整字号及运用变形工具设置合适大小,使数字呈现理想视觉效果,具体样式参考示意图。
5、 选取第一帧,连续按F6键在第1帧后插入9个关键帧。将第1到第10帧上的数字依次改为9至0,并逐一调整每个数字与背景的居中位置。之所以使用9到0而非0到9,是因为需要实现倒计时效果,使数字牌从9逐个翻转至0。
6、 点击编辑多帧按钮,拖动时间轴上的句柄以覆盖全部帧,操作详情见示意图。
7、 在时间轴上选中所有帧,使用对齐工具将所有图形垂直居中对齐。接着按Ctrl+B将所有图形打散。选择直线工具,设置线条颜色为红色,在场景中绘制一条水平直线,并将其垂直居中对齐。打开视图中的标尺工具,从Y轴拖出一条参考线,使其与红线上位置重合,最后删除红色直线。
8、 选取参考线上半部分,连续上移三次;再选下半部分,连续下移三次,最终呈现所示图形。
9、 关闭编辑多帧功能,先选中第一帧的上半区域,按下F8键将其转换为影片剪辑,命名为9s(表示数字9的上半部分),接着选中下半区域,同样按F8键转为影片剪辑,命名为9x(表示数字9的下半部分)。依照此方法,依次对后续九个帧的上下两部分进行相同操作,分别创建对应的影片剪辑,并赋予易于辨识的名称。完成操作后,库中将自动生成共20个元件,涵盖十个数字各自的上下半部分。本节内容到此结束,下一节将详细介绍如何实现翻牌动画效果。
