注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

《电脑之家》

请点击:“日志”浏览电脑知识

 
 
 

日志

 
 

[原创]图片缩放制作教程  

2010-04-13 16:55:45|  分类: 图片缩放制作教程 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

 双重遮罩制作实例单向缩放的原理与方法

   

    教学目的:通过本节教学了解和掌握双重遮罩的使用和动画补间与形状补间的创建,进而运用上述原理制作实例单向缩放的动画效果。

  教学对象:本教材是针对有一定动画制作基础和对工具箱、属性面板有所了解的朋友们编制的,因此省略了一些步骤,还望谅解。

    教学要点:遮罩、补间。

 

 

     作前准备:准备一张规格为550*400图片,经过制图软件(ps、fw)处理后保存到指定的文件夹待用。   

   制作步骤

    1.启动FLASH8 软件

    2.确立文档属性 设置动画尺寸为550*400,背景颜色随意,其它默认,点击确定,进入场景1。 如图1所示:

图1

     3.编辑制作场景 添加三个图层,共四个图层,自下而上命名为大图片、大遮罩、小图片、小遮罩。


    (1)选择大遮罩图层第一帧,用矩形工具在舞台拖一个规格为550*400的,无边线的矩形,颜色随意。全居中,并将其转为图形元件。在第80插入帧。上锁。

    (2)选择大图片图层第一帧,导入以准备好的图片到舞台,设置规格为550*400,全居中,并将其转换为图形元件。其素材图,如图2所示:

图2

选中该图片将其规格放大为550*650,水平中齐,底对齐。如图3所示:

图3

在第70帧插入关键帧,在第80帧插入帧;返回第30帧插入关键帧,将大图水平中齐,上对齐。在第40帧插入关键帧。如图4所示:


图4

分别依次点击第1、第40帧,创建这两区域间的动画补间。设置大遮罩层为遮罩层。关闭这两个图层的眼睛。

    (3)选择小图片图层第一帧,从库中拖出图片图形元件到舞台,全居中,在第80帧插入帧。上锁。

    (4)选择小遮罩图层第一帧,从库中拖出矩形图形元件到舞台,全居中,并将其打散。在第30帧、第40帧插入关键帧。用任意变形工具选中该实例,并将其注册点移到下方中间。如图5所示:

图5

选中第1帧上的实例,将其向下推至其规格为550*10。如图6所示:

图6

右键该图层第1帧,复制帧,再在第70帧粘贴帧(使两帧上的实例相同),在第80帧插入帧。分别依次点击第1帧、第40帧,在属性面板创建这两个区域间的形状补间。设置该图层为遮罩层。

至此实例竖向缩放完成。下面我们来作实例横向缩放:

    首先,在各个图层的第81帧插入关键帧。然后,关闭上两个图层的眼睛,点开下两个图层的锁和眼睛。

    (5)选择大遮罩图层第180帧插入帧,上锁。

    (6)选择大图片图层第81帧,将图片规格设置为800*400,水平中齐,左对齐。如图7、图8所示:

图7

图8

在第170帧插入关键帧,在第180帧插入帧;返回第120帧插入关键帧,将大图水平中齐,右对齐。在第130帧插入关键帧。如图9所示:

图9

分别依次点击第81、第130帧,创建这两区域间的动画补间。设置大遮罩层为遮罩层。关闭这两个图层的眼睛,点开上两个图层的眼睛和锁。

    (7)选择小图片图层第180帧插入帧,上锁。

    (8)选择小遮罩图层第81帧,将小遮罩逆时针旋转90°,水平中齐,左对齐,并保持注册点在左中。如图10所示:

图10

在第170帧插入关键帧,在第180帧插入帧。返回第120帧插入关键帧,将该帧上的实例向右拖,并覆盖整个场景,在第130帧插入关键帧。分别依次点击第81帧和第130帧,在属性面板创建这两个区域间的形状补间。设置该图层为遮罩层。


    4.本作业完成后时间轴显示如图11所示:



图11
 

  5.测试存盘

    *说明: 

    1.此作业表述繁琐,操作简单,观感较佳。朋友们在制作中边操作边领悟其中之原理,举一反三,展开创意。

    2.利用此原理与方法制作一个实例双向缩放,其效果又会如何呢,有兴趣的话你不妨试试看。

  最终效果显示:

 在线视频

  评论这张
 
阅读(294)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017