随笔-348  评论-598  文章-0  trackbacks-0
Flex中Tree控件的开发

在Flex的开发中，Tree控件是比较常用的控件，Flex开发文档为我们提供了丰富的示例，但在实际开发中，我们经常要从自己的XML文件中获取数据，而开发文档中这方面资料比较欠缺。

下面我介绍一种比较有用的Tree控件开发方法。

    <mx:Tree id="MusicTypeTree"
        left="5" right="5" 
        showRoot="false"
        labelField="@label"        
        bottom="5" top="40"
        click="click(event)"/>
        


这是我定义的一个Tree，labelField你可以自己定义成你的XML文件中Label Attribute的Name

 <mx:HTTPService
  id="SrvTreeList"
  url="{urlTREELIST}"
  useProxy="false"
  result="init()"
   resultFormat="xml"
  />


定义一个HTTPService，当然也可以是WebService，看你从哪里获得数据了，切记这里的resultFormat一定要是XML，否则无法解析

<mx:Script>
  <![CDATA[
   import mx.controls.Alert;
   import flash.net.URLRequest;
   private var XMLTreeList:XML;
   private var u:URLRequest;
   private function init():void
   {
    //先把数据取出来交给XML,再交给dataProvider，因为dataProvider不能直接解析String为XML
    XMLTreeList=XML(SrvTreeList.lastResult.toString());
    MusicTypeTree.dataProvider=XMLTreeList;
   }
   
   private function click(obj:Event):void
   {
    //如果有value属性，也就是子node，直接打开相关页面
    if(MusicTypeTree.selectedItem.hasOwnProperty("@value"))
    {
     u=new URLRequest(MusicTypeTree.selectedItem.@value);
     navigateToURL(u);
    }else{
     //没有那就展开，如果展开了就收缩
     MusicTypeTree.expandItem(MusicTypeTree.selectedItem,!MusicTypeTree.isItemOpen(MusicTypeTree.selectedItem),true);
    }
   }
  ]]>
 </mx:Script>

 
这就是上面两个控件牵扯到的init()和click()方法的代码，别忘了HTTPService先要在页面加载完成后send()下，否则没数据。init()方法让Tree显示出来，click方法接受事件的触发，当然click事件可以根据程序需要进行修改。

下面是我的XML文件

<?xml version="1.0" encoding="utf-8"?>
<MyMusicOnline>
    <node label="Piano">
        <node label="Piano1" value="http://www.gcoresoft.com/"/>
        <node label="Piano2"/>
    </node>
    <node label="Bass">
        <node label="Bass1"/>
        <node label="Bass2"/>
    </node>
    <node label="Sax">
        <node label="Sax1"/>
        <node label="Sax2"/>
    </node>
    <node label="Guitar">
        <node label="Guitar1"/>
        <node label="Guitar2"/>
    </node>
</MyMusicOnline>

 

希望我的方法对大家的开发有所帮助。



---------------------------------------------------------
专注移动开发
Android, Windows Mobile, iPhone, J2ME, BlackBerry, Symbian
posted on 2007-04-22 20:15 TiGERTiAN 阅读(3725) 评论(1)  编辑  收藏 所属分类: Flex

评论:
# re: Flex中Tree控件的开发 2007-06-05 11:33 | fanzy
不知道是否能讲解一下：关于如何在xml中定义各节点的图标，并实现非叶子节点与叶子节点的图标绑定？

E-mail：fanzy1981.126.com  回复  更多评论
  

只有注册用户登录后才能发表评论。
网站导航:
 
Powered by: 博客园 模板提供：沪江博客 Copyright ©2024 TiGERTiAN