【away3d】Away3D 粒子移动动画(在一个路径轨迹上循环运动)

更新时间:2020-03-22    来源:系统相关    手机版     字体:

【www.bbyears.com--系统相关】

最近在做一个电源系统的三维拓扑图,使用LineSegment来绘制设备间的连接线缆。为了让画面更生动些,需要在线路上添加粒子移动效果,来模拟电流的流动。

 

 

1,使用小方块来实现

每隔一定的时间创建一个小方块,其移动轨迹就是在线路上进行循环移动。即从起点开始移动到下一个拐点,再移动到下一个拐点,再移动到下一个拐点....如果移到路径尾部的时候就恢复到开始位置。

 

 

效果图如下:

 


原文:Away3D - 粒子移动动画(在一个路径轨迹上循环运动)

 


原文:Away3D - 粒子移动动画(在一个路径轨迹上循环运动)

 

 

 

--- 方块类 PowerParticles.as ---


package
{
    import flash.events.Event;
    import flash.geom.Vector3D;
     
    import away3d.containers.View3D;
    import away3d.entities.Mesh;
    import away3d.materials.ColorMaterial;
    import away3d.primitives.CubeGeometry;
 
    public class PowerParticles
    {
        private var _view3D:View3D;
        private var _points:Array;
         
        private var cube1:Mesh;
         
        //每次移动的步长
        private var step:Number = 5;
             
        private var nextIndex:int = 1;
         
        public function PowerParticles()
        {
        }
         
        public function init(view3D:View3D, points:Array):void{
            this._view3D = view3D;
            this._points = points;
             
            var material:ColorMaterial = new ColorMaterial(0xFFD800);  
             
            // 在三维舞台中创建一个方块
            cube1 = new Mesh(new CubeGeometry(5, 5, 5), material);
            cube1.position = points[0];
            _view3D.scene.addChild(cube1);
             
            _view3D.addEventListener(Event.ENTER_FRAME, _onEnterFrame);
        }
         
        private function _onEnterFrame(e:Event):void
        {
            var nextPoint:Vector3D = _points[nextIndex];
            var spanX:Number = nextPoint.x - cube1.x;
            var spanY:Number = nextPoint.y - cube1.y;
            var spanZ:Number = nextPoint.z - cube1.z;
             
            if(Math.abs(spanX)>=step){
                cube1.x += (spanX>0?1:-1)*step;
            }
             
            if(Math.abs(spanY)>=step){
                cube1.y += (spanY>0?1:-1)*step;
            }
             
            if(Math.abs(spanZ)>=step){
                cube1.z += (spanZ>0?1:-1)*step;
            }
             
            if(Math.abs(spanX)                 nextIndex++;
                if(nextIndex>=_points.length){
                    nextIndex = 1;
                    cube1.position = _points[0];
                }
            }
        }
    }
}
--- 主类 Main.as ---

