3、按CTRL+Enter测试，一个简单的3D旋转就形成了。 （至此为止，上面部分的教程很大程度上是参考《flash 3D 基础教程》（作者：zjs35 文章来源：flashempire 更新时间：2004-4-7）的，本人只在上面做了微小部分的修改，主要因为这篇对FLASH_3D效果的基础理论确实写的很好。修改的部分，是本人在学习之后，自己在实践练习中发现的一些需要注意的地方。） 接下来将为大家解析一篇某人大虾写的立方体旋转的FLASH_AS,这位大虾是用纯AS写的，只要把代码全部复制到第一桢就可以了。我将做详细的解析！！！ //先给各项赋值，为后面的编辑作做准备 plane = [0, [0, 1, 2, 3, 4], [0, 5, 6, 7, 8], [0, 1, 2, 6, 5], [0, 2, 3, 7, 6], [0, 4, 3, 7, 8], [0, 1, 4, 8, 5]]; //给立方体的8个点都标上数，这里定义的数组是立方体的6个面，每个面上4个点，上面的数字就是哪四个点组成一个面，每组前面多个0，是为了下面做循环调用是方便，循环可以从i=1开始。大家自己可以根据上面的数组。画出它在三维坐标中的立体图形。另，第一“0“，其实是[0，0，0，0，0]。 dx = [0, 1, -1, -1, 1, 1, -1, -1, 1]; //这里是给8个点在三维坐标定义数组，竖着看，没一行就是一个点坐标的（x,y,z） ，另没组前面多个0，是为了下面做循环调用是方便，循环可以从i=1开始。 dy = [0, 1, 1, 1, 1, -1, -1, -1, -1]; // dz = [0, 1, 1, -1, -1, 1, 1, -1, -1]; // colour=0x4499FF //这里定义的是立方体的颜色，其实，要6个面，每个面的颜色不同，就把这个colour定义成数组就可以了。同样前面加个0,也是上面的理由。 //colour=[0,0x4499FF,0x6F13EC,0xF1F00E,0x6CE31C,0x26D9A3,0x808080]; trans = Math.PI/180; //下面的弧度和角度的转换用 cube_width = 100; //用于设定立方体的边的长度 d = 400; //// 观察者与屏幕的距离 num_planes = plane.length-1; //num_planes=6 num_nodes = dx.length-1; //num_nodes=8 num_nodes_per_plane = plane[1].length-1;//num_nodes_per_plane=4 xz_angle_inc = 0; //下面这4个定义对用鼠标控制旋转的速度有关， yz_angle_inc = 0; angle_inc_factor = .1; angle_dec_factor = .9; o_x = Stage.width/2; //把坐标原点移到屏幕中心 o_y = Stage.height/2; node = new Array(); //定义新数组 p_node = new Array(); //边长调整... 主要是求出8个点，在设定边长，情况下的坐标 for (i=1; i<=num_nodes; i++) { node[i] = new Object(); node[i].x = dx[i]*(cube_width/2); node[i].y = dy[i]*(cube_width/2); node[i].z = dz[i]*(cube_width/2); } for (i=1; i<=num_planes; i++) { //建立6个空白的影片剪辑，主要用于，每天影片剪辑，画一个立方体的面。 _root.createEmptyMovieClip("plane"+i, i); } //版面的调整 下面的_root.onEnterFrame 会调用这里进行画立方体 //对这里不理解的，看附录一的代码！ function create_planes() { for (var i = 1; i<=num_planes; i++) { depth = 0; //设定深度初始值 mc = _root["plane"+i]; //每个影片剪辑画一个立方体的一个面 mc.clear(); //清除上次画的面，不用这句语句，可以看到面的连续旋转的会是什么轨迹，程序是怎么画的。不过，很难看。 mc.beginFill(colour, 100); //设置立方体面的颜色，colour可以变数组colour[i]，这样每个面可以画，不同的颜色。 mc.lineStyle(3,0xFF0000,100);//设置立方体的棱的颜色 mc.moveTo(p_node[plane[i][1]].x, p_node[plane[i][1]].y);//这里设定每个正方形面，开始画时的启始点。 for (j=num_nodes_per_plane; j>=1; j--) { //这里是连续读取4个点，画好一个正方形 mc.lineTo(p_node[plane[i][j]].x, p_node[plane[i][j]].y); depth += node[plane[i][j]].z; //求每个面上4点旋转后，4个点的深度变化，并相加 } depth /= -num_nodes_per_plane;//注意除以负数，这样符合，FLASH的深度变化的远近情况 mc.swapDepths(depth); //有点的深度变化，来控制面的层次变化，如果没有这句，可以看到一个立方体在旋转是6个面的层次混乱。 amount = depth/50*100+15;//用深度变化，在传值，这个参数主要用于下面的语句，下面的语句，用于立方体在旋转时，面的亮度的调整，符合一定的光照效果。 new Color(mc).setTransform({ra:amount, ga:amount, ba:amount}); //这句语句可以查看FLASH_AS语法参考，可以找到的。主要是对色彩的设置。 } } //鼠标激发 _root.onMouseDown = function() { mouse_down = true; }; _root.onMouseUp = function() { mouse_down = false; }; _root.onEnterFrame = function() { if (mouse_down) { //判断，鼠标情况，对鼠标移动距离的相加，如果，没有“+=”而用“=”，这样鼠标每点一次，图象就跳回初始状态。可以自己实验看下效果，进行对比。 xz_angle_inc += (_xmouse-old_mx)*angle_inc_factor; yz_angle_inc += (_ymouse-old_my)*angle_inc_factor; } for (i=1; i<=num_nodes; i++) { sin_xz = Math.sin(xz_angle_inc*trans); //对弧度与角度的转化公式。 cos_xz = Math.cos(xz_angle_inc*trans); sin_yz = Math.sin(yz_angle_inc*trans); cos_yz = Math.cos(yz_angle_inc*trans); rx1 = cos_xz*node[i].x-sin_xz*node[i].z; //这里就是上面的坐标转换公式里的，先按Y轴旋转，再按X轴旋转。 ry1 = node[i].y; rz1 = cos_xz*node[i].z+sin_xz*node[i].x; rx2 = rx1; ry2 = cos_yz*ry1+sin_yz*rz1; rz2 = cos_yz*rz1-sin_yz*ry1; node[i].x = rx2; //这里是把每个旋转后，得到的先的坐标保存在变量里 node[i].y = ry2; node[i].z = rz2; p_ratio = d/(d+node[i].z); //这个是上面d/(d+z) p_node[i] = new Object(); p_node[i].x = o_x+node[i].x*p_ratio; //确定在屏幕上点的位置 p_node[i].y = o_y-node[i].y*p_ratio; } xz_angle_inc *= angle_dec_factor; //这个加速鼠标控制时的旋转速度 yz_angle_inc *= angle_dec_factor; old_mx = _xmouse; //得到影片开始时的鼠标坐标 old_my = _ymouse; create_planes(); //调用上面的函数，画出立方体 }; //点评：本人只所以选择这个例子进行解析，主要是因为画立方体，是很常见的例子，也是3D里的一个基本的画法。另，这个例子的代码是很精练，简洁，再加上代码的前部分定义的一些值，利于以后做其他项目的开发，可以把这个程序改成一个类，适合自身以后，对画立方体时调用。同时，可以在这个程序基础上做进一步开发！比如，将好几个立方体叠起来，把图片放在立方体的面上，做一些旋转立体按钮等等，都是可以的。
文章页数:[1] [2] [3] [4] [5] [6] [7]
相关文章 
