flex拓扑图制作

jeffrey0411

浏览: 52988 次
性别:
来自: 北京

最近访客更多访客>>

玉无瑕

xbyydt

qq_915023402

南山耗子

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

flex技术

Flex Flash Spring UI UP

1、把节点封装成as的类
2、把连线也封装成as的类
3、一个测试文件

NeMap.as 节点类

package{
	import mx.containers.Canvas;
	import mx.controls.Image;
	import mx.controls.Label;
	import flash.ui.ContextMenu;
	import flash.ui.ContextMenuItem;
	import mx.events.MenuEvent;
	import flash.events.MouseEvent;
	import mx.containers.Canvas;
	import flash.display.Sprite;
	import mx.controls.Alert;
	import flash.events.FocusEvent;
	import flash.events.ActivityEvent;
	import flash.utils.Dictionary;
	import flash.events.Event;
	import mx.events.DragEvent;
	import mx.events.StateChangeEvent;
	import mx.events.FlexEvent;
	import mx.events.MoveEvent;
	import flash.events.StatusEvent;
	public class NeMap extends mx.containers.Canvas {
		private var nePic :String = "ASSETS/LSTP.PNG";//网元图
		private var neState:String = "ASSETS/clearStatus.gif";//网元状态图
		private var neName:String = "北京HSTPA";
		private var lineList:Array =new Array();
		private var lineCount:int = 0;
		private var x_Coordinates:int = 100;
		private var y_Coordinates:int = 100;
		
		private var nePicImage:Image = new Image();
		private var neStateImage:Image = new Image();
		private var neNameLable:Label = new Label();
		
		private var oldIndex:int = 0;
		
		public function NeMap(x:int,y:int,ne:String){
			this.width  = 60;
			this.height = 60;
			this.x = x;
			this.y = y;
			this.neName = ne;
			init();
		}
		
		
		private function init():void{
				
			this.addEventListener(flash.events.MouseEvent.MOUSE_DOWN,dragBegin);
			this.addEventListener(flash.events.MouseEvent.MOUSE_UP,dragEnd);
			this.addEventListener(flash.events.MouseEvent.MOUSE_MOVE,dragEnd2);
			this.addEventListener(mx.events.MoveEvent.MOVE,dragEnd1);
			//this.addEventListener(mx.events.MoveEvent.MOVE,dragEnd1);
			//neStateImage.addEventListener();
			
			//this.addEventListener(flash.events.MouseEvent.ROLL_OUT,dragEnd);
			this.addEventListener(flash.events.MouseEvent.MOUSE_OVER,selectedNe);
			this.addEventListener(flash.events.MouseEvent.MOUSE_OUT,noSelectedNe);
		
			initNePic();
			initNeState();		
			initLabel();
			
			this.addChild(nePicImage);
			this.addChild(neStateImage);
			this.addChild(neNameLable);
			this.verticalScrollPolicy = "off";
			this.horizontalScrollPolicy = "off";
			
			this.contextMenu = initPopMenu();			
		}
		
		private function dragBegin(event:MouseEvent):void{
			//Alert.show(String(this.parent.numChildren));
			oldIndex = this.parent.getChildIndex(this);
			this.parent.setChildIndex(this,this.parent.numChildren-1);
			this.startDrag(false);		
		}
		
		private function dragEnd(event:MouseEvent):void{
			this.parent.setChildIndex(this,oldIndex);
			this.stopDrag();		    
			/*var x:int = getCenterX();
			var y:int = getCenterY();
			for(var i:int=0;i<lineList.length;i++){				
				var nelineFlag:NeLineFlag = lineList[i];
			    var line:ExpanLine = nelineFlag.getLine();
			    var isHeaderLine:Boolean = 	nelineFlag.getFlag();
			    line.removeLine();
			    if(isHeaderLine){
					line.setBeginX(x);
					line.setBeginY(y);
					line.resetBeginLine(x,y);
				}else{
					line.setEndX(x);
					line.setEndY(y);
					line.resetEndLine(x,y);
				}	
			}*/		
		}
		
		private function dragEnd1(event:MoveEvent):void{
		   refreshLine();
		}
		
		private function dragEnd2(event:MouseEvent):void{
		   refreshLine();
		}
		
		private function refreshLine():void{
			 var x:int = getCenterX();
			var y:int = getCenterY();
			for(var i:int=0;i<lineList.length;i++){				
				var nelineFlag:NeLineFlag = lineList[i];
			    var line:ExpanLine = nelineFlag.getLine();
			    var isHeaderLine:Boolean = 	nelineFlag.getFlag();
			    line.removeLine();
			    if(isHeaderLine){
					line.setBeginX(x);
					line.setBeginY(y);
					line.resetBeginLine(x,y);
				}else{
					line.setEndX(x);
					line.setEndY(y);
					line.resetEndLine(x,y);
				}	
			}		
		}
		
		//增加边框
		private function selectedNe(event:MouseEvent):void{
			//this.setStyle("borderColor","#FF0000");
			//this.setStyle("borderStyle","outset");
		}
		
		private function noSelectedNe(event:MouseEvent):void{
			this.setStyle("borderColor","");
			this.setStyle("borderStyle","");
		}
		
		private function initNePic():void{
			nePicImage.source = nePic;
			nePicImage.x = 10;
			nePicImage.y = 0;
			nePicImage.width = 30;
			nePicImage.height = 46;
		}
		
		private function initNeState():void{
			neStateImage.source = neState;
			neStateImage.x = 0;
			neStateImage.y = 0;
			neStateImage.width = 10;
			neStateImage.height = 10;
		}
		
		private function initLabel():void{
			neNameLable.text = neName;
			neNameLable.x = 0;
			neNameLable.y = 45;
			neNameLable.width = 60;
			neNameLable.height = 20;
		}
		
		private function initPopMenu():ContextMenu{
			var contextMenu : ContextMenu = new ContextMenu();
			contextMenu.hideBuiltInItems();
			var contextMenuItem1 : ContextMenuItem = new ContextMenuItem("网元信息");
			var contextMenuItem2 : ContextMenuItem = new ContextMenuItem("告警信息");
			var contextMenuItem3 : ContextMenuItem = new ContextMenuItem("历史告警");
			contextMenu.customItems.push(contextMenuItem1);
			contextMenu.customItems.push(contextMenuItem2);
			contextMenu.customItems.push(contextMenuItem3);
			
			return contextMenu;
		}
		
		public function getCenterX():int{
			return this.x+10;
		}
		
		public function getCenterY():int{
			return this.y+10;
		}
		
		public function setLine(line1:ExpanLine,flag:Boolean):void{
			var neLineFlag:NeLineFlag = new NeLineFlag(line1,flag);
			lineList[lineCount] = neLineFlag;
			lineCount++;
			//this.line = line1;
			//this.isHeaderLine = flag;
		}
		
		public function setNeState(state:String):void{
			neStateImage.source = state;
		}
		
	}
}

