快速业务通道

用Flash制作旋转展厅

作者 佚名技术 来源 服务器技术 浏览 发布时间 2012-07-10


  旋转展厅是一个很实用的效果,许多大型的网站和个人主页都采用了这种效果,效果如图0所示。旋转展厅的功能就是通过旋转来展示图片。那这种功能如何通过Flash来实现呢?其实也很简单,读者只要懂一点AS知识即可完成。下面,笔者就来教大家制作旋转展厅的方法。

  首先,设置场景的大小为700*200像素,背景色为白色,帧频为12fps。当然,用户可以根据自己具体的需要来设置场景的大小,但代码中的数值需要做相应的改变,这个笔者将会在文中做交代的。

  1.按快捷键Ctrl+R导入4张图片,分别命名为“1”、“2”、“3”、“4”,如图1所示。

图1 ??? 2.创建一个名为“图片”的影片剪辑元件。按快捷键Ctrl+L打开“库”,把“库”中的“图片”拖入该元件场景的1至4帧中。接着按住Shift键点选第1帧和第4帧,再点选右键,在弹出的菜单中选择“拷贝帧”命令,再右键点选第5帧,在弹出的菜单中点选“粘贴帧”命令。注意:图片的左顶点要在场景中央的位置上。如图2所示。调节图片的位置可以按快捷键Ctrl+K打开“对齐”面板进行辅助设置。 图2   3.按快捷键Ctrl+F8创建一个名为“图片动画”的影片剪辑元件。在元件的编辑场景中创建一个“脚本”层和一个“图片”层。如图2所示。点选“脚本”层的第2帧并按F7键插入一个空白关键帧。右键点选该帧,按F9打开“动作”面板输入一下代码。这段代码主要是虚拟图片的三维效果,实现图片前后的层次感。

// 3d 转换
theta += _parent.speed;
xbit = Math.sin(Math.PI/180 * theta);
ybit = Math.cos(Math.PI/180 * theta);

// 加350使图片围绕场景中央旋转
this._x = xbit*this.radius+350;
this._y = 100;
this._alpha = 30+(ybit+1)*60;
this._xscale = ybit*this.panel+50;
this._yscale = this.panel+(ybit+1)*3+80;

// Math.round()是将参数 x 的值向上或向下舍入为最接近的整数并返回值
stack? =Math.round((ybit+1)*radius*2);
if (stack==100) {
?stack=101;
}

// swapDepths()可以将一个影片移到另一个影片的上面或下面
this.swapDepths(stack);

  4.按快捷键Ctrl+L打开“库”面板,把“库”中的“动画”元件拖入场景的“图片”层中。“动画”元件和场景的位置关系见图3所示。
图3   5.设置好“图片动画”元件后,在“库”中右键点击之,在弹出菜单中选择“连接”命令,并如图4所示设置。我们将在后面的代码中对该一片进行链接。 图4   6.回到主场景。创建一个“脚本”层和一个“图片”层。“图片”层中的的设置随意。点选“脚本”层的第1、2、3帧按F5键插入帧。新建一个“脚本”层,然后分别点选层中的第2、3帧并按F7键插入空白关键帧。分别点选“脚本”层中的3帧,按F9键打开“动作”面板,键入如下代码。

第1帧代码如下:

var num_img = 8;
for (i=0; i??? new_img = "img"+String(i);
??? this.attachMovie("img", new_img, i+1);
??? this[new_img].theta = i*360/num_img;
??? this[new_img].radius = 250;
??? this[new_img].my_img.gotoAndStop(i+1);
}

第2帧中的代码如下:

speed = _xmouse/80;

第3帧代码:

gotoAndPlay(2);

  整个效果到这里就完成了,按快捷键Ctrl+Enter测试一下吧,相信效果一定会令你满意的。
  该效果源件下载(22.9K)   点击最后一页预览效果 [1]?[2]?下一页?? 上一页??[1]?[2]? 关键词:

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号