Flash动画设计交互式按钮

大三的时候上了一门课叫做《图形学》,当时老师给的第一个作业就是Flash动画设计,当然自己的这个Flash做的也不是太高级,放在这里给大家分享一下
一、 实验目的
1) 熟悉Flash操作界面,了解部分的功能和操作
2) 通过本次实验,掌握Flash绘制二维动画方法,了解二维动画的原理与实现方法
二、 实验环境
1. 硬件环境:PC机
2. 软件环境:Windows环境

三、 实验内容与步骤(可提供屏幕抓图)
1) 设计一个动画主题《春韵》,在主界面设计一个总的按扭
具体的按钮如何制作,我下一篇会教大家制作按钮
这可能会出现一些问题,注意一下stop()的放入位置,不然第一个按钮出现不了

Flash动画设计交互式按钮_第1张图片

按F9打开动作的框,插入如下代码
on(release)
{
gotoAndPlay(2);
}
在按钮对应帧的位置按F9,插入stop()
并在帧2的位置也插入stop()动作
2) ①点击主界面的按钮,实现按钮的交互式出现3个分按钮,依次点击进入相对应的界面。每一个画面要求包括动画故事,动画文字在内的动画作品。要求图文结合,动画效果突出。

Flash动画设计交互式按钮_第2张图片
②点击“春天的声”按钮,进入动画故事,在“春天的声”的动画故事当中建立一个与动画长短一样的图层,在图层的上面进行关键帧的插入使一句话的文字逐段出现。
点击春天的声的按钮在动作框中插入如下代码
on (release)
{
gotoAndPlay(3)
}
在动画播放完毕的帧插入动作stop()
第一幅画面
Flash动画设计交互式按钮_第3张图片
Flash动画设计交互式按钮_第4张图片
第二幅画面
Flash动画设计交互式按钮_第5张图片
Flash动画设计交互式按钮_第6张图片
第三幅画面
Flash动画设计交互式按钮_第7张图片
Flash动画设计交互式按钮_第8张图片
Flash动画设计交互式按钮_第9张图片
Flash动画设计交互式按钮_第10张图片
Flash动画设计交互式按钮_第11张图片
这里我只展示一个模块的制作过程,剩下的只给代码!!!!
②点击“春天的色”按钮进入,动画故事,在“春天的色”的动画故事当中建立一个与动画长短一样的图层,在图层的上面进行关键帧的插入使一句话的文字逐段出现。
点击春天的色的按钮在动作框中插入如下代码
gotoAndPlay这里注意下就会你的按钮跳转帧的位置,就如前面的第一个动画这个动画的起始位置在第3帧的位置就是gotoAndPlay(2)
on (release)

{
gotoAndPlay(338)
}
在动画播放完毕的帧插入动作stop()
③点击“春天的气”进入对应的动画界面,在“春天的气”的动画故事当中建立一个与动画长短一样的图层,在图层的上面进行关键帧的插入使一句话的文字逐段出现。

点击春天的声的按钮在动作框中插入如下代码
on (release)
{
gotoAndPlay(135)
}
在动画播放完毕的帧插入动作stop()
3) 设计返回按钮,放在每个交互式的动画图片下方,点击返回按钮课返回到,三个分按钮的界面。
点击返回在动作框中插入如下代码
最后最重要的就是这个返回按钮,当时帧2的位置相当于分按钮,这时就要有返回按钮在每个模块播放完后再次返回
on (release)
{
gotoAndPlay(2)
}
即可返回到三个分按钮的图片位置
Flash动画设计交互式按钮_第12张图片
四、 实验结果与分析(可提供屏幕抓图)
生成SWF文件后,动画的交互式以及图画和文字的结合都可以体现出来,但是文字跳转和图片之间的连接,当中还是有些位置的变动,具体还是在一开始的时候文字的跳转和图片之间的连接是在图层上直接进行的,没有进行元件的转换,导致在图层的一帧设置有问题后,最后的修改就比较难以进行,修改将会影响别的图层。
在用Flash创作的过程,当中图层与元件的灵活使用是极为重要的,Flash动画的创作就是帧的移动加上图层与元件的结合使其成为一个完整的动画,而将这两个灵活的使用可以使动画进行的更加的流畅。
五、 问题与建议
在实验当中我遇到的问题:一,在制作交互式的时候设置stop()的时候一开始实现不了,最后才发现要注意设置注意帧的位置。二,在自己弄补间动画的时候元件移动的同时图片也在移动,这里要注意帧长短的问题。三,在文字与图片结合的时候注意给文字新设置图层不然在后期修改的时候会比较麻烦。

最后告诉大家一个比较好用的方法,自己不想做动图的时候,就直接在网上找到GIF的动图直接复制进去就行,这时就会出现一个完美的动图,尽量将这个动图做成元件,不要直接放在主画面上,不然最后想要改动就会比较麻烦,尽量除了文字的其他东西不要直接插到主界面,都做成元件,再将元件放入主界面,后面改动的时候你就知道有多方便了!!!!!!,最好图片不要用补间动画,当时我用的时候就是麻烦贼多了,给动态文字用上就行,文字层记得不要和动画层在一起!!!!

你可能感兴趣的:(Flash动画设计交互式按钮)