- 浏览: 561690 次
博客专栏
-
开源视频会议bigblue...
浏览量:87079
文章分类
最新评论
-
qq632680822:
你好,请问第八条sql优化最佳实践中from 子句--执行顺序 ...
高效sql性能优化极简教程 -
tan_zheng:
大神 ,为什么我没有 bbb-conf --setup-dev ...
开源视频会议bigbluebutton开发(4)——构建开发环境,客户端开发 -
lixuejian:
6666666
过年了,让你的服务器提高警惕! -
tonney:
直播直播直播
直播技术视频教程分享 -
GYHui881204:
直播
直播技术视频教程分享
Flex Tree和其他控件的联动
首先图下面的数据列表需要根据树中点击的不同项来动态生成,因为的不同项显示的内容是不一样的。这里主要讲一下树和显示列表的联动,即:点击树的另外节点时 TabNavigator应该切换到该节点对应的数据列表,而在TabNavigator中切换的时候,Tree中选择的节点也做相应的切换。
1.树控制控件
private function onTreeChange(event:ListEvent):void
{
var itemIsBranch:Boolean = inforTree.dataDescriptor.isBranch(inforTree.selectedItem);//判断是否为根节点
if(itemIsBranch) //根节点
{
//如果是上一次点击过的根节点
if(openedItem==inforTree.selectedItem)
{
return ;
}
openedItem=inforTree.selectedItem;
var length:int= inforTree.dataDescriptor.getChildren(event.itemRenderer.data).length;
var xml:XML=event.itemRenderer.data as XML;
var xmllist:XMLList=xml.children().attribute("Text"); //Text属性
var leafcd:String=xml.attribute("leaf_cd"); //编号
var tablename:String=xml.attribute("leaf_tablename");//表名
var type:XMLList=xml.children().attribute("sub_tablename"); //类型
this.iforTab.removeAllChildren(); //先清除上次TabNavigator中的子控件
for(var i:int=0;i<xmllist.length();i++)
{
creatCanvas(xmllist[i].toString(),i,type[i].toString(),leafcd,tablename);//创建显示列表的方法
}
iforTab.selectedIndex=0;
}else //子节点
{
var tempTree:Tree=Tree(event.target);
var obj:Object= tempTree.getParentItem(inforTree.selectedItem); //获取该子节点对应的父节点
var o:XML=inforTree.selectedItem as XML;
var name:String=o.attribute("Text");
if(openedItem==obj)
{
//如果是同一个父节点下的字节点
iforTab.selectedIndex=iforTab.getChildIndex(iforTab.getChildByName(name)); //切换TabNavigator中显示的列表
return ;
}
openedItem=obj;
var xml2:XML=obj as XML;
var xmllist2:XMLList=xml2.children().attribute("Text");
var leafcd2:String=xml2.attribute("leaf_cd"); //编号
var tablename2:String=xml2.attribute("leaf_tablename");//表名
var type2:XMLList=xml2.children().attribute("sub_tablename"); //类型
this.iforTab.removeAllChildren();
for(var j:int=0;j<xmllist2.length();j++)
{
creatCanvas(xmllist2[j].toString(),j,type2[j].toString(),leafcd2,tablename2);
}
index=iforTab.getChildIndex(iforTab.getChildByName(name));
//设置Tab的第一个项为当前显示的项
inforTree.callLater(setIndex);
}
}
//设置TabNavigator当前显示的位置
private function setIndex():void
{
iforTab.selectedIndex=index;
}
//创建TabNavigator的子项
private function creatCanvas(text:String,index:int,type:String,leafcd:String,tableName:String):void
{
var userdg:userDataGrid=new userDataGrid(); //自定义的数据显示控件
userdg.hs=this;
userdg.name=text;
userdg.type=type;
userdg.table_name=tableName;
userdg.leafcd=leafcd;
userdg.width=this.iforTab.width;
userdg.height=this.iforTab.height;
userdg.label=text;
this.iforTab.addChildAt(userdg,index); //自定义的数据显示控件添加到TabNavigator中的index处
}
到此为止,树控制控件已经实现,接下来是控件控制树
2.控件控制树
实现方法是,找出控件对应关联的节点在整个数据源中的位置,然后通过设置树的selectedIndex属性来实现。
private function onIndexChange(event:IndexChangedEvent):void
{
var name:String=event.relatedObject.name;//tab的名字
var arrText:XMLList=openedItem.products; //当前树中点击的父节点
var openX:XML=openedItem as XML;
var openedIndex:int=openX.childIndex(); //当前父节点所在整个xml数据源中的位置
//父节点的位置
var itemInd:int;
for(var i:int=0;i<openedIndex;i++)
{
itemInd+=(M_xml[i]as XML).children().length();//M_xml为树的数据源,这里获取到openedItem兄弟节点下的子节点数
}
itemInd+=openedIndex; //加上父节点占的位置
//子节点的位置
var leafIndex:int;
for(var j:int=0;j<arrText.length();j++)
{
if(arrText[j].@Text==name)
{
leafIndex=++j;
}
}
this.inforTree.selectedIndex=itemInd+leafIndex;
}
到此此功能成功实现,树的子节点层数不同代码会有所不同,但是思路是正确的。
发表评论
-
flex二维单列或者多列冒泡排序
2012-07-19 10:21 1507第一次循环,把二维数组中的一维数组的第一个元素最小的那一组放在 ... -
flex任意样式生成器
2012-07-11 13:35 1462flex任意样式生成器,各种风格,颜色,布局等等 -
flex任意多边形代码生成器
2012-07-11 13:29 1429flex任意多边形代码生成器,圆,多边形,星形代码生成器 ... -
flex任意多边形代码生成器
2012-07-11 13:22 1下面是flex任意多边形代码生成器, 在附件中 -
flex点到线段的距离
2012-06-27 15:17 1489// 计算两点之间的距离 private fu ... -
开心农场前端程序源码
2012-06-20 13:05 3153开心农场前端程序源码,界面: 源码附件中 -
flex 多级窗口互调连接oracle动态管理生成动态datagrid
2012-06-15 14:35 23345废话不多说,直接上代码讲解: 首先是对datagrid的管理界 ... -
flex中dictionary跟Object的区别与遍历
2012-06-12 10:09 1916flex中dictionary跟Object的区别与遍历 ... -
Array的复制
2012-04-26 10:57 964ActionSctipt中Array的复制方法,常用有 ... -
mx_internal_uid的在数据传递时的重复解决方法 - 两个datagrid直接拖拽复制数据
2012-04-12 16:12 1288我们首先了解一下【mx_internal_ui ... -
Flex的Array和ArrayCollection总结
2012-04-11 02:56 1569Flex的Array和ArrayCollecti ... -
flex中dictionary跟Object的区别与遍历
2012-04-11 02:55 1855AS3中Object和 Dictionary都可以用来 ... -
flex object 联合数组
2012-04-11 02:53 1931问题我要创建用名称元素作为索引的数组解决办法创建联合数组 ... -
flex数据基础 array和arraycollection
2012-04-11 02:50 1479Flex数据基础-Array与ArrayCollecti ... -
flex button字竖排显示
2012-04-10 15:48 3538由于产品功能的要求,需要让按钮Label垂直显示,看了 ... -
flex titilewindow
2012-04-10 15:49 1111利用popupmanager两种创建titlewindow的方 ... -
flex弹出窗口的方式有几种
2012-04-10 14:44 14043Flex 中有两种弹出窗口: 1. 最简单的警告窗口 你需 ...
相关推荐
综上所述,对Flex Tree控件的定制主要包括自定义节点渲染器以去除默认图标和添加线连接,同时还需要考虑性能优化和用户体验。通过深入理解和实践这些知识点,可以创建出符合项目需求、具有良好交互性的Tree控件。
Flex Tree组件是Adobe Flex框架中的一个关键元素,用于在用户界面上展示层次结构的数据。它在各种应用程序中广泛使用,特别是在需要...通过学习和实践提供的源代码,能够进一步提升对Flex Tree控件的理解和应用能力。
Tree控件在Flex中用于展示层次结构的数据,它允许用户展开和折叠节点,查看和导航数据结构。在很多情况下,用户可能需要选择一个或多个节点,这就是添加CheckBox的用处。通过为每个节点添加CheckBox,用户可以通过...
TreeItemRenderer是用于渲染Tree组件中每个节点的类,我们可以在此类中添加一个CheckBox控件,并根据节点的状态来控制它的选中状态。以下是一个基本的自定义TreeItemRenderer的代码片段: ```actionscript public ...
1. **Flex Tree组件**:Flex Tree是MXML和ActionScript中的一个控件,用于显示分层的数据结构。它由一系列可展开或折叠的节点组成,每个节点可以包含子节点。用户可以通过单击节点来展开或折叠它们,查看其子节点。 ...
Flex Tree是Adobe Flex框架中的一个组件,用于展示层次结构数据,如文件系统、组织结构或任何其他具有层级关系的数据。本教程将深入讲解Flex Tree组件的使用方法和关键概念,帮助开发者更好地理解和应用这一功能强大...
在IT行业中,Flex Tree是一种常用于数据展示和交互的组件,尤其在构建用户界面时,它能够以树形结构清晰地展示层次数据。配合Checkbox(复选框)功能,可以提供用户选择或过滤数据的便利操作。"Flex Tree + Checkbox...
确保在不同分辨率和屏幕尺寸下,Tree和复选框的布局都能正确显示。这可能涉及到对组件大小、位置和间距的调整。 5. **优化性能**: 由于复选框可能会导致大量的数据更新,因此需要考虑性能优化。例如,通过懒加载...
通过阅读和分析这些代码,你可以更深入地理解如何在Flex Tree中实现快速定位功能。 总结起来,"Flex Tree快速定位树结点"是一个提高用户交互体验的功能,它通过监听用户输入并搜索匹配的树节点,然后自动展开或选择...
通过以上步骤,我们成功地实现了Flex Tree控件与iFrame组件的联动,使得用户在Tree中选择不同节点时,iFrame会加载相应的网页。在实际应用中,可能还需要考虑其他因素,例如错误处理、网页加载进度指示等,以提高...
在Flex中,Tree组件是用于显示层次结构数据的控件,而"flex带复选框的tree"(Flex CheckboxTree)则是对Tree组件的一种扩展,增加了复选框功能,用户可以对树形结构的节点进行选择或全选操作,常用于权限管理、配置...
Tree控件在Flex中扮演着重要角色,它允许用户以图形化的方式浏览和操作层级结构的数据。 首先,我们要理解Flex Tree控件的基础。Tree控件是Flex提供的一个组件,用于显示多级节点的数据结构,每个节点可以有子节点...
在IT行业中,"flex tree icon"通常指的是使用Flex技术构建的一种树形结构控件,它在用户界面上显示带有图标的层次数据。Flex是一种用于创建富互联网应用程序(RIA)的框架,基于ActionScript编程语言和Flash Player...
在本案例中,可能是通过AMF(Action Message Format)或其他通信协议来实现Flex和ASP.NET之间的数据交换。 "UploadFile"是压缩包中的一个文件名,很可能这是主要的上传文件组件或者包含所有相关源代码的文件夹。在...
综上所述,"flex中tree和checkbox结合使用的插件"提供了在Flex环境中集成多选功能的解决方案,使得开发者能够快速构建具有复选功能的树形界面,提高应用的交互性和易用性。通过学习和使用这个插件,开发者可以提升其...
在Flex编程环境中,Tree组件是一种常用的用户界面元素,它用于展示层次结构的数据。当我们需要自定义Tree中的节点图标时,可能会遇到如何根据数据源动态改变图标的问题。标题"flex tree 修改icon方法"正好指出了这一...
综上所述,实现 Flex Tree 的拖拽功能需要理解 Flex 的 DragManager 机制,掌握 Tree 控件的拖放属性和事件,以及如何处理数据模型的变化。通过精心设计和优化,可以创建出交互性强、易用性好的树形数据操作界面。在...
Flex Tree组件是Adobe Flex框架中的一个关键元素,用于展示层次结构数据。在默认情况下,Tree组件的节点之间通常使用虚线进行连接,以表示它们之间的层级关系。然而,有时候我们可能需要自定义这些连接线,比如将...
在Flex Tree中,连接线通常用来表示节点间的父子关系,而"Flex Tree增加虚线连接"则涉及到如何为这些连接线添加虚线样式,以满足特定的视觉效果和设计需求。 在Flex Tree中实现虚线连接,我们需要理解以下几个关键...
Flex是一种基于ActionScript和MXML的开源框架,用于构建富互联网应用程序(RIA)。在这个场景中,我们关注的是Flex实现的拖拽控件,这是一种交互式UI元素,允许用户通过鼠标操作移动元素,提供了丰富的用户体验。 ...