Link button in tree at end of each parent node

问题

I need to have link buttons at end of each parent node as shown below

-->(Parent)IBM Machines (rename | delete | disable)

Child 1 Child 2 Child 3

-->(Parent)Sony ( rename | delete | disable)

Child 1 Child 2 Child 3

rename ,delete and diasble are supposed to be link buttons. I have tried with label function and other methods also but not able get the exact requrement. Please help me as how to achieve this.

回答1:

Use ItemRendrer, examples (including tree) can be found at Using an item renderer with a Tree control

EDIT Please also see sample : Flex Checkbox TreeItemRenderer

Hopes that helps

EDIT Please use following ItemRendrer

package
{
    import mx.controls.LinkButton;
    import mx.controls.treeClasses.*;

    public class LinkButtonTreeItemRenderer extends TreeItemRenderer{

        public var lnkRename:LinkButton;
        public var lnkDelete:LinkButton;
        public var lnkDisable:LinkButton;

        public function LinkButtonTreeItemRenderer(){
            super();
        }

        override protected function createChildren():void{
            super.createChildren();


            lnkRename= new LinkButton();
            lnkRename.label = "rename";
            lnkRename.visible = true;

            addChild(lnkRename);

            lnkDelete= new LinkButton();
            lnkDelete.label = "delete";
            lnkDelete.visible = true;

            addChild(lnkDelete);

            lnkDisable= new LinkButton();
            lnkDisable.label = "disable";
            lnkDisable.visible = true;

            addChild(lnkDisable);


        }

        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
            super.updateDisplayList(unscaledWidth,unscaledHeight);


                 lnkRename.x = label.x + label.textWidth+10;
                 lnkRename.width = 55;
                 lnkRename.height = 20;


                 lnkDelete.x = lnkRename.x + lnkRename.width;
                 lnkDelete.width = 55;
                 lnkDelete.height = 20;

                 lnkDisable.x = lnkDelete.x + lnkDelete.width;
                 lnkDisable.width = 55;
                 lnkDisable.height = 20;

                 //this.width= 250;



        }


    }
}

回答2:

You need to use item renderers to add extra functionality to rows. Something like this:

<mx:Tree itemRenderer="SomeItemRenderer" />

And then the item renderer is just a new custom component in a separate file named SomeItemRenderer:

<mx:HBox width="100%">
<mx:Label text="{data.name} />
<mx:Spacer width="100%" />
<mx:LinkButton label="rename" />
<mx:LinkButton label="delete" />
<mx:LinkButton label="disable" />
</mx:HBox>

You'll need some kind of logic to know if you should display the linkbuttons; I would probably just add states and add/remove them if the data has children or not.

来源：https://stackoverflow.com/questions/5699977/link-button-in-tree-at-end-of-each-parent-node