package{
    import flash.display.Sprite;
    import flash.display.StageAlign;
    import flash.display.StageScaleMode;
    import flash.events.Event;
    import flash.events.MouseEvent;
    import flash.geom.Vector3D;
    import flash.utils.setTimeout;
     
    import away3d.containers.View3D;
    import away3d.controllers.HoverController;
    import away3d.entities.Mesh;
    import away3d.entities.SegmentSet;
    import away3d.materials.TextureMaterial;
    import away3d.primitives.LineSegment;
    import away3d.primitives.PlaneGeometry;
    import away3d.utils.Cast;
     
    [SWF(frameRate="60", backgroundColor="#FFFFFF")]
    public class Main extends Sprite {
         
        private  var _view3D:View3D;
        private var cameraController:HoverController;//360全景展示相机控制器
         
        [Embed(source="assets/floor_diffuse.jpg")]
        public static var FloorDiffuse:Class;
         
        //材质
        private var planeMaterial:TextureMaterial;
 
        //管道拐点
        private var linePoints:Array = [new Vector3D(450,40,200),
            new Vector3D(0,40,200),
            new Vector3D(0,240,200),
            new Vector3D(0,240,50),
            new Vector3D(-450,240,50)]
         
        private var lastPanAngle:Number;
        private var lastTiltAngle:Number;
        private var lastMouseX:Number;
        private var lastMouseY:Number;
        private var move:Boolean;
         
        public function Main() {
            initEngine();
            initMaterials();
            initObjects();
            initListeners();
        }
         
        /**
         * 初始化引擎
         */
        private function initEngine():void
        {
            stage.scaleMode = StageScaleMode.NO_SCALE;
            stage.align = StageAlign.TOP_LEFT;
             
            // 创建一个视口
            _view3D = new View3D();
            _view3D.antiAlias = 4; //设置抗锯齿级别
             
            //初始化摄像头
            cameraController = new HoverController(_view3D.camera);
            /*cameraController.distance = 1000;
            cameraController.minTiltAngle = 0;
            cameraController.maxTiltAngle = 90;
            cameraController.panAngle = 45;*/
            cameraController.tiltAngle = 30;
             
            addChild(_view3D);
        }
         
         
        /**
         * 初始化材质
         */
        private function initMaterials():void
        {
            //地面材质
            planeMaterial = new TextureMaterial(Cast.bitmapTexture(FloorDiffuse));
            planeMaterial.repeat = true;
        }
         
        /**
         * 初始化物体
         */
        private function initObjects():void
        {
            //地面
            var plane:Mesh = new Mesh(new PlaneGeometry(900, 600), planeMaterial);
            plane.geometry.scaleUV(3, 2);
            (plane.geometry as PlaneGeometry).doubleSided = true; //双面 贴图
            _view3D.scene.addChild(plane);
             
            //绘制管道
            createLine(linePoints);
             
            //添加粒子
            setTimeout(addSmallParticle,1000);
            setTimeout(addSmallParticle,2000);
            setTimeout(addSmallParticle,3000);
            setTimeout(addSmallParticle,4000);
        }
         
        private function createLine(points:Array,color:uint=0x00BC19):SegmentSet{
            var linesContainer:SegmentSet = new SegmentSet();
             
            for(var i:int = 1;i                 var line:LineSegment = new LineSegment(points[i-1],points[i],color,color);
                linesContainer.addSegment(line);
            }
            _view3D.scene.addChild(linesContainer);
            return linesContainer;
        }
         
        private function addSmallParticle():void{
            var p:PowerParticles = new PowerParticles();
            p.init(_view3D, linePoints);
        }
         
        /**
         * 初始化监听
         */
        private function initListeners():void
        {
            addEventListener(Event.ENTER_FRAME, _onEnterFrame);
            //鼠标事件监听
            stage.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
            stage.addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
            stage.addEventListener(MouseEvent.MOUSE_WHEEL,onWheel);
            stage.addEventListener(Event.RESIZE, onResize);
            onResize();
        }
         
        /**
         * 渲染视图
         */
        private function _onEnterFrame(e:Event):void
        {
             
            //移动视角
            if (move) {
                cameraController.panAngle = 0.3 * (stage.mouseX - lastMouseX) + lastPanAngle;
                cameraController.tiltAngle = 0.3 * (stage.mouseY - lastMouseY) + lastTiltAngle;
            }
            //渲染视图
            _view3D.render();
        }
         
        /**
         * 使用舞台大小一直全屏
         */
        private function onResize(event:Event = null):void
        {
            _view3D.width = stage.stageWidth;
            _view3D.height = stage.stageHeight;
        }
         
        /**
         * 鼠标滚轮事件
         */
        private function onWheel(e:MouseEvent):void
        {
            if(e.delta > 0){
                if(cameraController.distance < 1000)
                    cameraController.distance += 100;
            }else{
                if(cameraController.distance > 600)
                    cameraController.distance -= 100;
            }
        }
         
        /**
         * 鼠标按下事件
         */
        private function onMouseDown(event:MouseEvent):void
        {
            lastPanAngle = cameraController.panAngle;
            lastTiltAngle = cameraController.tiltAngle;
            lastMouseX = stage.mouseX;
            lastMouseY = stage.mouseY;
            move = true;
        }
         
        /**
         * 鼠标弹起事件
         */
        private function onMouseUp(event:MouseEvent):void
        {
            move = false;
        }
    }
}

2,使用透明图片来实现
直接使用实色方块可能会觉得有些生硬,那么可以使用半透明的放射发光图片来做粒子,素材图如下:


原文:Away3D - 粒子移动动画(在一个路径轨迹上循环运动)

 

这时就要使用 Sprite3D 来制作粒子。Sprite3D 是一个始终正对着摄像机镜头的平面对象,其保证不管摄像头如何旋转,始终面向着用户。

 

 

 

效果图如下:

 


原文:Away3D - 粒子移动动画(在一个路径轨迹上循环运动)

 

 

 

代码如下 PowerParticles2.as :

package
{
    import flash.display.BlendMode;
    import flash.events.Event;
    import flash.geom.Vector3D;
     
    import away3d.containers.View3D;
    import away3d.entities.Sprite3D;
    import away3d.materials.TextureMaterial;
    import away3d.utils.Cast;
 
    public class PowerParticles2
    {
        private var _view3D:View3D;
        private var _points:Array;
         
        [Embed(source="./assets/blue.png")]
        private var ParticleImg:Class;
         
        private var _particleMesh:Sprite3D;
         
        //每次移动的步长
        private var step:Number = 5;
             
        private var nextIndex:int = 1;
         
        public function PowerParticles2()
        {
        }
         
        public function init(view3D:View3D, points:Array):void{
            this._view3D = view3D;
            this._points = points;
             
            var material:TextureMaterial = new TextureMaterial(Cast.bitmapTexture(ParticleImg));
            material.blendMode = BlendMode.ADD;
             
            // 在三维舞台中创建一个粒子
            _particleMesh = new Sprite3D(material,25,25);
            _particleMesh.position = points[0];
            _view3D.scene.addChild(_particleMesh);
             
            _view3D.addEventListener(Event.ENTER_FRAME, _onEnterFrame);
        }
         
        private function _onEnterFrame(e:Event):void
        {
            var nextPoint:Vector3D = _points[nextIndex];
            var spanX:Number = nextPoint.x - _particleMesh.x;
            var spanY:Number = nextPoint.y - _particleMesh.y;
            var spanZ:Number = nextPoint.z - _particleMesh.z;
             
            if(Math.abs(spanX)>=step){
                _particleMesh.x += (spanX>0?1:-1)*step;
            }
             
            if(Math.abs(spanY)>=step){
                _particleMesh.y += (spanY>0?1:-1)*step;
            }
             
            if(Math.abs(spanZ)>=step){
                _particleMesh.z += (spanZ>0?1:-1)*step;
            }
             
            if(Math.abs(spanX)                 nextIndex++;
                if(nextIndex>=_points.length){
                    nextIndex = 1;
                    _particleMesh.position = _points[0];
                }
            }
        }
    }
}

本文来源:http://www.bbyears.com/aspjiaocheng/88946.html

热门标签

更多>>

本类排行