📄 线性动画.htm
字号:
<html>
<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>线性动画</title>
</head>
<body bgcolor="#CCFFFF">
<p align="center" style="margin-left: 0; margin-right: 0; margin-top: 0"><font color="#FF0000" size="6" face="华文中宋"><b>Flash</b>
</font><font face="华文彩云" color="#FF0000" size="6"> 基础</font></p>
<p align="left" style="margin: 0"><font face="黑体"><font size="1" color="#008000"><本课必须</font><font SIZE="1" color="#800000">付费</font><font SIZE="1" color="#008000">才能使用，付出才有收获，劳动最光荣></font></font></p>
<p style="line-height: 150%; margin: 0"><font size="5" color="#0000FF">十四、线性动画</font>
</p>
<p style="line-height: 150%; margin: 0">
<font color="#0000FF">线形动画</font>主要是对象位置的移动，我们通过一个例子来学习，动画的效果是三段文字，分别从上方、左边和右边进入工作区，然后再旋转一段文字，这样就至少需要4个图层来放置各段文字。</p>
<p style="line-height: 150%; margin-top: 0; margin-bottom: 0"> <font color="#0000FF">三段文字</font>分别是“八十六团学校”，“初二（1）班”、“李江鹏”，旋转的是“美丽的校园”(班级、姓名改成<font color="#800000">自己的</font>）<br>
<font color="#0000FF">1、首先</font>制作第一段文字，选择<font color="#800000">文字</font>工具，并在“<font color="#800000">属性</font>”面板中的“字体”中设置文字的字体为“华文彩云”，文字大小为36，颜色为红色。<br>
<font color="#0000FF">2、确定</font>文字的位置，在工作区外的正上方<font color="#800000">点一下</font>鼠标左键，在出现的文字框中输入“八十六团学校”。用箭头工具选取文字（文字外面有一个蓝框），选择“插入”菜单中的“转换为元件”命令，将文字转换成一个名为“<font color="#800000">文字1</font>”的图形符号，转换成组件互不干扰。<br>
<font color="#0000FF">3、再</font>制作第二层文字，按一下“<font color="#800000">插入图层</font> (+)”按钮，新一个图层，选择图层2的第一帧，用文字工具，选择<font color="#800000">楷体</font>、<font color="#800000">绿色</font>，在工作区外的左下角点一下，在文字框中输入“<font color="#800000">初二（1）班</font>”。用选择工具选取文字，选择“插入”菜单中的“转换成元件”命令，将文字转换成名位“<font color="#800000">文字2</font>”的图形符号。<br>
<font color="#0000FF">4、</font>用同样的方法，新建图层3，在工作区外的右下角输入<font color="#800000">宋体蓝色</font>的“李江鹏”同样以“文字3”为名转换成图形符号。以“<font color="#800000">线性动画</font>”为文件名，保存一下文件；</p>
<p style="line-height: 150%; margin-top: 0; margin-bottom: 0"> <font color="#0000FF">制作动画:</font>
</p>
<p style="line-height: 150%; margin-top: 0; margin-bottom: 0"> <font color="#0000FF"></font>
<font color="#0000FF">1、</font><font color="#0000FF">首先</font>给三个图层加到50帧，注意帧面板下边状态栏的最右边的两个按钮，点一下右边的让帧往右移动（或者移动帧指针也可以），找到第50帧单击<font color="#800000">鼠标右键</font>，选取“插入帧”命令，使每一图层都拥有50帧长度。<br>
<font color="#0000FF"> 2、在图层1</font>至图层3的第10帧上插入<font color="#800000">关键帧</font>，使每一图层的第10帧为关键帧。依次选中三个图层的第10帧，用箭头工具拖动其中的文字到工作区<font color="#800000">中央</font>，使三段呈金字塔三角形排列，<font color="#800000">保存</font>一下文件；</p>
<p style="line-height: 150%; margin-top: 0; margin-bottom: 0"> <font color="#0000FF">3、</font> <font color="#0000FF">接下来就为</font>这三层文字添加动画流程，在图层1的第一帧上单击鼠标<font color="#800000">右键</font>，选择“属性”命令，调出属性面板，点击面板中的按钮，将“<font color="#800000">没有</font>”选项改为“<font color="#800000">移动</font>”（如下图）从而产生动作动画，在将下面的输出选项的0改为100，使文字移动先快后慢，同样再用鼠标左键单击图层2和图层3的第一帧，修改动作动画效果，输入完后关闭面板；</p>
<p style="line-height: 150%; margin-top: 0; margin-bottom: 0"><img border="0" src="简.jpg" width="124" height="46"><br>
<font color="#0000FF">动画的效果</font>是“八十六团学校”文字先移动，然后再是“初二（1）班”，最后是“李江鹏”。因此三者有个时间差，这可以通过在时间轴上插入空白帧来实现，也可以把关键帧往后拖；<br>
<font color="#0000FF">1、</font><font color="#0000FF">选</font>取<font color="#800000">图层2</font>的第1帧到第10帧（用Shfit键），然后用鼠标左键拖拽整个10帧到第11帧位置开始。右边如果有多出的不整齐部分就删掉,有错误的关键帧就用“清除关键帧”转为空白帧；<br>
<font color="#0000FF">2、</font><font color="#0000FF">同样</font>将图层3图层上的第1帧到第10帧移到第21帧位置；<br>
<font color="#0000FF">3、接着</font>选取图层1至图层3的第32帧，然后在单击鼠标右键，选择“插入关键帧”命令，使每一图层的第32帧成为关键帧（第32帧将作为下一个动画的起始帧），<font color="#800000">保存一下文件；</font></p>
<p style="line-height: 150%; margin-top: 0; margin-bottom: 0"> <font color="#0000FF"></font>
<font color="#0000FF">接下来</font>制作旋转动画，分别在三个图层的第40帧插入关键帧，再添加一个图层4，选取图层4的第40帧，插入一个关键帧，制作下一段动画；<br>
<font color="#0000FF"> 1、</font><font color="#0000FF">在工作区</font>的中央输入文字“美丽的校园”。用<font color="#800000">箭头工具</font>选中文字（出现蓝框），在菜单栏中“修改”菜单中选择“<font color="#800000">分解组件</font>”命令，将文字分解成打散图形，看一下效果；<br>
<font color="#0000FF">2、添加渐变色</font>：打开窗口菜单中的面板中的“<font color="#800000">调色板</font>”面板，选择“<font color="#800000">线性</font>”渐变效果，实线没有变化效果，这时下方出现默认的<font color="#800000">几个</font>渐变色游标，留上三个，其他的向下拖出就可以删除（添加只要在<font color="#800000">游标之间</font>点一下鼠标左键），选中<font color="#800000">第一个</font>游标，在右侧的颜料板中选择红色，将剩下两个设为<font color="#800000">绿色</font>和<font color="#800000">蓝色</font>。，在左侧可以看到效果，点一下<font color="#800000">右上角</font>的按钮选择“添加样本”加入到调色板中（删除渐变色在“<font color="#800000">颜色样本</font>”面板里）；</p>
<p style="line-height: 150%; margin-top: 0; margin-bottom: 0"><img border="0" src="调色板.jpg" width="263" height="252"><br>
<font color="#0000FF">3、选中</font>所有“美丽的校园”文字，选取油漆桶工具，选中刚才的渐变色，从右至左喷色，<font color="#800000">注意</font>准确地喷在文字上，填充上渐变色，看一下效果；<br>
<font color="#0000FF"> 4、</font><font color="#0000FF">用箭头</font>工具，将渐变色文字<font color="#800000">全部选中</font>，转换为一个名位“<font color="#800000">文字4</font>”的<font color="#800000">图形</font>符号，<font color="#800000">保存一下文件；</font><br>
<font color="#0000FF">5、同时选中</font>图层1至图层4层的第40帧，选择“窗口”菜单中的“排列”面板，在“<font color="#800000">排列</font>”选项中找到“水平排列”<img border="0" src="水平排列.jpg" width="24" height="19">和“中间垂直排列”<img border="0" src="中间垂直.jpg" width="24" height="19">按钮，使文字水平垂直排列，同样在“分布”选项中选择“水平中间分布”<img border="0" src="中间垂直.jpg" width="24" height="19">和“垂直中间分布”<img border="0" src="水平中间.jpg" width="24" height="19">，看一下文字排列的变化。<br>
<font color="#0000FF">6、</font><font color="#0000FF">接下来</font>时是<font color="#800000">色彩深度</font>的渐变，选取图层1的40帧，打开“属性”面板，点击“没有”旁边下拉按钮，选择“Alpha"<font color="#800000">透明度</font>选项，将值100%改为0，看一下场景中对象效果。<br>
<font color="#0000FF">7、</font><font color="#0000FF">同样</font>将图层2到图层4的第40帧的对象都调成透明（Alpha为0），<font color="#800000">保存一下文件；</font><br>
<font color="#0000FF">8、创建动画：</font>选择图层1到图层3的<font color="#800000">第32帧</font>，在帧上单击鼠标右键，选择“创建动作动画”命令，看一下帧的变化，<font color="#800000">保存一下文件；</font><br>
<font color="#0000FF">9、</font><font color="#0000FF">在</font>图层4中的第50帧上按一下右键，选择“插入关键帧”命令，插入一个关键帧，其他三层加长到50帧；<br>
<font color="#0000FF">10、</font>将图层4的<font color="#800000">第50帧</font>对象恢复为不透明，可以在“效果”面板中将“Alpha”改为100%，然后在图层4的第40帧上按鼠标右键，选择“创建动作动画”命令。看一下帧的变化，<font color="#800000">保存一下文件；</font></p>
<p style="line-height: 150%; margin-top: 0; margin-bottom: 0"> <font color="#0000FF"></font>
<font color="#0000FF">双击</font>时间轴上的“12.0”将速度调慢为<font color="#800000">6</font>，然后按Ctrl＋回车键测试影片，来看看整体的效果。</p>
<p style="line-height: 150%; margin-top: 0; margin-bottom: 0">
<font> <font color="#0000FF">本节</font>主要介绍了使用Flash制作线性动画，这是最基础的。</font>
<p style="margin-top: 0; margin-bottom: 0"><img border="0" src="线性动画.jpg" width="729" height="184"></p>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -