Flash Action应用--鼠控3D旋转 -pc6资讯

您的位置：首页 → 网页设计 → Flash → Flash Action应用--鼠控3D旋转

Flash Action应用--鼠控3D旋转 时间：2004/11/7 2:24:00来源：本站整理作者：蓝点我要评论(0)

　　　　　　　　　　　　

　　　　　　　　　　　　Flash所提供的Action Script动作脚本，其功能之强大已是尽人皆知了，在Flash动画的交互方面起到了重要的作用，不仅如此，Action在三维领域也有其一席之地，下面我们通过一个具体的实例来讲解Flash中3D效果的制作。(点击这里下载.swf和.fla文件)

图1所示为本实例的最终效果，动画中可以使用鼠标拖动，从而控制中间的六面线框体自由旋转：

图1

一、创建元件素材
1、场景布置：
首先启动Flash MX，新建一个大小为500x300 pixels（像素），Background:#FF9900（即桔黄色，其它色也无所谓），Frame Raet(帧速率)：18 fps场景，参数调置如图2所示：

图2

2、创建六面体的边(wire)

按快捷键crtl+F8新建一个Name:hexahedron-wire的Symbol(元件)，按快键N选取Line Tool(直线工具) ，按住Shift键，从中心点向右下角画一条45度的斜线，按V键回到箭头工具，选择刚才画的斜线，点击属性面板中的Stroke Color（边框色），将其颜色改为熟褐色（#660000），如图3所示：

图3

双击Layer 1(图层1)将之重命名为：wire,并按ctrl+L打开Libraby（库），将刚才创建的MC，hexahedron-wire 拖入场景，展开Properties(属性)面板，并给它取个Instance　Name（实体名）：wire ,如图4所示：

图4

3、创建六面体的节点(vert)

