Flash:从油画到照片


来源:   

我们来假设你在看到这篇教程之前,已经对Flash的基础动画有了一定程度的了解,这样我们就不用花大段篇幅来解释那些最基本的原理了。

  就像你已经知道的,Flash是一个基于矢量的程序。在Flash中,处理位图(包括bitmap, jpeg, gif, png格式的图像)最大的麻烦就在于,我们无法像操作矢量图形那样,熟练的操作位图。比如说,输入一幅位图图像,用它来做最简单的形状变化动画,就连这也是不可以的,更别说其它的了。如果你试着把图片拉伸,位图的特性会使图像产生像素化,图像品质会被降低。这些简单的操作对矢量图像而言自然是不在话下,所以,我们怎样才能将位图图像转化为矢量图像呢?这个问题我们可以交给Flash的“转化位图为矢量图”(trace bitmap)功能来解决。

  在这篇教程中我们详细解释了转化位图为矢量图这个功能,而且用它来创造从从一幅油画到照片的变形效果,如下面的动画所示。请注意:图像的变化非常细微,要想看清全部的效果,请注视图像一段时间,仔细观察它的改变。看到变形了吗?我们为这个动画设置了一直循环,如果设为播放一次,可能会有助于你仔细观察。

  源文件下载请点击这里
动画示例

  转化位图

  要想把一副位图转化为矢量图像,只需将一个图片的实例拖入主场景中,选择它,再选择修改>转换位图为矢量图(Modify > Trace Bitmap)命令。转换位图的功能是检查位图图像的颜色数量,颜色值相近的区域,被定义为近似形状的矢量形状,来替换位图。这里,你需要知道的很重要的一点是,用于代替的矢量形状仅仅是近似,而非完全相同。我们可以用转换位图对话框的一些选项来控制转换的精细程度。(图01)

图01

  颜色阈值(Color Threshold):范围从1到500。如果将两个像素进行比较,它们颜色值的差低于设定的颜色阈值,那么这两个像素的颜色被认为是相同的。所以,如果加大了阈值,那么转换来的矢量图的颜色就会减少。

  最小区域(Minimum Area):值介于1和1000之间。用于设定指定像素颜色时需要考虑的周围像素的数量,更确切的说,最小区域是跟踪位图时平均不同的颜色值。

  曲线拟和(Curve Fit):下拉列表的选项从像素到非常平滑,决定了绘制轮廓和区域的贴合程度。

  角阈值(Corner Threshold):下拉列表选项从较多转角到较少转角,它决定了保留锐利边缘还是进行平滑处理。


  还有一点需要注意:如果你增加了转换的精细度,那么形成的矢量图像的复杂性也会随之增加。一般来说,将位图转换为矢量图像可以减小文件大小,但如果包含复杂形状和太多的颜色,转换后的矢量图像的大小反而会比原来的位图文件还要大。从另一方面来说,对复杂的矢量对象而言,即使是最简单的操作,都会耗费大量的系统资源。

  对于要转换为矢量图形的位图来说,往往是连续色调的图像转换的效果较为理想,特别是那些logo图像。比如说,我们想改变下图例子中这个logo的形状。首先,导入位图图像,然后用不同的设置将图像“矢量化”。仔细观察,你会发现,例子中的第一个图形不太精确,在一些地方看起来有些平板。第三个图形是用Flash中的选取工具稍微改变了一下形状。在这里,我们可以随心所欲的用绘图工具来改变矢量图形的形状。(图02)

图02

  效果

  当你对导入的图片应用将位图转换为矢量图命令时,一些有趣的变化发生了。一幅典型的照片不像那些单色的logo,它包含很多不同的颜色区域。在跟踪位图之后,照片会被许多颜色块表现出来。随着转换设置的不同,这些块看起来会像是用画笔涂抹在画布上一样。我们的目的,就是创建从油画到照片之间的变形效果。

  过程

图04

  现在我们来创建照片效果。新建一个图形元件,命名为photo。从库中将位图拖入到图形元件编辑窗口中,用对齐工具对齐到中心。现在,按Ctrl+E,完成对元件的编辑,回到主场景的编辑窗口中。从库中将图形元件photo拖到photo层的第一帧中,同样用对齐工具居中对齐。这个图形元件将作为动画的前景。对位图是无法直接改变透明度的,所以我们需要将位图图片转换为图形元件。(图05)

