最简单的flex网络拓扑图开发（三）加入信息提示框

有些朋友在使用这个swc时候对我的设计的信息提示框有疑问。有些人好不了解我事件传输的机制。因为我设计中是所有网元公用一个详细信息提示框，在网元初始化时候把信息提示框的对象传入给网元。如果所有网元都共用一个信息提示框，系统的性能开销比较容易控制。

? ? ? ?信息提示框的数据xml

<?xml version="1.0" encoding="UTF-8"?>  
<BusinessView saveUrl="/GraphicalView.do?method=saveMap&mapId=2">  
    <Nodes>  
        <Node image="asset/topo/atm_switch_lucent_down.gif" y="37" id="1" label="名称:MyBizView"  
             x="359" url="www.hao123.com" width="32" height="32" message="123" />  
        <Node image="asset/topo/atm_switch_lucent_down.gif" y="177" id="2" label="测试"  
             x="634" url="www.hao123.com" width="32" height="32"  message="123"/>  
    </Nodes>  
    <Lines>  
        <Line end="2" color="0xd9D6C3" start="1" />  
    </Lines>  
</BusinessView>

使用案例

<?xml version="1.0" encoding="utf-8"?>  
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"   
			   xmlns:s="library://ns.adobe.com/flex/spark"   
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" xmlns:topo="com.shine.topo.view.topo.*">  
	<s:layout>  
		<s:BasicLayout/>  
	</s:layout>  
	<fx:Declarations>  
		<!-- 将非可视元素（例如服务、值对象）放在此处 -->  
	</fx:Declarations>  
	<fx:Script>  
		<![CDATA[ 
			import com.shine.framework.core.model.BaseXmlModel;
			import com.shine.framework.core.util.ArrayMap;
			import com.shine.framework.core.util.BaseHttpServiceUtil;
			import com.shine.framework.core.util.XMLArrayCollection;
			import com.shine.topo.view.BaseInfoContainer;
			import com.shine.topo.view.Line.TopoLine;
			import com.shine.topo.view.node.BaseNodeContainer; 
			
			private var resultXmlModelArrayCollertion:XMLArrayCollection=null; 
			private var lineXmlModelArrayCollection:XMLArrayCollection=null; 
			private var nodeMap:ArrayMap=null; 
			
			private function complete():void{ 
				container.completeLoading(); 
				
				//远程加载xml 
				var httpUtil:BaseHttpServiceUtil=new BaseHttpServiceUtil; 
				httpUtil.getResultXml("test.xml",xmlResult); 
			} 
			
			private function xmlResult(xml:String):void{ 
				nodeMap=new ArrayMap; 
				
				//加入提示框
				var baseInfoContainer:BaseInfoContainer=new BaseInfoContainer;
				baseInfoContainer.visible=false;
				this.addElement(baseInfoContainer);
				
				//解析所有的Node节点 
				resultXmlModelArrayCollertion=new XMLArrayCollection; 
				resultXmlModelArrayCollertion.saxXmlNodeByTag(XML(xml),["Node"]); 
				
				for each(var baseXmlModel:BaseXmlModel in resultXmlModelArrayCollertion){ 
					var node:BaseNodeContainer=new BaseNodeContainer; 
					node.initNode(baseXmlModel); 
					container.addTopoNode(node); 
					node.infoContainer=baseInfoContainer;
					nodeMap.put(baseXmlModel.getString("id"),node); 
				} 
				
				lineXmlModelArrayCollection=new XMLArrayCollection; 
				lineXmlModelArrayCollection.saxXmlNodeByTag(XML(xml),["Line"]); 
				
				for each(var baseXmlModel:BaseXmlModel in lineXmlModelArrayCollection){ 
					var  line:TopoLine=new TopoLine(); 
					line .initTopoLine(baseXmlModel,BaseNodeContainer(nodeMap.get(baseXmlModel.getString("start"))),BaseNodeContainer(nodeMap.get(baseXmlModel.getString("end")))); 
					container.addTopoLine(line); 
				} 
			} 
		]]>  
	</fx:Script>  
	<topo:BaseTopoContainer id="container" width="100%" height="100%" creationComplete="{complete()}" />  
</s:Application>  

我们在系统初始化初始一个信息提示框，然后再把注册到每个node中，然后当鼠标移到节点上立刻有提示。

效果截图