Flex tree组件数据源、图标等修改

所属分类: 网页制作 / Flash 阅读数: 1997
收藏 0 赞 0 分享
更换Tree组件默认、打开、关闭、有子项等几个状态下的ico图标。
复制代码 代码如下:

<?xml version="1.0" encoding="utf-8"?>
<!-- Tree control example. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    <!--下面是样式-->
    <mx:Style >
        Tree
    {    
        verticalScrollBarStyleName: treeVerticalScrollBar;
        selectionColor: #417597;
     /*为默认、打开、关闭、有子项等几个状态添加不同的ico*/
        defaultLeafIcon: Embed(source="longstep/icon/sharp_grey/gif/base.gif");
        folderOpenIcon: Embed(source="longstep/icon/sharp_grey/gif/vote_yes.gif");
        folderClosedIcon: Embed(source="longstep/icon/sharp_grey/gif/options.gif");
        disclosureOpenIcon: Embed(source="longstep/icon/sharp_grey/gif/pause.gif");
    }
    .treeVerticalScrollBar
    {
        borderColor: #f00;
    }
    </mx:Style>
<mx:Script>
<![CDATA[
        //绑定数据,定义xml类型变量用于存放选中节点
[Bindable]
public var selectedNode:XML;
//当tree发生change事件时的事件
public function treeChanged(event:Event):void {
//将选中的节点转换成xml,赋予selectedNode,as为转换类型
selectedNode=Tree(event.target).selectedItem as XML;
}
     //tree有3个事件使用较多,change、itemClick、itemOpen、itemClose
     //change:选中列改变时被触发
     //itemClick:点击某一列时触发
     //itemOpen:节点展开时触发
     //itemClose:节点关闭时触发
]]>
</mx:Script>
<!--XMLList作为数据源是最适合于tree组件的-->
<mx:XMLList id="treeData">
     <node label="Mail Box">
     <node label="Inbox">
     <node label="Marketing"/>
     <node label="Product Management"/>
     <node label="Personal"/>
     </node>
     <node label="Outbox">
     <node label="Professional"/>
     <node label="Personal"/>
     </node>
     <node label="Spam"/>
     <node label="Sent"/>
        </node>    
</mx:XMLList>
<mx:Panel title="Tree Control Example" height="75%" width="75%"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">
<mx:Label width="100%" color="blue"
text="Select a node in the Tree control."/>
<mx:HDividedBox width="100%" height="100%">
<!--@表示xml中间点的属性,如:@label表示label属性的值-->
<!--dataProvider="{treeData}"表示绑定数据,数据源可以是XML也可以是XMLList-->
<mx:Tree id="myTree" width="50%" height="100%" labelField="@label"
showRoot="false" dataProvider="{treeData}" change="treeChanged(event)"/>
<mx:TextArea height="100%" width="50%"
text="Selected Item: {selectedNode.@label}"/>
</mx:HDividedBox>
</mx:Panel>
</mx:Application>
更多精彩内容其他人还在看

js与flash的交互FLASH连播控制器

js与flash的交互FLASH连播控制器
收藏 0 赞 0 分享

Flash CS3组件开发图文教程

Flash CS3组件开发图文教程
收藏 0 赞 0 分享

flash as Actionscript中的数组的使用方法

flash as Actionscript中的数组的使用方法
收藏 0 赞 0 分享

用flash as脚本 控制 Flash中文本框样式的代码

用flash as脚本 控制 Flash中文本框样式的代码
收藏 0 赞 0 分享

209个透明flash背景以及使用方法详解

我们平时做站的时候偶尔会用到一些比较炫的透明flash去修饰页面,但如果你自己并没有那么高深的flash技术可以随意创造心中所想的效果时,那么这些flash透明和背景或许能帮到你,其中有一些是很漂亮的!
收藏 0 赞 0 分享

比较漂亮的几款可爱的flash日历收藏

比较漂亮的几款可爱的flash日历收藏
收藏 0 赞 0 分享

Flash 与 html 的一些实用技巧

Flash 与 html 的一些实用技巧
收藏 0 赞 0 分享

全flash站制作剖析

全flash站制作剖析
收藏 0 赞 0 分享

flash加载各种外部文件

flash加载各种外部文件
收藏 0 赞 0 分享

收藏了98个flash片头

收藏了98个flash片头
收藏 0 赞 0 分享
查看更多