图05

  准备工作完成之后,我们就可以着手制作动画了。油画背景的透明度保持不变。我们打算通过控制叠放在油画上面,photo元件的透明度来控制“变形”效果。选择photo元件,在效果面板中将其不透明度设为0%,或是一个很小的值(图06)。

图06

  现在在时间轴上,间隔若干帧创建一个关键帧,将这一帧的不透明度设为100%,间隔越大,画面的过渡就越细致。在透明度为0%(或很低)和100%的两帧之间创建补间动画。这样,照片会从无到有慢慢显示出来。在paint层中,在上一层插入关键帧的同一帧处,插入一个空白关键帧。这样,动画中就不会出现白色的空白了。动画从一幅油画渐渐过渡到真实的照片。同样道理,将第一帧的不透明度设为100%,而将最后一帧的不透明度设为0%,这样,动画将从照片过渡到油画效果。

  其它需要考虑的

  如果你觉得动画的速度过慢或有延迟的现象,就试着降低转换位图时的精细度,如果你觉得不能在画面质量和大小之间找到适当的平衡,就在转换位图之后接取屏幕图像,优化之后存储为位图,用它代替我们矢量化的位图来作为动画的背景。用捕屏图像代替跟踪位图的另一个原因是,这样可以减小影片大小。又可能是因为“矢量化的图像”太复杂了,与普通的位图相比,用掉了更多的空间。在这个例子中,如果用捕屏图像的话,可以使文件尺寸稍微小上一点。还记得我们的例子变化是多么细微吗?如果将动画速度提高,并用播放一次代替循环,那么我们可以使动画更容易观察。要知道,对每个不同的影片来说,不同的设置会带来不同的效果,要通过试验才知道哪种更合适。



  找到一幅你喜欢的照片,如果需要,在导入Flash之前对之调整大小。在将调整大小后的照片导入之前,尽量减少Flash中的文件进程。

  新建一个影片。建立两个层,将顶部的层命名为photo,底部的命名为paint(图03)。我们先从油画效果这部分开始。选择文件>导入到库命令,选择照片所在的文件路径,将其导入到库中。从库中把图片拖到paint层的第一帧上。将文档大小设为320×240像素(导入的位图大小),按下Ctrl+K,使用对齐工具,将图片对齐到舞台的中心。现在,确定图片被选择,运行将位图转换为矢量图命令。每张图片的情况不同,所以每次你要根据图片采用不同的设置。有了undo命令,你可以放心的试验不同的数值,直到图像呈现出你满意的效果。对我们这副图像而言,我们采用了默认的设置。当图像转换为矢量格式之后,你可以使用绘图工具修改个别区域。这个油画效果的部分就作为动画的背景。(图04)

图03

编辑:

相关内容

 娱乐专题

more...

高峰私生子

王伯昭被打

傅彪肝癌晚期

赵薇餐馆打人事件

《云南映象》图集

张铁林拖欠中介费

女医生状告赵忠祥

高虎被捕事件

演绎经典美丽

解读《十面埋伏》

揭示明星美丽秘诀

五颜六色娱乐圈

明星纤体大比拼

《绿茶》精彩影评

天地英雄

吕丽萍群星艺术学校被起诉

于娜出道前被包养是真是假?

香港英皇贪污丑闻追踪

多少明星追忆中

2003环球小姐大赛

 

 叨叨专栏

more...

冯小刚,你怎么敢抽"上帝"?

流氓与流氓

娱乐媒体,请站直一点

原来张铁林不是中国人!

《神雕侠侣》的悲惨前途

男人,要硬派不要阴柔

请不要随便脱裤子

李欣,《自娱自乐》的挺滋儿!

不服没用,人家就是红了!

陆毅演戏吧,别唱歌了。

 

 

 
报业集团
- 版权声明 - 广告业务 - 联系方式
Copyright (C) 2001-2002 dzwww.com. All Rights Reserved
大众报业集团网络中心主办
Email:webmaster@mail.dzdaily.com.cn