Flex将XML数据编程tree树形

txl.xml如下:

 

<?xml version="1.0" encoding="utf-8"?>

<data value="XX通讯录">
	<data1 value="办公室">
		<xm value="冯XX" bg="4278952XX" tel="135948659XX"/>
		<xm value="李XX" bg="6464664XX" tel="134589645XX"/>
		<xm value="张XX" bg="4546464XX" tel="130464977XX"/>
		<xm value="王XX" bg="9469467XX" tel="158946113XX"/>
	</data1>
	<data2 value="销售处">
		<xm value="冯XX" bg="4278952XX" tel="135948659XX"/>
		<xm value="李XX" bg="6464664XX" tel="134589645XX"/>
		<xm value="张XX" bg="4546464XX" tel="130464977XX"/>
		<xm value="王XX" bg="9469467XX" tel="158946113XX"/>
	</data2>
	<data3 value="技术部">
		<xm value="冯XX" bg="4278952XX" tel="135948659XX"/>
		<xm value="李XX" bg="6464664XX" tel="134589645XX"/>
		<xm value="张XX" bg="4546464XX" tel="130464977XX"/>
		<xm value="王XX" bg="9469467XX" tel="158946113XX"/>
	</data3>
	<data4 value="财务部">
		<xm value="冯XX" bg="4278952XX" tel="135948659XX"/>
		<xm value="李XX" bg="6464664XX" tel="134589645XX"/>
		<xm value="张XX" bg="4546464XX" tel="130464977XX"/>
		<xm value="王XX" bg="9469467XX" tel="158946113XX"/>
	</data4>
	<data5 value="行政部">
		<xm value="冯XX" bg="4278952XX" tel="135948659XX"/>
		<xm value="李XX" bg="6464664XX" tel="134589645XX"/>
		<xm value="张XX" bg="4546464XX" tel="130464977XX"/>
		<xm value="王XX" bg="9469467XX" tel="158946113XX"/>
	</data5>
	
</data>

 

 

Flex实现如下:

 

<?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" creationComplete="application1_creationCompleteHandler(event)">
	<s:layout>
		<s:BasicLayout/>
	</s:layout>
	<fx:Script>
		<![CDATA[
			import mx.events.FlexEvent;
			import mx.events.ListEvent;
			import mx.rpc.events.ResultEvent;
			
			[Bindable]
			private var data1 : XML;
			
			protected function application1_creationCompleteHandler(event:FlexEvent):void
			{
				http.send();
			}


			protected function http_resultHandler(event:ResultEvent):void
			{
				data1 = event.result as XML;
				tree1.dataProvider = data1;
			}


			protected function tree1_itemClickHandler(event:ListEvent):void
			{
				bgtel.text = tree1.selectedItem.@bg;
				sjtel.text = tree1.selectedItem.@tel;
			}

		]]>
	</fx:Script>
	<fx:Declarations>
		<!-- 将非可视元素(例如服务、值对象)放在此处 -->
		<s:HTTPService id="http" url="txl.xml" resultFormat="e4x" result="http_resultHandler(event)"/>
			
	</fx:Declarations>
	<s:Panel x="10" y="37" width="458" height="275" title="通讯录" id="panel1">
		<mx:Tree x="0" y="0" width="224" height="242" id="tree1" labelField="@value" itemClick="tree1_itemClickHandler(event)"></mx:Tree>
		<s:TextInput x="307" y="49" id="bgtel"/>
		<s:TextInput x="310" y="132" id="sjtel"/>
		<s:Label x="251" y="56" text="办公电话" height="22" width="62"/>
		<s:Label x="256" y="138" text="手机号码" width="54"/>
		<s:Label x="251" y="10" text="点击某个人时,此处就会显示出来这个人的通讯信息" width="171" height="31"/>
	</s:Panel>
</s:Application>

 效果如下:

 



 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值