ExpanLine.as 连线类

package 
{    
    import flash.display.Shape;
	import mx.core.UIComponent;
	import flash.display.Sprite;
	import flash.ui.ContextMenu;
	import flash.ui.ContextMenuItem;
	import mx.containers.Canvas;
	import mx.containers.Panel;
	import flash.events.MouseEvent;
	import mx.controls.Alert;
	import mx.controls.Label;
	import mx.managers.PopUpManager;
	import flash.display.DisplayObject;
	import mx.managers.ToolTipManager;
	import mx.controls.ToolTip;
	import flash.events.Event;
	import flash.events.TextEvent;
	import flash.events.TimerEvent;
	import flash.events.SyncEvent;
	import mx.events.ToolTipEvent;
	import mx.core.IToolTip;
	import mx.controls.Button;
	import flash.net.URLRequest;
	import flash.net.navigateToURL;
	
	public class ExpanLine extends mx.controls.Button
	{
		private var line_x1:int;//连线一段
		private var line_y1:int;
		private var line_x2:int;//连线另一段
		private var line_y2:int;
		//private var lines :Sprite =  new Sprite();
		
		private var lines:Label = new Label();
		
		private var myPanel:ShowFlow = null;
		
		private var parentWindow:Cond;
		
		public var myTip:IToolTip;
		
		
		
		public function ExpanLine(x1:int,y1:int,x2:int,y2:int,parent:Cond){
			line_x1 = x1;
			line_y1 = y1;
			line_x2 = x2;
			line_y2 = y2;		
			parentWindow = parent;
			
			
			
			lines.graphics.lineStyle(2,0x0099ff,1);
			lines.graphics.moveTo(line_x1,line_y1);
			lines.graphics.lineTo(line_x2,line_y2);	
			
			lines.toolTip = "111111111";
			
			//lines.addEventListener(flash.events.MouseEvent.ROLL_OVER,createToopTip);
			//lines.addEventListener(flash.events.MouseEvent.ROLL_OUT,hideToopTip);			
            //lines.addEventListener(mx.events.ToolTipEvent.TOOL_TIP_CREATE,createCustomToolTip);
            lines.addEventListener(flash.events.MouseEvent.CLICK,doubleLineInterface);
			
			
			
			var contextMenu : ContextMenu = new ContextMenu();
			contextMenu.hideBuiltInItems(); // 隐藏一些内建的鼠标右键菜单项
			var contextMenuItem1 : ContextMenuItem = new ContextMenuItem("链路信息");
			var contextMenuItem2 : ContextMenuItem = new ContextMenuItem("告警信息");
			var contextMenuItem3 : ContextMenuItem = new ContextMenuItem("历史告警");
			contextMenu.customItems.push(contextMenuItem1);
			contextMenu.customItems.push(contextMenuItem2);
			contextMenu.customItems.push(contextMenuItem3);
			lines.contextMenu = contextMenu;			
			
		}
		
		public function doubleLineInterface(event:MouseEvent):void{
			Alert.show("aaaaa");
			//var url:URLRequest=new URLRequest("./ipInterface.do?ipInterfaceId="+interfaceId);
  	    	//navigateToURL(url,"_blank");
		}
		
		public function createToopTip(event:MouseEvent):void{
			
			var ptt:PanelToolTip = new PanelToolTip();
			
			
			//ToolTipManager.toolTipClass = myTip;
			//myTip.addEventListener(mx.events.ToolTipEvent.TOOL_TIP_CREATE,createCustomToolTip);
			myTip = ToolTipManager.createToolTip("aaa",10,10) as IToolTip;
			
			//ToolTipManager.currentToolTip = ptt;
			//ToolTipManager.enabled = true;
			
			
			//myTip = ToolTip(ptt);
			myTip.x = event.localX;
			myTip.y = event.localY;		
			
			//myTip.setStyle("backgroundColor",0xFFCC00);
			//myTip.width = 150;
			//myTip.height = 200;
		}
		
		public function hideToopTip(event:MouseEvent):void{
			ToolTipManager.destroyToolTip(myTip);
		}
		
		public function createCustomToolTip(event:ToolTipEvent):void{
			var ptt:PanelToolTip = new PanelToolTip();
			ptt.nodeId = "10";
			event.toolTip = ptt;
		}
		
		public function resetBeginLine(x1:int,y1:int):void{
			lines.graphics.clear();
			lines.graphics.lineStyle(2,0x0099ff,1);
			lines.graphics.moveTo(x1,y1);
			lines.graphics.lineTo(line_x2,line_y2);
		}
		
		public function resetEndLine(x1:int,y1:int):void{
			lines.graphics.clear();
			lines.graphics.lineStyle(2,0x0099ff,1);
			lines.graphics.moveTo(line_x1,line_y1);
			lines.graphics.lineTo(x1,y1);
		}
		
		public function refreshLine():void{
			lines.graphics.clear();
			lines.graphics.lineStyle(2,0xFF0000,1);
			lines.graphics.moveTo(line_x1,line_y1);
			lines.graphics.lineTo(line_x2,line_y2);	
		}
		
		public function removeLine():void{
			lines.graphics.clear();
		}
		
		public function getLine():Sprite{
			return lines;
		}	
		
		public function getBeginX():int{
			return line_x1;
		}
		
		public function getBeginY():int{
			return line_y1;
		}
		
		public function getEndX():int{
			return line_x2;
		}
		
		public function getEndY():int{
			return line_y2;
		}
		
		public function setBeginX(x1:int):void{
			line_x1 = x1;
		}
		
		public function setBeginY(y1:int):void{
			line_y1 = y1;
		}
		
		public function setEndX(x2:int):void{
			line_x2 = x2;
		}
		
		public function setEndY(y2:int):void{
			line_y2 = y2;
		}		
	}
}

