Flex Scrolling Bug in Tree control
<mx:Tree id="tree" labelField="@label" minHeight="400">
<mx:XMLListCollection id="xmlList">
<fx:XMLList id="root" xmlns=www.ns.com>
<node label="aaaa">
<node label="aaaDesc"/>
</node>
... more nodes
</fx:XMLList>
</mx:XMLListCollection>
</mx:Tree>
thats pretty much the basic code that i have
when scroller is added this functionality doesnt work.
TypeError: Error #1010: A term is undefined and has no properties.
at mx.controls::List/adjustVerticalScrollPositionDownward()[E:\dev\4.5.1\frameworks\projects \mx\src\mx\controls\List.as:1043]
at mx.controls::List/configureScrollBars()[E:\dev\4.5.1\frameworks\projects\mx\src\mx\contro ls\List.as:988]
at mx.controls::List/scrollHandler()[E:\dev\4.5.1\frameworks\projects\mx\src\mx\controls\Lis t.as:1629]
at mx.controls::Tree/scrollHandler()[E:\dev\4.5.1\frameworks\projects\mx\src\mx\controls\Tre e.as:2898]
at flash.events::EventDispatcher/dispatchEventFunction()
at flash.events::EventDispatcher/dispatchEvent()
at mx.core::UIComponent/dispatchEvent()[E:\dev\4.5.1\frameworks\projects\framework\src\mx\co re\UIComponent.as:13128]
at mx.controls.scrollClasses::ScrollBar/http://www.adobe.com/2006/flex/mx/internal::dispatchScrollEvent()[E:\dev\4.5.1\frameworks\projects\mx\src\mx\controls\scrollClasses\ScrollBar.as:1472]
at mx.controls.scrollClasses::ScrollThumb/mouseMoveHandler()[E:\dev\4.5.1\frameworks\project s\mx\src\mx\controls\scrollClasses\ScrollThumb.as:216]
The problem went away. I think it was a bug getting triggered
by setting the selected items after I had updated the dataProvider
and refreshing the tree.
I was having another issue where the selectedItems were lost
after updating the tree. I fixed it by setting selectedItems using
callLater() because setting it immediately after updating the tree
dataProvider was not working as the selection was lost anyways.
using callLater to do this fixed the selection issue and now
apparently also the issue with a section of the tree being
obscured.
Similar Messages
-
Tree control bug for vertical scrollbar
Dear all:
I meet a problem with tree control vertical scrollbar.Pls check the picture
If set the rows of the properties of the Tree control is a number, also set the vertical scroll bar is visible.
Then if i set the height of Tree is unchangeable, then set the Tree childs rows are much more than the height, The problem is that the vertical scroll bar doesn't work. The height is increase than what i have set ,Maybe it is a bug? or not.
Anybody find this?
Attachments:
Image000011.jpg 66 KBHello,
I works fine with me.
But I added my test as attachment, so you can see if you maybe doing something else.
Kind regards,
André
Regards,
André
Using whatever version of LV the customer requires. (LV5.1-LV2012) (www.carya.nl)
Attachments:
Tree control bug question.vi 20 KB -
Flex tree control expanditem dynamically..?
Hi All.,
I have using tree control using to display. when i pass the data with folder id dynamically to expanding particular child node of tree.
How to extarct tree with dynamic...?
Below sample coding.....
<mx:tree id="folderTree" />
folderid=2618;
callLater(expandTree, [folderid]);
private function expandTree(folderid: Object) : void
folderTree.expandChildrenOf(folderTree.getChildAt(0), true);
folderTree.selectedItem = folderid;
but not extracting tree.
anyone help this problem
With Regards.,
LingsThanks buddy for the answer.
Unfortunately the answer came after quite long time of posting the message. Anyway I was able to open a tree on demand using HttpService and due to my new requirement I changed it to RemoteObject.
I my latest change I am able to populate tree nodes on demand and also the same solution if getting update from server via JMS using Consumer object.
I kind a like this solution because it took me good amount of effort to find the right solution.
If any one is intersted the he/she can reply to the post and I can provide code here or may at some location so that it can be easily downloaded.
The solution is Flex-Grails combination.
Thanks everybody. -
Hi friends.........
Iam using flex tree control data coming from coldfusion file to display grid. As i click the tree folder to change the data from dynamic from grid.
How to pass the folder id from coldfusion file.. Is it possible ?.. Means give any example please....
Any One Help Me......
With Regards.,
Lingu.......When you set the dataProvider for your tree control, you actually pass an array or arraycollection or whatever to that property. The array contains objects coming from your server, right? Each object should contain a property with the folder id, something like:
var arr:Array = [{id: 1, folderID: 34, name: "..."}, {id: 2, folderID: 4, name: "..."}, ...];
Now, when you click an item in your tree or your dataGrid, you can access the folder id by:
myTree.selectedItem.folderID
Hope this helps
Dany -
Populate flex tree control on demand using HTTPService (Flex 3)
First, I am sorry if the same post is already posted here but after spending 30 minutes or may be more I could not find the solution.
By the way I have two problems. 1.) I am new to flex which I know if my own problem and soon I will handle it.
2.) This is major problem for me. I have to populate Tree control from database and I used HTTPService to get the data from database.
I created a object of HTTPService and on load of Tree control I am calling a function which calls the HTTP URL and returns me the first level of node for my Tree.
When I click on any node a function is called again using HTTPService and result is appended to the currently selected node. The same goes until n level and it works fine. I was happy with my results. I am stuck in new problem. The problem is if the tree is already populated on my browser and I make some add/update/delete any node or child node, the flex doesn't make a call to HTTP URL and I am not getting updated data.
The mxml code is below (this code has some extra things too).
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical" backgroundGradientAlphas="[1.0, 1.0]"
backgroundGradientColors="[#000000, #868686]" >
<mx:Script>
<![CDATA[
import mx.utils.StringUtil;
import mx.rpc.http.HTTPService;
import mx.events.ListEvent;
import mx.binding.utils.BindingUtils;
import mx.controls.Alert;
import mx.rpc.events.FaultEvent;
import mx.collections.XMLListCollection;
import mx.utils.ObjectProxy;
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
import mx.utils.ArrayUtil;
[Bindable]
public var datalist:XMLListCollection = new XMLListCollection();
[Bindable]
public var xmlFromDatabase:HTTPService=new HTTPService();
[Bindable]
private var xmlForChildren:HTTPService;
private function resultHandler( event:ResultEvent ):void
var x:XML = event.result as XML;
var xl:XMLList = XMLList( x );
private function faultHandler( event:FaultEvent ):void
Alert.show(event.message.toString());
private function display():void
var params:Object = {};
params["parent"] = "0";
xmlFromDatabase.url = "http://localhost:8080/GrailsFlex/department/tree";
xmlFromDatabase.method = "GET";
xmlFromDatabase.resultFormat = "e4x";
xmlFromDatabase.useProxy = false;
xmlFromDatabase.send(params);
xmlFromDatabase.addEventListener(ResultEvent.RESULT,displyTree,false,0,false);
private function displyTree(event:ResultEvent):void
XMLtree1.dataProvider = event.result;
XMLtree1.labelField = "@name";
private function getChilds(event:ListEvent):void
try
var xmlTree:Tree = event.currentTarget as Tree;
var node:XML = xmlTree.selectedItem as XML
var params:Object = {};
params["parent"] = node.@id;
xmlForChildren = new HTTPService();
xmlForChildren.url = "http://localhost:8080/GrailsFlex/department/tree";
xmlForChildren.method = "GET";
xmlForChildren.resultFormat = "e4x";
xmlForChildren.useProxy = false;
xmlForChildren.send(params);
xmlForChildren.addEventListener(ResultEvent.RESULT,appendChild,false,0,false);
xmlForChildren.addEventListener(ListEvent.ITEM_CLICK,getChilds,false,0,false);
catch (E:Error)
Alert.show("getChilds Error:-- " + E.message);
private function deleteTreeNode(xmlItem:XML):void
var xmlParent:XML = XML(xmlItem).parent();
if (xmlParent.@parent == null || StringUtil.trim(xmlParent.@parent) == "")
xmlParent.@parent = "0";
if (xmlParent.@parent != "0")
//Recursive call until I get reach to children of root node
deleteTreeNode(xmlParent);
else
// Now I am at root.
var xmlRoot:XML = XML(xmlParent).parent();
var bActualRoot:Boolean = false;
if (xmlRoot == null)
xmlRoot = xmlParent;
bActualRoot = true;
if (bActualRoot)
if (xmlRoot.@parent == "0")
try
for each (var xl:XML in xmlParent.children())
if (xl.@name != xmlItem.@name)
for (var cn:int=xl.children().length()-1; cn >=0; cn--)
delete xl.children()[cn];
catch (ex:Error)
Alert.show("error Real Root: " + ex.toString());
else
for each (var nodexm:XML in xmlRoot.children() )
if (nodexm.@name != xmlParent.@name )
try
for (var cu:int=nodexm.children().length()-1; cu >=0; cu--)
delete nodexm.children()[cu];
catch (ex:Error)
Alert.show("error No Real Root: " + ex.toString());
private function appendChild(event:ResultEvent):void
var node:XML = event.result as XML
var sItem: XML = XMLtree1.selectedItem as XML;
if (sItem.children().length() > 0)
delete sItem.children();
for(var i:int=0; i < node.children().length(); i++)
var item:XML = node.children()[i];
XMLtree1.selectedItem.appendChild(item);
XMLtree1.expandItem(XMLtree1.selectedItem,true,true);
deleteTreeNode(XML(XMLtree1.selectedItem));
]]>
</mx:Script>
<mx:Tree id="XMLtree1" width="350" height="470"
showRoot="false" creationComplete="display()" itemClick="getChilds(event)" />
</mx:Application>
Thanks in advanceThanks buddy for the answer.
Unfortunately the answer came after quite long time of posting the message. Anyway I was able to open a tree on demand using HttpService and due to my new requirement I changed it to RemoteObject.
I my latest change I am able to populate tree nodes on demand and also the same solution if getting update from server via JMS using Consumer object.
I kind a like this solution because it took me good amount of effort to find the right solution.
If any one is intersted the he/she can reply to the post and I can provide code here or may at some location so that it can be easily downloaded.
The solution is Flex-Grails combination.
Thanks everybody. -
Populate Flex tree control from mysql
Hi
I am just learning Flex and I started playing with the Tree
control. I am trying to populate the Tree from Mysql using php and
I am just hitting wall after wall.
Please Help
Thanks in advancequote:
Originally posted by:
ntsiii
Stop running and get a map (read the documents)
This is hardly a useful comment and must discourage new users
from asking questions. If you think the documentation relating to
the use of the tree control is straightforward then I beg to
differ.
If you are aware of a clear example of how to use the data
tree with a php backend returning a remote data object please
enlighten me. Meanwhile I continue my search but not within the
livedocs.
One site I have found that may be of use is
http://flexdiary.blogspot.com/2009/01/lazy-loading-tree-example-file-posted.html
Not everyone is an expert. -
Flex Using Tree Control in item renderer(Url Navigate)?
HI All.,
Iam Using flex 3 using tree control in item renderer to click haschildren label to be navigate url is possible ?.
Any one help me.....
Thanks in Advance......You can do this by writing the item's tag to the ActiveItemTag property, the column number you're intersted in to the ActiveColNum property and reading the Cell String Property.
Mike....
PS: If anybody at NI is listening, that interface really, really, REALLY needs to get rewritten...
Certified Professional Instructor
Certified LabVIEW Architect
LabVIEW Champion
"... after all, He's not a tame lion..."
Be thinking ahead and mark your dance card for NI Week 2015 now: TS 6139 - Object Oriented First Steps
Attachments:
tree_properties.vi 9 KB -
Flex 4 skin how to set tree control corner radius..?
hi .,
i have using flex4 mx tree control to reduce the corner radius.
application using tree control code...
<mx:Tree contentBackgroundColor="#FFFFFF" id="folderTree" labelField="documentFolderName" dataProvider="{folderTreeArray}" itemClick="clcikchanged(event)" height="650" borderColor="#FFFFFF"> </mx:Tree>
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/halo";
@namespace mx1 "library://ns.adobe.com/flex/mx";
mx|Tree
border-skin: ClassReference('com.istmanagement.skins.Application.boaderskin');
</fx:Style>
borderskin.mxml coding here...
<?xml version="1.0" encoding="utf-8"?>
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:fb="http://ns.adobe.com/flashbuilder/2009" alpha.disabled="0.5">
<fx:Metadata>
[HostComponent("spark.components.BorderContainer")]
</fx:Metadata>
<s:states>
<s:State name="normal" />
<s:State name="disabled" />
</s:states>
<s:Rect id="background" left="0" right="0" top="0" bottom="0" >
<s:fill>
<s:SolidColor id="bgFill" color="#FFFFFF"/>
</s:fill>
</s:Rect>
<s:BorderContainer cornerRadius="8" width="255" height="650">
</s:BorderContainer>
<s:Group id="contentGroup" left="0" right="0" top="0" bottom="0" minWidth="0" minHeight="0">
<s:layout>
<s:BasicLayout/>
</s:layout>
</s:Group>
</s:Skin>
tree control corner radius is reduced to display., after i have using <mx:HDividedBox > to drag this to override a tree control...
how to solve this problem.,
With Regards.,
LinFlex-Did you every solve this issue?
-
Could i show the dashed-line of Tree Control in Flex 1.5
For example, there is dashed-lines between folder and folder
in the Windows Explorer.I wonder whether i can set a property to
let the tree control show its dashed-line.
Thanks in advance.hi all
Please have a look and tell me why I am getting this error.
Thanx
kvijai -
Items in Tree control move around when data is submitted using custom ItemRenderer
I'm working on a Tree control with an XMLListCollection as
its dataProvider.
The dataProvider has information looking like this :
quote:
<?xml version='1.0' encoding='utf-8'?>
<INFO>
<FIELD label="STR_USER_NAME"
type="text"
value=""
>
</FIELD>
<FIELD label="STR_USER_EMAIL"
type="text"
value=""
>
</FIELD>
<FIELD label="STR_OPTIONAL"
type="branch"
value="0"
>
<FIELD label="STR_USER_ADDRESS"
type="text"
value=""
>
</FIELD>
<FIELD label="STR_USER_POSTAL_CODE"
type="text"
value=""
>
</FIELD>
</FIELD>
</INFO>
So in the Tree control I'd like the information to show up
with a label and
an
editable textbox for each item :
[Label] [textbox]
To do this I made a tree like this :
quote:
<mx:Tree id="userTree"
editable="true"
rendererIsEditor="true"
editorDataField="curVal"
itemRenderer="{new ClassFactory(ItemRendererUser)}"
itemEditEnd="e_ProcessData(event);"
dataDescriptor="{new DataDescriptorUsers()}"
showRoot="false"
verticalScrollPolicy="{ScrollPolicy.AUTO}"
/>
where the e_ProcessData() function looks like this (I used
http://livedocs.adobe.com/flex/201/html/wwhelp/wwhimpl/js/html/wwhelp.htm?href=c
elleditor_073_16.html#202105 as a guide) :
quote:
public function e_ProcessData(event:ListEvent):void
event.preventDefault();
userTree.editedItemRenderer.data.@value =
ItemRendererUsers(event.currentTarget.itemEditorInstance).curVal;
userTree.destroyItemEditor();
userTree.dataProvider.notifyItemUpdate(userTree.editedItemRenderer);
} // END OF e_ProcessData()
I attached the rest of the files because they're a little
bit longer.
When I run the program, the data shows up fine when it is
initialized the
very
first time, and I made a test button that just dumps the
contents of the
dataProvider in a trace statement to verify that the data has
been set
properly.
The problem I've run into is whenever the textfield is
edited, the item
that
I've selected jumps around the list.
For example, if I edit the item "STR_USER_NAME" after I
finish the edit, it
will move from the very first position in the Tree to the
bottom of the
Tree.
I traced the contents of the dataProvider and the
dataProvider structure
stays
the same, with the "STR_USER_NAME" at the top, but if I look
at the flex app
in
the web browser, its position is at the bottom of the Tree.
This happens for every other item I try to edit... I read in
the
documentation
that the ItemRenderers are recycled, so it means I should be
checking to
make
sure the initial states are covered, but I'm not sure how
this affects my
application.
Can anyone help me out with this ? Its very confusing - I've
tried making
an
ItemRenderer using pure actionscript, mxml and the
combination you see in
this
example and I always end up with the same behaviour - So I
must be missing
something critical...
// ItemRendererUsers.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="
http://www.adobe.com/2006/mxml"
verticalScrollPolicy="{ScrollPolicy.OFF}"
horizontalScrollPolicy="{ScrollPolicy.OFF}"
creationComplete="initItemRendererUsers();"
>
From my FAQ:
Q: I've created a custom itemRenderer component to use in a
List
based component (Datagrid, TileList, HorizontalList, etc.).
When my List
first displays, everything looks fine, but when I scroll it
or change the
dataProvider, some of the itemRenderers show values or
formatting that
aren't right. How do I fix this?
A: List-based components don't draw a renderer for every item
in the
dataProvider. Instead, they create enough to display what is
on screen now,
plus one or two more waiting in the wings. This means they
recycle the
renderers rather than creating new ones when you change
dataProvider or
scroll up and down. When you use a creationComplete event to
set up the
itemRenderer, that event doesn't happen again when the
renderer is used for
a different set of data. The solution to this is to override
the set data
protected function that most components have.
For more information, check out the following resources:
http://www.adobe.com/devnet/flex/articles/itemrenderers_pt1.html?devcon=f1
http://blogs.adobe.com/aharui/2007/03/thinking_about_item_renderers_1.html
Please note, I post this FAQ weekly, and you can find a
permanent copy of it
here
http://www.magnoliamultimedia.com/flex_examples/Amys_Flex_FAQ.pdf"peterh8234" <[email protected]> wrote in
message
news:gaqttd$kft$[email protected]..
> Yes - the set and get functions are listed down below.
But the quirky
> behaviour
> is the same regardless of whether I override the set and
get functions or
> not.
>
> I noticed there was another variable called listData -
should I be using
> that
> one or the data variable to read and write to the
dataProvider ?
>
> // _data
> [Bindable] public var _data:Object;
> [Bindable("dataChange")]
> //
> override public function get data():Object
> {
> trace('[ItemRendererDefault.GET data()] called for {' +
> _data.attribute("label") + '}.');
> return _data;
> } // END OF get data()
>
> //
> override public function set data(value:Object):void
> {
> _data.@value = inputText.text;
> trace('[ItemRendererDefault.SET data()] called for {' +
> _data.attribute("label") + '}.');
>
> invalidateProperties();
> } // END OF set data()
Your set data needs to set a flag that gets picked up in
commitProperties()
and does your thing that you were doing before in
creationComplete. You
should see examples of this in the links I posted. Instead of
this:
_data.@value = inputText.text;
you should look at implementing IDropInListItemRenderer,
which will allow
you to dynamically determine which field to look at, instead
of hardcoding
it. You also might wind up overwriting the stored value with
a null value
when the List passes the stored value in. I'd encourage you
to really go
through those links I posted and make sure you understand
what they're
saying. The itemRenderer life cycle is one of the hardest
things to
understand, but once you understand it, it makes many things
in Flex much
easier. It's worth investing the time. -
Problem getting vertical scroll bar in tree
Hi,
I am adding nodes to a tree control dynamically. But somehow,
a vertical scroll bar doesn't appear during the process. I guess,
somehow, the tree is not able to detect the change in the height,
hence, is not giving the vertical scroll bar. However, after a node
has been populated with the sub-nodes, when I close that node and
re-open it, then the scroll bar appears. I really need to fix it as
soon as possible. Plz help!
Thanks in advance,
ChereeSeems like Flex 4 is working fine:
This is the updated code working on Flex 4.6 using XMLCollection:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" applicationComplete="application1_applicationCompleteHandler(event)">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.collections.XMLListCollection;
import mx.controls.Tree;
import mx.events.FlexEvent;
import mx.events.TreeEvent;
[Bindable]
public var treeData: XMLListCollection=new XMLListCollection();
private var hasRun: Boolean = false;
//finalSrcList is the ArrayCollection that has value objects returned from data base by a remote object.
public function populateTree(event:TreeEvent): void{
if (hasRun == false){
hasRun = true;
var parentNode:XML=event.item as XML;
var temp:XML;
var i: int;
var finalSrcList: ArrayCollection = new ArrayCollection();
// Prepare source list
for (i=0; i<10; i++){
var item = new Object();
item.attribute1 = "attribute " + i.toString();
item.attribute2 = i.toString();
finalSrcList.addItem(item);
for(i=0;i<finalSrcList.length;i++){
temp= <node label={finalSrcList[i].attribute1} id={finalSrcList[i].attribute2} isBranch="true"/>;
event.currentTarget.dataDescriptor.addChildAt(parentNode,temp,0);
protected function application1_applicationCompleteHandler(event:FlexEvent):void
var rootItem: XML;
rootItem = <root label="root" id="1000">
<node label="level1" id="2000" isBranch="true"/>
</root>;
treeData.addItem(rootItem);
]]>
</fx:Script>
<mx:Panel width="600" height="250" paddingBottom="20" paddingLeft="20" paddingRight="20" paddingTop="20"
verticalAlign="middle" horizontalAlign="center">
<s:Label>
This is using XMLCollection
</s:Label>
<mx:Tree id="funcTree" height="100%" width="100%" dataProvider="{treeData}" labelField="@label" showRoot="false"
itemOpen="populateTree(event)" />
</mx:Panel>
</s:Application> -
Tree control - How to get the full path of selected Item in tree control
I am Flex newbie. When the user clicks the particular item in
the tree control I just wanted to get it name along with it's full
parent.
Here is my XML
var dirXML:XML=<root basename="/home/tcegrid">
<Directories>
<Dir Name=".autosave" />
<Dir Name=".emacs.d" />
<Dir Name="AnsysDistributed">
<Dir Name="opt"/>
<Dir Name="root" />
</Dir>
<Dir Name="postgres"/>
<Dir Name="FineTurbo"/>
<Directories>
</root>
The above XML is data provider for Tree control. When the
user clicks the Dir Name called opt. I wanted it absolute path in
XML. say Directories.Dir.Dir.@Name is opt
Can any one tell me how to get this?"Thamizhannal" <[email protected]> wrote in
message
news:gam9q8$4es$[email protected]..
>I am Flex newbie. When the user clicks the particular
item in the tree
>control
> I just wanted to get it name along with it's full
parent.
> Here is my XML
> var dirXML:XML=<root basename="/home/tcegrid">
> <Directories>
> <Dir Name=".autosave" />
> <Dir Name=".emacs.d" />
> <Dir Name="AnsysDistributed">
> <Dir Name="opt"/>
> <Dir Name="root" />
> </Dir>
> <Dir Name="postgres"/>
> <Dir Name="FineTurbo"/>
> <Directories>
> </root>
>
> The above XML is data provider for Tree control. When
the user clicks the
> Dir
> Name called opt. I wanted it absolute path in XML. say
> Directories.Dir.Dir.@Name is opt
> Can any one tell me how to get this?
loop until the parent() property of the XML node is empty.
HTH;
Amy -
How to search a tree control.
Hi all,
I just started learning Flash Builder not too long ago, quite a learning experience I have to say. I am a little lost and woul like some help from you guys.
I am trying to build a menu tree that will display and image and information about that image when the corresponding node is selected.
I also want to have the menu tree searchable, I looked at a few examples of tree controls to get some ideas but I keep hitting brickwalls left and right.
I started over few times trying to follow some of the examples. Right now, I only have the visual elements, please see the code below.
Thank you so much in advance.
Here's the code I have so far:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="960" minHeight="560" backgroundColor="#FFFFFF" width="960" height="560">
<fx:Declarations>
</fx:Declarations>
<mx:HDividedBox y="80" height="415" x="25">
<s:Panel x="20" y="95" width="240" height="415">
<s:TextInput x="10" y="-25" height="20" contentBackgroundAlpha="1.0" borderAlpha="1.0" textAlign="left" fontWeight="normal" text="Search" focusColor="#70B2EE" fontSize="10" color="#646464"/>
<mx:Tree id="tree"
x="10" y="5" width="220" height="370" borderVisible="false" color="#787878">
</mx:Tree>
<s:Button x="160" y="-25" label="Find" fontWeight="bold" fontSize="10"/>
</s:Panel>
<s:Panel x="275" y="95" width="660" height="415">
<mx:SWFLoader id="swfLoader"
scaleContent="true"
x="0" y="0" width="660" height="190"/>
<mx:Text width="639" id="treeSelectedData"
height="169" x="9" y="203"/>
</s:Panel>
</mx:HDividedBox>
</mx:Application>You should take a look at the help documentation about the tree component. They have an example code at the bottom that shows how to load in data to the tree and how to perform actions when a node in the tree is selected. Below is a link to the help documentation on the tree component.
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/controls/Tree.html?f ilter_flex=4.5.1&filter_flashplayer=10.3&filter_air=2.6 -
Horizontal Scroll in ALV Trees
Is it possible to have horizontal scrolling in ALV Trees ,
If possible suggest please.With the current version of VC there is no horizontal scroll bar in the Flex tables possible.
-
Issue : drag and drop from list control to tree control
Hi,
I was trying a drag and drop from list control to tree control. I have used some sample data to populate list and tree controls .
It is working fine . except one problem ..
Prob : when i drag an item to tree control .. it gets added .. now tree contains (X+1) data in list .. say X is the inital number of nodes in a tree node.
now if i drag another item from list to last item in the tree node .. i.e at X+1 index. .. it throws null pointer exception.
I am considerably new in flex programming . looking for help from experts ..
Below is my code :
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="horizontal"
creationComplete="init()">
<mx:Script>
<![CDATA[
import mx.controls.listClasses.IListItemRenderer;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
import mx.utils.ObjectUtil;
import mx.collections.ICollectionView;
import mx.core.UIComponent;
import mx.managers.DragManager;
import mx.events.DragEvent;
import mx.controls.Alert;
import mx.controls.Label;
import mx.events.CloseEvent;
private var homePath:String="/home/e311394/dndTest/";
private var destPath:String="/home/e311394/dndDest/";
private var eid:String="e311394";
private var actn:String;
[Bindable]
private var cm:ContextMenu;
private var cmi:ContextMenuItem;
[Bindable]
private var dp:ArrayCollection;
private function init():void
cmi=new ContextMenuItem("Remove");
cmi.enabled=true;
cmi.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, contextMenuItem_menuItemSelect);
cm=new ContextMenu();
cm.hideBuiltInItems();
cm.customItems=[cmi];
cm.addEventListener(ContextMenuEvent.MENU_SELECT, contextMenuItem_menuSelect);
list.contextMenu=cm;
private function contextMenuItem_menuSelect(evt:ContextMenuEvent):void
list.selectedIndex=lastRollOverIndex;
private function contextMenuItem_menuItemSelect(evt:ContextMenuEvent):void
var loclSelectedRow:Object=list.selectedItem;
var lostrSelectedMenuItem:String;
lostrSelectedMenuItem=evt.target.caption;
if (loclSelectedRow != null)
var obj:Object=new Object()
obj.label=loclSelectedRow.label as String;
//Alert.show(obj.label);
if (lostrSelectedMenuItem == "Remove")
if(loclSelectedRow!=null)
var pth:String=homePath.concat(loclSelectedRow.label);
//Alert.show(pth);
//FlexDnDRemoteService.process(eid,"delete",pth,"-");
var coll:ArrayCollection=list.dataProvider as ArrayCollection;
if (coll.contains(loclSelectedRow))
coll.removeItemAt(coll.getItemIndex(loclSelectedRow));
public function onTreeDragEnter(event:DragEvent):void
event.preventDefault();
DragManager.acceptDragDrop(event.target as UIComponent);
tree.showDropFeedback(event);
protected function onTreeDragOver(event:DragEvent):void
event.preventDefault();
event.currentTarget.hideDropFeedback(event);
try
var index:int=tree.calculateDropIndex(event);
catch (e:Error)
DragManager.showFeedback(DragManager.NONE);
return;
tree.selectedIndex=index;
var draggedOverItem:Object=tree.selectedItem;
public function onTreeDragExit(event:DragEvent):void
event.preventDefault();
tree.hideDropFeedback(event);
private function showAlert():void
Alert.yesLabel="Move";
Alert.noLabel="Copy";
Alert.buttonWidth=70;
Alert.show("Copy / Move ?", "Confirm", Alert.YES | Alert.NO | Alert.CANCEL, this, alertListener, null, Alert.OK);
private function alertListener(eventObj:CloseEvent):void
var result:Boolean=false;
if (eventObj.detail == Alert.CANCEL)
//Alert.show("CANCEL");
return;
if (eventObj.detail == Alert.YES)
//Alert.show("YES");
result=true;
else if (eventObj.detail == Alert.NO)
//Alert.show("NO");
result=false;
var index:int=tree.calculateDropIndex(treedropevt);
//Alert.show("Drop Pos" + index.toString());
/* var treeList:ArrayCollection=tree.dataProvider as ArrayCollection;
Alert.show(" index"+index+"Length "+treeList.length);
if(index > treeList.length)
Alert.show("Returning");
return;
var items:Array=new Array();
if (treedropevt.dragSource.hasFormat("items"))
items=items.concat(treedropevt.dragSource.dataForFormat("items") as Array);
var parentItem:Object;
parentItem=getObjectTarget();
/* if (tree.dataDescriptor.isBranch(tree.indexToItemRenderer(index).data))
parentItem=tree.indexToItemRenderer(index).data;
else
var dropParentPackage:Object = tree.mx_internal::_dropData.parent as Object;
Alert.show("HAck"+dropParentPackage.toString());
parentItem=tree.getParentItem(tree.indexToItemRenderer(index).data);
//Alert.show("Lenght "+ObjectUtil.getClassInfo(parentItem).properties.length);
//Alert.show("Lenght "+ObjectUtil.getClassInfo(parentItem).properties.length);
var position:int=0;
/* if(ObjectUtil.getClassInfo(parentItem).properties.length==0)
Alert.show("Returning");
return;
if (parentItem != null)
try
while (tree.indexToItemRenderer(index).data != parentItem)
//Alert.show(tree.indexToItemRenderer(index).data.toString());
if (index > 0)
index--;
//Alert.show("Insiade");
position++;
catch (e:Error)
Alert.show("Catch" + index.toString());
return;
for each (var item:Object in items)
var obj:Object=new Object()
obj.label=item.label as String;
if (parentItem != null)
//Alert.show("ADDED");
tree.dataDescriptor.addChildAt(parentItem, obj, position++);
else
//Alert.show("PARENT NULL");
tree.dataDescriptor.addChildAt(tree.selectedItem, obj, position++);
var spth:String=homePath.concat(item.label);
//Alert.show(spth);
var dpth:String=destPath.concat(item.label);
//Alert.show(dpth);
if (result == true)
removeItems();
//FlexDnDRemoteService.process(eid,"move",spth,dpth);
else
//FlexDnDRemoteService.process(eid,"copy",spth,dpth);
tree.validateNow();
public function getObjectTarget():Object
var dropData:Object=tree.mx_internal::_dropData as Object;
if (dropData.parent != null)
return dropData.parent;
else
// if there is not parent (root of the tree), I take the root directly
var renderer:IListItemRenderer=tree.indexToItemRenderer(0);
return renderer.data;
public function removeItems():void
//remove moved elements
var items:Array=treedropevt.dragSource.dataForFormat("items") as Array;
var coll:ArrayCollection=list.dataProvider as ArrayCollection;
for each (var item:Object in items)
if (coll.contains(item))
coll.removeItemAt(coll.getItemIndex(item));
private var treedropevt:DragEvent;
public function onTreeDragDrop(event:DragEvent):void
treedropevt=event;
showAlert();
event.preventDefault();
tree.hideDropFeedback(event);
public function resultHandler(event:ResultEvent):void
Alert.show("Success", "Status");
public function faultHandler(event:FaultEvent):void
Alert.show(event.fault.faultString, "Failure");
]]>
</mx:Script>
<mx:ArrayCollection id="listDP">
<mx:Object label="File1.dnd"/>
<mx:Object label="File2.dnd"/>
<mx:Object label="File3.dnd"/>
<mx:Object label="File4.dnd"/>
<mx:Object label="File5.dnd"/>
</mx:ArrayCollection>
<mx:Number id="lastRollOverIndex"/>
<!--
<mx:ArrayCollection id="treeDP">
<mx:Object label="/home">
<mx:children>
<mx:Object label="dummy1.ks"/>
<mx:Object label="dummy2.ks"/>
<mx:Object label="e493126">
<mx:children>
<mx:ArrayCollection>
<mx:Object label="/home/e493126/sample1.ks"/>
</mx:ArrayCollection>
</mx:children>
</mx:Object>
</mx:children>
</mx:Object>
</mx:ArrayCollection>
-->
<mx:ArrayCollection id="treeDP">
<mx:Object label="/dndDest">
<mx:children>
<mx:ArrayCollection>
<mx:Object label="sample1.ks"/>
<mx:Object label="sample2.ks"/>
<mx:Object label="sample3.ks"/>
<mx:Object label="sample4.ks"/>
<mx:Object label="sample5.ks"/>
<mx:Object label="sample6.ks"/>
</mx:ArrayCollection>
</mx:children>
</mx:Object>
</mx:ArrayCollection>
<mx:List id="list"
itemRollOver="lastRollOverIndex = event.rowIndex"
width="50%"
dragEnabled="true"
dataProvider="{listDP}"
labelField="label"
allowMultipleSelection="true"
dragMoveEnabled="false">
</mx:List>
<mx:Tree id="tree"
width="50%"
dragEnabled="true"
dataProvider="{treeDP}"
dragEnter="onTreeDragEnter(event)"
dragOver="onTreeDragOver(event)"
dragExit="onTreeDragExit(event)"
dragDrop="onTreeDragDrop(event)"
labelField="label"
liveScrolling="true">
</mx:Tree>
<mx:RemoteObject id="FlexDnDRemoteService"
showBusyCursor="true"
destination="FlexDnD">
<mx:method name="process"
result="resultHandler(event)"
fault="faultHandler(event)"/>
</mx:RemoteObject>
</mx:Application>
Thanks,
RajivYa , i have searched and have used the same code.
But needed to customize few things like:
stop dnd in same tree
drop some item into a folder ..( onto it ) etc
have achieved the same .. but this issue ..
i think the tree dataprovider (contents internally is not being updated .. only the UI)
any suggestions ?
- Rajiv
Maybe you are looking for
-
Deployment Workbench - how to capture an image after customisation?
I have deployed Vista to a machine using WinPE (Created through Workbench) and chose the option when deploying "Prepare for capture" I then customised Vista - in this case removing the Fax applications and ran Sysprep with OOBE, Generalise and Shutdo
-
Hard drive crash, music on external drive but no library or playlist backup
I'm guessing this question has been asked many times but I've searched all over the internet and these forums and am exhausted. So I beg for your help. My computer hard drive crashed. Not sure if I can get the files off it yet or not but will find ou
-
Can I programmatically change my USB Dev assignment?
I have a production test program that uses two USB 6501 DAQs. Currently during development they're assigned Dev1 and Dev2 in MAX and my DAQmx drivers are set up for those addresses. This test fixture, when deployed, will be connected and disconnected
-
Hi Friends, I am validating value of a field and showing an error message in an user exit. When the error message appears all the screen fiedls are disabling for input. I want to enable the checked field for input. Please note the error message code
-
Debug/Packet Trace - flow options on the CSS11501 running 7.20 Build 3
Hello all, I need to do some packet tracing on the CSS11501 running 7.2 and need to limit debugged packets to a particular IP. I know that you can set the IP by running: "flow trace-ip X.X.X.X" But what HEX option would I need for the command : "flow