在Flash中用Action Script实现3D效果(1) -pc6资讯

您的位置：首页 → 网页设计 → Flash → 在Flash中用Action Script实现3D效果(1)

在Flash中用Action Script实现3D效果(1) 时间：2004/11/7 2:22:00来源：本站整理作者：蓝点我要评论(0)

　　　　　　　　　　　　

　　　　　　　　　　　　众所周知，Flash中要实现3D效果是比较麻烦的，下面我们就用Action Script来实现一个比较简单的3D效果。先看看最终效果，一个看起来像是3D效果的花在场景中旋转，在旋转的过程中会改变颜色，还会响应鼠标作相应的动作。静态效果如图1所示。

　　下载源文件请点击这里。

　　最效效果演示：

　　一、实现原理

　　要在只能显示二维图形的Flash中显示三维图形，很关键的一点就是如何将三维坐标转换为二维坐标。另外，如何对三维坐标进行操作，如何渲染最终的显示效果，都是颇有难度的。

　　在此实例中，我们首先将三维的坐标值保存在数组里面，对这些坐标值进行操作后，根据一定的规则对数组里面的值进行相应计算，转换成二维坐标，对二维坐标值进行渲染和显示控制，就得到了最终的显示效果。

　　二、实现步骤

　　1、打开Flash MX 2004，新建一个场景，设置场景的大小为700 px * 525 px，背景为黑色。

　　2、按“Ctrl + F8”新建一个Movie Clip，命名为“circle”，类型为Movie Clip，在此Clip中用“Oval tool”绘制一个椭圆形如图2所示。

　　3、按“Ctrl + F8”新建一个Movie Clip，命名为“line”，类型为Movie Clip，将上一步制作的“circle”Clip拖到此Clip的场景中，命名为“circle”。在此Clip的时间轴的第30帧上面点击鼠标右键，选取“Insert key frame”，从而插入关键帧。选取第30帧的场景里面的“circle” Clip，设置属性如图3所示。在第60、90帧上面插入关键帧，分别设置场景里面的“circle” Clip属性如图4、5所示。最后在第120帧上面插入关键帧。

　　4、点击 “line”Clip中时间轴上面的第1帧、第30帧、第60帧、第60帧，分别设置帧的属性如图6所示。

　　5、按“Ctrl + F8”新建一个Movie Clip，命名为“vertex”，类型为Movie Clip，在此Clip的场景中用文本工具输入“loading”这几个字。

　　6、返回到主场景中，将“line”Clip和“vertex”Clip都拖到场景中，并分别将它们的实例名设置为“wire”和“point”。

　　7、在主场景的时间轴上面，插入一个新的层，命名为“Scripts”，分别在此层的第2帧、第3帧上面插入关键帧。

　　8、在“Scripts”层的第1帧的Action面板上面添加如下语句：

var variable, buffer, no;

Points = 11; // 注释1
Lines = 10; // 注释2

Viewport = 500; // 注释3
line = new Array(Lines); // 注释4
vertex = new Array(Points);
project = new Array(Points);
fscommand ("fullScreen", true); // 注释5

for (i=0; i != Lines; i++) {
wire.DuplicateMovieClip("l" add i, i); // 注释6
line[i] = eval("l" add i);
}

for (i=0; i != Points; i++) {
point.DuplicateMovieClip("v" add i, (Lines*2)+i); // 注释7
vertex[i] = eval("v" add i);
}

vertex[0].x = 0; // 注释8
vertex[1].x = -100;
vertex[2].x = -150;
vertex[3].x = -150;
vertex[4].x = 0;
vertex[5].x = 100;
vertex[6].x = 150;
vertex[7].x = 100;
vertex[8].x = 150;
vertex[9].x = 0;
vertex[10].y = 0;
vertex[0].y = 0;
vertex[1].y = -100;
vertex[2].y = 0;
vertex[3].y = 100;
vertex[4].y = 150;
vertex[5].y = 100;
vertex[6].y = 0;
vertex[7].y = -100;
vertex[8].y = -150;
vertex[9].y = 0;
vertex[10].y = 0;
vertex[0].z = 0;
vertex[1].z = -100;
vertex[2].z = 0;
vertex[3].z = 100;
vertex[4].z = 0;
vertex[5].z = 100;
vertex[6].z = 0;
vertex[7].z = -100;
vertex[8].z = 0;
vertex[9].z = -150;
vertex[10].z = 150;

line[0].a = 0; // 注释9
line[0].b = 1;
line[1].a = 0;
line[1].b = 2;
line[2].a = 0;
line[2].b = 3;
line[3].a = 0;
line[3].b = 4;
line[4].a = 0;
line[4].b = 5;
line[5].a = 0;
line[5].b = 6;
line[6].a = 0;
line[6].b = 7;
line[7].a = 0;
line[7].b = 8;
line[8].a = 0;
line[8].b = 9;
line[9].a = 0;
line[9].b = 10;

文章评论

查看所有0条评论>>

热门文章 没有查询到任何记录。