`
kubeebaba
  • 浏览: 16084 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类

自定义Flex的tree节点图标

    博客分类:
  • flex
阅读更多
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" >
<mx:Script>
  <![CDATA[
   import mx.collections.XMLListCollection;
 
   [Embed(source="assets/max_over.gif")]          //这是图片的相对地址
         [Bindable]
         public var OKicon:Class;
        
         [Embed(source="assets/close_over.gif")]          //这是图片的相对地址
         [Bindable]
         public var NOicon:Class;
  
   //设置不同图表          
   private function iconFun(item:Object):*
   {
    var xml:XML     = item as XML;
   
    if(xml.attribute("bool") == true)
     return OKicon;
    else if(xml.attribute("bool") == false)
     return NOicon;
   } 
  ]]>
</mx:Script>

<mx:XMLListCollection id="datatree" >
  <mx:source>
            <mx:XMLList>
                <node label="NO1" bool="false">
                    <node label="NO11" bool="false">
                        <node label="NO111" bool="false"/>
                    </node>
                    <node label="NO22" bool="true"/>
                </node>
                <node label="NO2" bool="true">
                    <node label="NO11" bool="false">
                     <node label="NO111" bool="false"/>
                    </node>
                    <node label="NO22" bool="true">
                     <node label="NO222" bool="false"/>
                    </node>
                </node>
            </mx:XMLList>
  </mx:source>
</mx:XMLListCollection>

<mx:Tree id="tree" y="40" width="100%" height="100%" fontFamily="Arial" fontSize="12"
   dataProvider="{datatree}" labelField="@label" iconFunction="iconFun" />
</mx:Application>
分享到:
评论

相关推荐

    flex树自定义节点图标

    总之,自定义Flex Tree节点图标是一项重要的视觉设计任务,它可以通过多种方式实现,包括数据驱动、自定义渲染器和CSS样式。理解并掌握这些方法将有助于创建更加美观、易用的树形组件,从而提升应用程序的整体用户...

    flex tree 修改icon方法

    在这个场景下,我们需要通过编程方式来实现对Tree节点图标的个性化设置。 首先,我们要理解Flex Tree的基本结构。Tree组件由一系列的TreeItemRenderer组成,每个TreeItemRenderer对应树中的一个节点。图标是...

    Flex tree的用法

    - **样式和外观**: 你可以自定义节点的样式,包括字体、颜色、展开/折叠图标等,以符合应用程序的UI设计。 2. **使用XML数据** - **XML数据绑定**: Tree组件可以轻松地绑定到XML数据源。XML的层级结构非常适合...

    flex tree控件

    下面我们将深入探讨Flex Tree控件的基本概念、自定义节点图标以及使用线条连接节点的方法。 1. Flex Tree控件基本概念: Flex Tree控件是Adobe Flex框架中的一个组件,用于展示具有层级关系的数据。每个节点可以...

    flex tree icon

    在Flex中,你可以通过设置`Icon`属性来为Tree节点添加图标。例如,你可以为根节点、展开节点、折叠节点等设置不同的图标。同时,如果数据源是XML或ArrayCollection,可以通过数据绑定将图标URL与节点数据关联起来。...

    flex tree的简单使用

    在实际应用中,我们可能会遇到更复杂的需求,比如异步加载数据、自定义节点图标、拖放功能等。对于这些高级特性,我们需要深入理解Flex的事件模型和数据绑定机制。 在MXML中创建Tree的基本语法如下: ```xml &lt;Tree...

    flex tree checkbox

    在Flex中添加复选框到Tree节点,通常需要自定义TreeItemRenderer。ItemRenderer是Flex提供的一种机制,允许开发者为UIComponent的每个项提供自定义的显示方式。对于TreeChk项目,我们可能需要创建一个新的MXML或...

    flex tree 中渲染checkBox

    `flex tree 中渲染checkBox`这个话题涉及到在Flex Tree组件的每个节点上添加复选框控件,使得用户能够通过单击复选框来选择或取消选择树的特定部分。这在数据分层展示和多选操作的场景中特别常见,例如文件管理器或...

    各种Flex自定义组件

    自定义的tree可能提供了更好的节点操作,如拖放功能、展开/折叠动画或者自定义图标和节点模板。 4. 下拉组合框(combox):在Flex中,combox结合了输入框和下拉列表,用于用户选择一个预设值。自定义的combox可能有...

    flex自定义树形结构

    结合`Flex`与`Tree`,我们可以构建一个自定义的树形结构。以下是一些关键步骤和知识点: 1. **容器设置**:首先,我们需要一个容器来承载整个树形结构。这个容器应该应用`display: flex`样式,使其成为Flex容器,并...

    Flex 下拉框为Tree的ComboBox

    还可以考虑在Tree节点上添加图标,或者实现懒加载,以提高大量数据时的性能。另外,如果需要跨平台或响应式设计,还可以考虑使用Spark或Mobile的ComboBox组件进行相应调整。 总之,"Flex下拉框为Tree的ComboBox"是...

    Flex tree加虚线显示效果并且替代原始图标

    ItemRenderer是Flex组件中用来定义数据项显示方式的模块,通过编写自定义的ItemRenderer,可以自定义节点的外观和行为。在本例中,主要是通过设置相关属性,使得原先的图标被禁用,并且用自定义的虚线图像来替代。 ...

    flex4Tree组件分层显示数据示例

    总之,这个“flex4Tree组件分层显示数据示例”将演示如何在Flex4环境中创建一个功能完善的Tree组件,包括数据绑定、自定义渲染器、事件处理和优化性能的方法。通过深入研究这个示例,开发者可以更好地理解和掌握在...

    flex 异步加载tree

    AsyncTree是Flex中的一个自定义组件,它允许开发者构建能够异步加载数据的树形结构。这通常用于展示大量数据或者需要动态加载子节点的情况。通过这种方式,可以显著提高应用的性能和用户体验。 ### 二、代码解析 #...

    构造flex3.5的带复选框的树(CheckBoxTree)

    5. **自定义图标**:如果还需要自定义节点的图标,可以在XML数据源中添加一个属性来表示图标,并在渲染器中根据该属性来显示图标。例如,可以添加一个`icon`属性,并在渲染器中使用Image组件来显示。 通过以上步骤...

    FLEX ——完美的 TREE

    5. **皮肤和外观**:为了达到“完美”的效果,你可能需要定制TREE组件的外观,这包括修改节点的展开/折叠图标、选中状态、鼠标悬停效果等。FLEX提供了丰富的皮肤机制来实现这一点。 6. **性能优化**:对于大规模的...

    flex xml生成tree 源码

    标题:Flex XML生成Tree源码 描述:此代码示例展示了如何在Flex应用程序中使用XML数据来动态生成一个树形结构(Tree)。Flex是Adobe Systems开发的一款开源框架,用于构建跨平台的桌面和移动设备应用。这段代码通过...

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

    综上所述,本示例通过XML数据源和样式定制,展示了如何在Flex中创建和自定义Tree组件,以实现一个动态的树形数据展示界面。通过合理的组件事件监听和数据绑定,开发者可以创建响应用户交互的丰富应用。

    Flex4_DataGrid_Tree_条目渲染器_源码

    对于Tree,我们可以创建一个自定义的MX:TreeItemRenderer,同样通过重写相关方法来控制节点的呈现方式,如添加额外的图标的显示,或者改变文字样式等。 在"Flex4_DataGrid_Tree_条目渲染器_源码"这个资源中,"My05_...

    flex4 选择树组件

    自定义渲染器可以为每个节点提供更复杂的视图,如包含图标、复选框或其他UI元素。 7. **折叠与展开**:Tree组件支持节点的折叠和展开。`expanded`属性决定了节点的初始状态,而`toggleItem()`方法可以用来切换节点...

Global site tag (gtag.js) - Google Analytics