单击Insert Layer新增一个图层，并将其重命名：vert, 按快捷键O选取Oval Tool(椭圆工具)，按住Shift键，在场景中绘制一个直径为10像素的正圆(先绘制，然后选取这个正圆，在其属性面板的W与H(即宽与高)中直接输入10，然后回车，就OK了，如图5所示：

图5

确认刚才绘制的圆在选择状态，将其的填充色也改成熟褐色，并按下F8，将其转换成名为hexahedron-vert的MC，实体名：vert 。
4、创建拖动控制按钮：
新增一个图层，并将其重命名为：crtl_drag，用椭圆工具在场景中绘制一个直径约12像素的正圆，按F8将其转换成MC，并为其取个实体名:drag_ctrl。双击我们创建的crtl_drag，或在其上单击鼠标右，从弹出的菜单中选择 Edit in place,再次按F8将其转换成buttom(按钮)，再次双击，让按钮处于编辑状态，按F6，在hit处插入关键帧，选择关键帧“Up”，在场景中选择正圆，将其从场景中删去。
ok，所有的元件创键完成，如果你的操作没有错误的话，打开library，各元件对应的名称应如图6所示，当然，你也可对元件进行美化，就看你的创意了。只实体名与AS中的一致，就可以了。

图6

二、让元件动起来
1、在图层wire、vert、drag_ctrl的第三帧处分别按F5插入空帧。
2、新增一个名为action的层。在取第一帧，按F9打开action面板，按ctrl+shift+E切换到专家模式，输下以下AS：

max=12;
maxwire=30;
fov=180;
rotx=0;
roty=0;
// 设置含数与余弦
cs = new Array(360);
sn = new Array(360);
for (i=-180; i<=180; i++) {
cs[i+180]=Math.cos(i*Math.PI/180);
sn[i+180]=Math.sin(i*Math.PI/180);
}
// 线框阵列

wire._visible=false;
w = new Array(maxwire);
for (n=1; n<=maxwire; n++) {
wire.duplicateMovieClip("w" add n, n);
w[n]=Eval("w" add n);
}
w[1].p1=1; w[1].p2=2;
w[2].p1=2; w[2].p2=3;
w[3].p1=1; w[3].p2=3;
w[4].p1=1; w[4].p2=4;
w[5].p1=3; w[5].p2=4;
w[6].p1=1; w[6].p2=5;
w[7].p1=4; w[7].p2=5;
w[8].p1=1; w[8].p2=6;
w[9].p1=5; w[9].p2=6;
w[10].p1=2; w[10].p2=6;
w[11].p1=2; w[11].p2=11;
w[12].p1=11; w[12].p2=7;
w[13].p1=2; w[13].p2=7;
w[14].p1=3; w[14].p2=7;
w[15].p1=7; w[15].p2=8;
w[16].p1=3; w[16].p2=8;
w[17].p1=4; w[17].p2=8;
w[18].p1=4; w[18].p2=9;
w[19].p1=8; w[19].p2=9;
w[20].p1=5; w[20].p2=9;
w[21].p1=5; w[21].p2=10;
w[22].p1=9; w[22].p2=10;
w[23].p1=6; w[23].p2=10;
w[24].p1=6; w[24].p2=11;
w[25].p1=10; w[25].p2=11;
w[26].p1=12; w[26].p2=8;
w[27].p1=12; w[27].p2=7;
w[28].p1=12; w[28].p2=9;
w[29].p1=12; w[29].p2=10;
w[30].p1=12; w[30].p2=11;
// 节点阵列
vert._visible=false;
v = new Array(max);
sv = new Array(max);
for (n=1; n<=max; n++) {
vert.duplicateMovieClip("v" add n, n+maxwire)
v[n]=Eval("v" add n);
}
v[1].px=0;
v[1].py=0.4819;
v[1].pz=50;
v[2].px=44.7214;
v[2].py=0.4819;
v[2].pz=22.3607;
v[3].px=13.8197;
v[3].py=43.0145;
v[3].pz=22.3607;
v[4].px=-36.1803;
v[4].py=26.7685;
v[4].pz=22.3607;
v[5].px=-36.1803;
v[5].py=-25.8046;
v[5].pz=22.3607;
v[6].px=13.8197;
v[6].py=-42.0506;
v[6].pz=22.3607;
v[7].px=36.1803;
v[7].py=26.7685;
v[7].pz=-22.3607;
v[8].px=-13.8197;
v[8].py=43.0145;
v[8].pz=-22.3607;
v[9].px=-44.7214;
v[9].py=0.4819;
v[9].pz=-22.3607;
v[10].px=-13.8197;
v[10].py=-42.0506;
v[10].pz=-22.3607;
v[11].px=36.1804;
v[11].py=-25.8046;
v[11].pz=-22.3607;
v[12].px=0;
v[12].py=0.4819;
v[12].pz=-50;
drag_ctrl.startDrag(true);
//指定拖动控制对象，即MC：drag_ctrl
按F6，在第二帧插入一个关键帧，并输入以下As:
for (n=1; n<=max; n++) {
// 设置X轴的旋转
tz=v[n].pz;
ty=v[n].py;
rotx2=int(rotx)+180;
v[n].pz=tz*cs[rotx2]-ty*sn[rotx2];
v[n].py=ty*cs[rotx2]+tz*sn[rotx2];
//设置Y轴的旋转
tx=v[n].px;
tz=v[n].pz;
roty2=int(roty)+180;
v[n].px=tx*cs[roty2]-tz*sn[roty2];
v[n].pz=tz*cs[roty2]+tx*sn[roty2];
// 对节点的拖动设置
with (v[n]) {
k=_root.fov/(_root.fov-pz);
_x=250+px*k;//设定X轴上的位置
_y=150-py*k;//设定y轴上的位置
_xscale=100*k;//设定节点在X轴上的百分比(即大小)
_yscale=100*k;//设定节点在Y轴上的百分比(即大小)
_alpha=200*k-150;
}
}
for (n=1; n<=maxwire; n++) {
// 对线框的拖动设置
w[n]._x=v[w[n].p1]._x;
w[n]._y=v[w[n].p1]._y;
w[n]._xscale=v[w[n].p2]._x-v[w[n].p1]._x;
w[n]._yscale=v[w[n].p2]._y-v[w[n].p1]._y;
w[n]._alpha=(v[w[n].p1]._alpha+v[w[n].p2]._alpha)/2;

}
if (pr) {
rotx=(oldy-_ymouse)/2;
roty=(oldx-_xmouse)/2;
} else
{
rotx*=0.95;
roty*=0.95;
}
oldx=_xmouse;
oldy=_ymouse;

最后，再在第三帧插入一个关键帧，并加上如下AS：
gotoAndPlay (2);
以上操作完正确的话，你的图层与时间线应如图7所示：