Flash制作诗情画意的水墨卷轴展开效果全教程

[复制链接]
查看8742 | 回复22 | 2008-11-27 17:52:40 | 显示全部楼层 |阅读模式
Flash制作诗情画意的水墨卷轴展开效果(一)

      在2008年北京奥运会开幕式上,那富有中国特色,充满诗情画意的卷轴,以及它所呈现给每一位观众的一幅幅无法言喻的美妙画面,给全球人们留下了深刻的印象,那么今天我们就教给大家用Flash来制作一幅诗情画意的水墨卷轴展开的动画。
  一、实例介绍
  水墨卷轴展开的动画实例主要用到了矩形工具和渐变填充工具,操作简单易懂,适合广大的初学者练习。
  二、效果预览
  水墨卷轴展开的动画实例效果如下所示:
  三、实例制作
  水墨卷轴展开的动画实例具体制作步骤如下:

  • 打开Flash 8软件。单击“开始→所有程序→Macromedia→Macromedia Flash 8”,打开Flash 8软件,如图1所示。
    tu1.jpg
    图1
  • 创建一个新电影。选择“文件→新建”命令,或者按下快捷键“Ctrl+N”,弹出“新建文档”对话框,在“新建文档”对话框的类型下面选择“Flash 文档”,单击确定,如图2所示。
    tu2.jpg
    图2
  • 修改影片大小。选择“修改→文档”命令,弹出“文档属性”对话框,将其中的工作区宽度设置成550px,工作区高度设置成250px,其它选项默认设置即可,单击确定按钮,如图3所示。
    tu3.jpg
    图3
  • 将图层1改名为“背景”,用矩形工具在工作区中画一个宽为497.9,高230.0的矩形,笔触颜色选择黑色,笔触高度设置为2,笔触样式选择实线,填充色选择为#BED0BF,如图4所示。
    tu4.jpg
    图4
  • 选择“窗口→对齐”命令,或者按下快捷键“Ctrl+K”,在弹出的对齐面板中,分别单击分布栏中的垂直居中分布和水平居中分布,如图5,6所示。
    tu5.jpg
    图5
    tu6.jpg
    图6
  • 选择“文件→导入→导入到舞台”命令,或者按下快捷键“Ctrl+K”,导入一幅准备好的水墨画图片到舞台,如图7、8所示。
    tu7.jpg
    图7
    tu8.jpg
    图8
子墨 | 2008-11-27 19:55:34 | 显示全部楼层

Flash制作诗情画意的水墨卷轴展开效果(二)

  • 按下快捷键“Ctrl+K”,分别单击分布栏中的垂直居中分布和水平居中分布,将导入的图片居中显示,如下图所示。
    t9.jpg
    说明的是,本实例的图片是之前就准备好的,如果没有设置合适的大小,就需要用任意变形工具将图片调整到合适的大小。
  • 用矩形工具画一个黑色的矩形放在图片后面,再用任意变形工具将黑色的矩形调整到合适的大小,形成图片的黑边框,并用调整它的位置,如下图所示。
    t10.jpg
  • 画轴杆。用矩形工具画一个细长的矩形轴杆,在颜色面板中将填充样式设为线性渐变,两端色块为#98B498,中间为白色,如下图所示。
    t11.jpg
  • 用矩形工具画两个黑色的细长矩形,并将两个矩形和轴杆放在一起并居中对齐,如下图所示。
    t12.jpg
  • 分别右键单击两个黑色矩形,选择“排列→下移一层”,将两个黑色矩形移置轴杆下方,如下图所示。
    t13.jpg
  • 用选择工具分别双击两个黑色矩形,将黑色矩形的两端调整成弧形,如下图所示。
    t14.jpg
子墨 | 2008-11-27 20:00:31 | 显示全部楼层

Flash制作诗情画意的水墨卷轴展开效果(三)

  • 选中轴杆,在属性面板中设置笔触颜色为黑色,笔触高度为1,再将轴杆和两端的黑色矩形组合,并调整到背景的水墨画的左端,完成卷轴的绘制,如下图所示。

    tu15.jpg
  • 选中画好的卷轴,按住Alt键水平拖动复制出另外一根卷轴,将它们并排放在图画的一端,如下图所示。
    tu16.jpg
  • 选中右边的卷轴,Ctrl+Shift+D将它分散到新的图层并命名为“右卷轴”。
  • 在背景层和右卷轴层中间,新建一个图层,并命名为“白矩形”,选中白矩形图层的第一帧,用矩形工具画一个白色的大矩形放在右边卷轴的下面,矩形要大到盖住下面的背景图画,如下图所示。
    tu17.jpg
  • 分别在三个图层的第100帧处按F5,给三个图层都插入帧。
  • 在“右卷轴”层的第50帧处按F6插入关键帧,并添加动画补间。在第50帧上将本层上的卷轴调整到图画背景的右端。如下图所示。
    tu18.jpg
  • 在“白矩形”层的第50帧处按F6插入关键帧,并添加动画补间。在第50帧上将本层上的白色矩形调整到图画背景的右端。如下图所示。
    tu19.jpg
  • 到此为止,本实例就制作完毕了,按下“CTRL+ENTER”测试影片,最终效果如下所示。
古风 | 2009-5-6 12:57:16 | 显示全部楼层

回复 3# 子墨 的帖子

为什么我按教程做的效果不是这样啊?速度太快了,不像这样比较缓慢。
子墨 | 2009-5-6 14:59:34 | 显示全部楼层
原帖由 qingkk 于 2009-5-6 12:57 发表
为什么我按教程做的效果不是这样啊?速度太快了,不像这样比较缓慢。


需要调整每秒的帖数,每秒帖数越多速度越快
古风 | 2009-5-7 09:31:57 | 显示全部楼层

回复 5# 子墨 的帖子

呵呵,已经解决了。
wangjieest | 2009-5-16 00:55:50 | 显示全部楼层
收藏了 这个方法````呵呵
lanhen2 | 2009-6-20 10:50:29 | 显示全部楼层
学习的好帖子,但是我一下学不来
心雨 | 2009-6-21 21:13:18 | 显示全部楼层
看了一下有点点印象,还得好好学习一番。楼主辛苦啦!
hdnf0501 | 2009-9-24 22:46:41 | 显示全部楼层
真漂亮,有时间也试试,怎么没有多点FLASH的教程呀
liuj0510 | 2009-10-5 10:50:27 | 显示全部楼层
好教程,学习中
jamson | 2009-10-23 14:06:54 | 显示全部楼层
好东西,学习了
longkui18011 | 2009-12-3 11:19:14 | 显示全部楼层
-0-拜服~~!!!!!!!~~!!!!!!!!!!!强大·!!!!!!!!!
Kevin327 | 2009-12-24 20:48:59 | 显示全部楼层
学习的好帖子,但是我一下学不来
youyou2010 | 2010-1-9 12:49:45 | 显示全部楼层
请求楼主发点zm杂志按钮制作的教程好吗???谢谢
您需要登录后才可以回帖 登录 | 注册

本版积分规则