imageready——动化和切片

《imageready——动化和切片》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。

1、第13章ImageReady——动化和切片本章重点本章主要讲解Photoshop的捆绑软件——Imageready在制作网页方面的强大功能,如制作GIF动画、为图像创建映射区域、切割网页图片等功能。14.1用Imageready制作GIF动画GIF动画是目前WEB页面广为采用的动画格式，在WEB页面中插入动画，能够使页面更美观，更具有欣赏性。GIF动画是由一系列帧连续地播放出来，就产生了动画效果。制作GIF动画的方法有很多，使用Photoshop与Imageready结合来制作动画可以制作出很好的效果出来，而且在优化动画图像方面也能取得很好的效果。使用Photoshop与Imageready

2、结合来制作动画的步骤一般首先在Photoshop里处理好图像，在单击工具箱下面的图标（切换到Imageready图标），就可以进入到Imageready下，然后用Imageready来制作动画。如图14-1所示是Imageready的截面。Imageready的工作环境和Photoshop差不多，而且工具箱里的很多工具、菜单、浮动面板等都相同。在Imageready下有一个得数的浮动面板，如图14-2所示，这个面板继承了Animation（动画）、Rollover（滚动按钮）、ImageMap（图像印射）和Slice（切片）面板，这些面板都是用于设计Web页面的，这里要将的是针对动画制作的A

3、nimation（动画）面板。有关动画的制作具体可参考本章案例“GIF动画的制作”。1．添加新帧当打开一幅图像或从Photoshop里设计好图像再转到Imageready后，在Animation面板中就会自动把图像作为动画的第1帧。在Animation面板下面有一排按钮用来控制动画，见图14-3。动画由很多帧组成，一帧是构不成动画的。单击下面的“创建新帧“按钮，就创建了第2帧，第2帧中的图像与第1帧中的图像是一样的，如图14-4所示。为了有动感，第2帧必须与第1帧不用，这就需要编辑帧。2．编辑帧编辑帧中的图像一般都是在图层面板中进行的。观看图层面板，就会发现Photoshop里的图层在Ima

4、geready依然保存着。在图层中编辑帧时需要注意下面几点。1.对某一帧的图层使用Layers面板的命令及选项，如不透明度、混合模式、可见性、位置，图层效果等只会影响当前的帧。2.如果使用其他命令及工具，如画笔、喷枪等图像描绘及编辑工具、色彩校正及调整命令、滤镜、蒙版等，则会影响所有的帧。3.增加一个图层，将会增加到所有帧。4.显示和隐藏图层，则该图层的可见性只在当前帧中改变。选择第2帧，在图层面板上把Layer4的Opacity（不透明度）值改为80%，然后创建第3帧，把Layer4的Opacity值改为60%,创建第4帧，把Layer4的Opacity值改为0%，至此，所有的帧就全部创建

5、完成。、单击面板下面的播放按钮，观看一下动画效果，速度太快了一点，但可以进行调节，在每帧的下面有一个延迟时间，单击小三角就会弹出一个菜单，里面预设了很多时间，你可以根据自己的需要选择一个时间，如果你想把时间设为其他值，就选择Other选项，然后输入要延迟的时间。也可以控制动画循环的次数，面板菜单下的第1个按钮就是控制循环次数，默认是Forever（永远循环），还有另外两个选项：Once表示循环一次，Other则是让读者自己设定循环次数。在面板下面还有一个Time（时间帧）按钮，这个按钮将在两帧之间加入一些中间帧，以使两帧之间自然过度。单击这个按钮时会弹出一个对话框，如图14-6所示。Laye

6、rs栏中有个两个选项：AllLayers表示加入的帧包括图像所有的图层，SelectedLayer表示加入的帧只有当前操作的层。Parameters栏中有3个选项：Position表示的帧中按层的位置表化，Opacity表示加入的帧按图层的不透明度变化，Effects表示加入的帧按效果进行变化。TweenWith用来确定在哪里帧，有3个选项：NextFrame表示在选中的帧与下一帧之间加入帧；FirstFrame（仅当选中最后一帧时有效）和LastFrame（既当选中第一帧时有效）表示在第1帧与最后一帧之间加入帧；PreviousFrame表示在选中的帧与上一帧之间加入帧。FramestoA

7、dd用来确定在两帧之间加入多少帧。其实上面做的是创建新帧，然后改变Poacity，共创建了6个帧。实际运用Tween按钮，只需要两个帧，一个Opacity为100%，一个Opacity为0%，选中第1帧，然后单击Tween按钮，在Layers中选择AllLayers,在Parameters中选择Opacity，在TweenWith中选择LastFrame，在将FramestoAdd改为4就可得到完全相同的效果