一个测试类Conf.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:ns1="*" width="660" height="422">
	<mx:Style>
		AlertTitle{ 
		    font-size: 12pt; 
		    font-weight: bold;
		}
		ToopTip{
			backgroundColor:red;
			backgroundImage:url("ASSETS/MAP.GIF");
		}	
	</mx:Style>
    <mx:Script>
		<![CDATA[
			import mx.events.ToolTipEvent;
		/*import flash.display.Shape;
		import mx.core.UIComponent;
	    import flash.display.DisplayObjectContainer;*/
	    
	    public var map1:NeMap;
		public var map2:NeMap;
		public var map3:NeMap;
		
		public var line:ExpanLine;
		public var line2:ExpanLine;
		public var line3:ExpanLine;
		import mx.managers.PopUpManager;
		import mx.controls.Alert;
		
		public var myPanel1:ShowFlow;
		
		public function init():void{
			
			map1 = new NeMap(200,100,"map1");
			map2 = new NeMap(100,200,"map2");
			map3 = new NeMap(200,200,"map3");
			
			myCanvas.setStyle("backgroundImage",'ASSETS/MAP.GIF');
			
			line  = new ExpanLine(map1.getCenterX(),map1.getCenterY(),map2.getCenterX(),map2.getCenterY(),this);
			line2 = new ExpanLine(map2.getCenterX(),map2.getCenterY(),map3.getCenterX(),map3.getCenterY(),this);
			line3 = new ExpanLine(map1.getCenterX(),map1.getCenterY(),map3.getCenterX(),map3.getCenterY(),this);
			
			
			mylabel.addChild(line.getLine());
            mylabel.addChild(line2.getLine());
            mylabel.addChild(line3.getLine());
            
            
            map1.toolTip = "map1map1map1map1map1map1map1map1map1map1map1map1map1map1map1map1";
            map2.toolTip = "map2map2map2map2map2map2map2map2map2map2map2map2map2map2map2map2";
            map3.toolTip = "map3map3map3map3map3map3map3map3map3map3map3map3map3map3map3map3";
            
           
            map1.setLine(line,true);
            map2.setLine(line,false);
            
            map2.setLine(line2,true);
            map3.setLine(line2,false);
            
            map1.setLine(line3,true);
            map3.setLine(line3,false);            
            
            myCanvas.addChild(map3);
            myCanvas.addChild(map1);
            myCanvas.addChild(map2);
            
            
	    }	
	    
	    public function createCustomToolTip(event:ToolTipEvent):void{
			var ptt:PanelToolTip = new PanelToolTip();
			event.toolTip = ptt;
		}
	    
	    public function linkAlarm():void{
	    	line.refreshLine();
	    }
	    
	    public function neDown():void{
	    	map1.setNeState("assets/criticlaStatus.gif");
	    }
	    
	    public function show(aa:Cond):void{
	    	Alert.show("show");
	   		myPanel1 = ShowFlow(PopUpManager.createPopUp(aa, ShowFlow, true)); 			 	
	    }
	    
	    
		]]>
	</mx:Script>
	<mx:Canvas id="myCanvas" x="0" y="0" width="659" height="412" borderColor="#FF0000" borderStyle="solid" verticalScrollPolicy="off">
		<mx:Panel x="0" y="0" width="650" height="410" layout="absolute" id="myPanel" alpha="0.5">
			<mx:Button x="450" y="99" label="生成Topo" click="init();" id="mybutton"  borderColor="#008080" toolTip="aaaaaaaa"/>
			<mx:Label x="0" y="0" id="mylabel" />
			<mx:Button x="450" y="152" label="链路变色" width="75" click="show(this);"/>
			<mx:Button x="450" y="202" label="节点Down" width="75"/>
		</mx:Panel>
	</mx:Canvas>	
