Opening branches by clicking rows in a Tree control in Flex

Hi Peter!!!

This is what I was looking for!!!

THANK YOU!!

eternalko

Reply

thanks,good example!

Reply

You amaze me with every post, thanks a lot.

Reply

very useful sample, I have used it in our project!
thanks!

Reply

nwebb,

Great tip, thanks!

Peter

Reply

Dont work, for dispatch this event you have to use the internal function dispatchTreeEvent!

1 – import mx.core.mx_internal;
2 – use namespace mx_internal;
3 – dispatchTreeEvent(TreeEvent.ITEM_OPENING,
item, //item
this, //renderer
evt, //trigger
!isItemOpen(item), //opening
true, //animate
true) //dispatch

mx_internal allow to access to ‘private’ members and is very usefull (another example is for the VideoDisplay to enable the smoothing)

Reply

Great work!

Could you please tell me how to handle the item_click stuff in reference to an ADVANCEDDATAGRID.

Many thanks in advance.

Gerry

Reply

I’d like to see an example of this with AdvancedDataGrid as well!

Reply

Just to confirm … with the AdvancedDataGrid not checking if the clicked item is a branch doesn’t seem to matter. The only thing that confused me is the AdvancedDataGridItemSelectEvent in FB3 that the compiler doesn’t like … you need to use a standard ListEvent … ho-hum! Also, while I’m at it … if you’re wondering how to assign different Item renderers for different branches look in the Flex help at the <mx:rendererProviders> tag … this was very handy!

Reply

About that close/open event dispatching, look at fourth parameter of expandItem method (dispatchEvent:Boolean = false). Set it to true and it will work just fine.

Reply

For ADG u need to use the ADGGroupItemRenderer:

public class MyAdvancedDataGridGroupItemRenderer extends AdvancedDataGridGroupItemRenderer {
    private var _listOwner:AdvancedDataGrid;
    private var _listData:AdvancedDataGridListData;

    public function MyAdvancedDataGridGroupItemRenderer(){
        super();
    }

    override public function set listData(value:BaseListData):void {
        super.listData = value;
        if (value) {
            _listData = value as AdvancedDataGridListData;
            _listOwner = value.owner as AdvancedDataGrid;

            label.addEventListener(MouseEvent.MOUSE_OVER,
                function(event:MouseEvent):void {
                    _listOwner.contextMenu = myContextMenu();
                    event.stopImmediatePropagation();
                });

            label.addEventListener(MouseEvent.MOUSE_OUT,
                function(event:MouseEvent):void {
                    _listOwner.contextMenu = null;
                    event.stopImmediatePropagation();
                });

            addEventListener( MouseEvent.CLICK,
                function(event:MouseEvent):void {
                    _listOwner.expandChildrenOf(_listData.item, !_listData.open);
                    event.stopImmediatePropagation();
                });
        }
    }

    private function myContextMenu():ContextMenu {
        var contextMenu:ContextMenu = new ContextMenu();
        contextMenu.hideBuiltInItems();

        var expandCollapseItem:ContextMenuItem = new ContextMenuItem("Expand/Collapse Item",false,true,true);
        expandCollapseItem.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,
            function(event:ContextMenuEvent):void {
                _listOwner.expandItem( _listData.item, !_listData.open, false, false,null);
                event.stopImmediatePropagation();
            });
        contextMenu.customItems.push(expandCollapseItem);

        var expandCollapseChildrenOf:ContextMenuItem = new ContextMenuItem("Expand/Collapse Children Of",false,true,true);
        expandCollapseChildrenOf.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,
            function(event:ContextMenuEvent):void {
                _listOwner.expandChildrenOf(_listData.item, !_listData.open);
                event.stopImmediatePropagation();
            });
        contextMenu.customItems.push(expandCollapseChildrenOf);
        /**
         *     collapseAll/expandAll  is causing
         *     Error #1502: A script has executed for
         *     longer than the default timeout period of 15 seconds.
         */
        //            var collapseAllMenuItem:ContextMenuItem = new ContextMenuItem("Collapse All Groups",true,true,true);
        //            collapseAllMenuItem.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,
        //                function(event:ContextMenuEvent):void {
        //                    _listOwner.collapseAll();
        //                });
        //            contextMenu.customItems.push(collapseAllMenuItem);
        //
        //            var expandAllMenuItem:ContextMenuItem = new ContextMenuItem("Expand All Groups",false,true,true);
        //            expandAllMenuItem.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,
        //                function(event:ContextMenuEvent):void {
        //                    _listOwner.expandAll();
        //                });
        //            contextMenu.customItems.push(expandAllMenuItem);

        return contextMenu;
    }

Reply

Thank you very much for this example, it helped me optimise my own code!

Reply

Hi,

I have been trying the same trick for FileSystemTree in AIR but it does not work.

When I click on the row, I see the triangle looking down. I click again, it goes back to its initial position. I trace if the branch is open and get false/true so no problem there. However, the tree structure does not update itself. Moreover, if I happen to click on the triangle first, then everything works smoothly. There must be something about disclosure events, right?

Reply