`
miss4813
  • 浏览: 104374 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

自定义Tree组件图标(ICON)

XML 
阅读更多
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" fontSize="12" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#FFFFFF, #FFFFFF]" width="270" height="420">
	<mx:Script>
		<![CDATA[
			[Embed(source="gif/ico_zp.gif")]
			[Bindable]
			public var ico_zp:Class;
			
			[Embed(source="gif/ico_rj.gif")]
			[Bindable]
			public var ico_rj:Class;
			
			[Embed(source="gif/ico_dtyx1.gif")]
			[Bindable]
			public var ico_dtyx1:Class;
			
			[Embed(source="gif/ico_test.gif")]
			[Bindable]
			public var ico_test:Class;
			
			[Embed(source="gif/icon_tx.gif")]
			[Bindable]
			public var icon_tx:Class;
			
			[Embed(source="gif/ico_park.gif")]
			[Bindable]
			public var ico_park:Class;
			
			[Embed(source="gif/ico_mm.gif")]
			[Bindable]
			public var ico_mm:Class;
			
			[Embed(source="gif/icon_yr.gif")]
			[Bindable]
			public var icon_yr:Class;
		
			[Embed(source="gif/ico_lw_bg.gif")]
			[Bindable]
			public var ico_lw_bg:Class;
			
			[Embed(source="gif/ico_city.gif")]
			[Bindable]
			public var ico_city:Class;
			
			[Embed(source="gif/ico_cg.gif")]
			[Bindable]
			public var ico_cg:Class;
			
			[Embed(source="gif/ico_music_bg.gif")]
			[Bindable]
			public var ico_music_bg:Class;
			
			[Embed(source="gif/icon_28.gif")]
			[Bindable]
			public var icon_28:Class;
		
			[Bindable]
			private var _data:XML = <data>
						<item name="照片" ico="ico_zp"/>
						<item name="日记" ico="ico_rj">
							<item name="礼物" ico="ico_lw_bg"/>
							<item name="足迹" ico="ico_city"/>
							<item name="模拟炒股" ico="ico_cg"/>
							<item name="音乐" ico="ico_music_bg"/>
							<item name="答题" ico="icon_28"/>
						</item>
						<item name="动他一下" ico="ico_dtyx1"/>
						<item name="测试" ico="ico_test"/>
						<item name="知我多少" ico="icon_tx"/>
						<item name="争车位" ico="ico_park"/>
						<item name="朋友买卖" ico="ico_mm"/>
						<item name="咬人" ico="icon_yr"/>
					</data>
		]]>
	</mx:Script>
	<mx:Tree x="10" y="10" width="250" height="400" labelField="@name" folderClosedIcon="{ico_rj}" folderOpenIcon="{ico_rj}" iconField="@ico" dataProvider="{_data.item}"></mx:Tree>
</mx:Application>
分享到:
评论

相关推荐

    树形组件扩展版(图标)

    3. **自定义图标组件**:允许用户传入自定义的React组件或Vue组件作为图标,增加灵活性。这需要`tree.js`库支持组件化的渲染方式。 4. **图标库集成**:与流行的图标库(如Font Awesome、Material Icons)集成,...

    zTree自定义状态图标实现

    在IT领域,尤其是在前端开发中,zTree是一个广泛使用的JavaScript库,它专门用于构建树状结构的组件。本文将深入探讨如何利用zTree的自定义属性功能,...通过实践和调试,我们能够打造出满足项目需求的个性化Tree组件。

    flash中tree组件的应用说明及实例(非常详细)

    Tree组件提供了丰富的自定义选项,如节点图标、选择样式、展开状态等,可以灵活地调整以适应不同的设计需求。 二、Tree组件的属性与方法 1. data:定义了Tree节点的数据源,可以是XML、Array或Object,用于存储...

    fuelux.tree 自定义属性控件-自定义图标+动态加载数据+添加点击事件

    在本文中,我们将深入探讨如何使用 FuelUX 的 Tree 控件来实现自定义图标、动态加载数据以及添加点击事件,从而创建更加互动且功能丰富的用户界面。 首先,让我们了解 FuelUX Tree 控件的基本概念。Tree 控件是一种...

    flex tree 修改icon方法

    当我们需要自定义Tree中的节点图标时,可能会遇到如何根据数据源动态改变图标的问题。标题"flex tree 修改icon方法"正好指出了这一需求。在这个场景下,我们需要通过编程方式来实现对Tree节点图标的个性化设置。 ...

    element-ui tree结构实现增删改自定义功能代码

    在本文中,我们将深入探讨如何使用Element-UI的Tree组件实现增删改的自定义功能。Element-UI是一个基于Vue.js的开源UI组件库,它提供了丰富的组件供开发者使用,其中包括Tree组件,用于展示层级关系的数据。在描述的...

    EasyUI_Icon_图标扩展样式(1775个)

    它提供了丰富的组件,如表格、下拉菜单、对话框、按钮等,并且内置了一些基本的图标(Icon)。然而,正如标题和描述中提到的,EasyUI 自带的图标可能在数量和美观度上不能满足所有开发者的需要。为了丰富界面设计,...

    flex树自定义节点图标

    本主题将深入探讨如何在Flex Tree中实现自定义节点图标,以及与之相关的源码分析。 1. **自定义节点图标的意义** - 节点图标可以增强用户对树结构的理解,通过图标直观地传达节点类型或状态信息。 - 图标可以是...

    可编辑el-tree样式功能修改:修改icon、可编辑input、修改下拉展开icon位置

    通过以上的步骤,你将能够成功地对 el-tree 组件进行样式和功能的自定义,包括修改图标、实现可编辑输入框以及调整展开图标的定位。在实际开发中,记得根据具体需求灵活调整代码,确保其符合项目规范。

    flex tree icon

    对于博文链接,虽然具体内容未提供,但我们可以推测这可能是一个关于如何在Flex中实现自定义树形组件图标的技术分享。通常,这样的博客会包含代码示例,演示如何在ActionScript中创建和配置Tree组件,如何处理数据源...

    EasyUI_Icon_图标扩展(1775个)

    它提供了丰富的组件,如表格、下拉菜单、对话框、按钮等,以及一套易于使用的样式和图标集。然而,正如标题所指出的,EasyUI 自带的图标集可能在某些情况下无法满足开发者对于视觉效果和多样性的需求。 "EasyUI_...

    EasyUI 扩展小图标Icon带CSS样式

    "EasyUI 扩展小图标Icon带CSS样式" 是为了应对EasyUI内置图标不足和美观度不高的问题而创建的资源包。这个扩展包包含了一套更全面、更美观的图标库,适用于各种项目需求,可以直接整合到基于EasyUI的项目中使用,极...

    Element-ui树形控件el-tree自定义增删改和局部刷新及懒加载操作

    需求: vue-cli项目树形...element组件样式 &lt;el-tree class="treeitems" :data="data" node-key="id" :props="defaultProps" :load="loadNode" lazy :default-expanded-keys="[0]" @node-click="handle

    extjs的tree的使用

    对于Tree组件,你可以通过修改`.x-tree-node-icon`、`.x-tree-node-text`等类来调整节点图标和文本的样式。 ### 总结 ExtJS的Tree组件是一个功能强大且高度可定制的工具,用于展示分层数据。通过上述介绍,你应该...

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

    4. **配置Tree组件**:最后,我们将XML数据源绑定到Tree组件,并设置树的itemRenderer属性为我们之前创建的自定义渲染器。 ```xml &lt;tree:dataProvider&gt; &lt;/tree:dataProvider&gt; &lt;tree:itemRenderer&gt; &lt;/tree...

    layui-tree树形模板

    3. **扩展属性**:除了基本的属性外,还可以自定义其他属性以满足特定需求,例如`spread`用于控制节点默认展开或关闭,`icon`设置节点图标等。 4. **事件绑定**:layui-tree支持各种交互事件,如点击节点、勾选/...

    layui tree树结构源码

    同时,也可以通过CSS类`layui-tree-icon`、`layui-tree-node`等进行更细致的调整。 7. **扩展功能**: layui tree还支持节点拖拽排序、节点复选、节点右键菜单等功能,这些都是通过layui提供的API和配置选项实现的...

    react-lib:react组件库

    DefineComponent 自定义组件封装 EchartFrame echarts组件封装 Form 表单组件 Icon 按钮(兼容iconfont) Img 图片组件(按顺序加载) Input 输入框组件 Link 路由跳转组件 Loading 加载中组件 Modal 对话框封装组件...

Global site tag (gtag.js) - Google Analytics