</mx:Application>

DRAG.rar (3.5 MB)
下载次数: 7589

5
顶

6
踩

分享到：

Flex+Spring配置 | 转oracle bin下命令含义

2008-03-31 12:58
浏览 10173
评论(15)
论坛回复 / 浏览 (13 / 12243)
分类:Web前端
查看更多

15 楼 dtctve67 2014-05-05

太乱了，还有错，文件都打不开，楼主这也太糊弄事了。

14 楼 neusoft_jerry 2014-04-21

做的啥乱七八糟的啊，各种错误，上传之前能不能先清理下。

13 楼 jauney 2009-08-07

请问下那个ShowFlow()类型是什么原因？我这儿的提示还是找不到

12 楼 piziwang 2008-07-16

有很多错误啊，比如 ShowFlow, PanelToolTip等等提示找不到类型
我用的是 flex3.0, 如何解决啊？？？

11 楼 hegang3 2008-06-27

这下可以了。谢谢楼主。

10 楼 hegang3 2008-06-19

注销掉一些代码后
PanelToolTip
ShowFlow
找不到。

9 楼 hegang3 2008-06-19

改动以后出错
var nelineFlag:NeLineFlag = lineList[i];
NeLineFlag 找不到类型或不是编译常量

8 楼 hegang3 2008-06-19

我的是 flex builder2
刚才cond的问题解决了。
谢谢jeffrey0411，centgo
还是很多类找不到。

7 楼 centgo 2008-06-18

Cond 应该是 Conf.mxml 就是那个测试类，名字应该一致。

6 楼 hegang3 2008-06-18

能问一下你的环境吗？
我这里是 flex builder 2 的
提示错误找不到Cond .

5 楼 jeffrey0411 2008-04-25

那些类没有？有可能是版本的问题吧

4 楼 yjlhope 2008-04-25

好多类都没有啊

3 楼 jeffrey0411 2008-04-10

Conf.mxml就是最后那个测试类

2 楼 fuwei2 2008-04-09

请问Conf是个哪个类？我一直编译不通过

1 楼 jeffrey0411 2008-04-08

这个是简单的一些例子，可以运行的，大家可以试试。
我会陆续把与spring的结合技术发布出来的。

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论