Create Custom Menu Using Menu Control

1) Create menuMxmlRenderClass: Name: customMenuRender

"<" mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()"
implements="mx.controls.menuClasses.IMenuItemRenderer" ">"
"<" mx:Script ">"
"<" ![CDATA[
import mx.events.StateChangeEvent;
import mx.controls.Menu;
import mx.controls.menuClasses.IMenuItemRenderer;
private function init():void
{
var obj:Object=this.data;
if(obj!=null && obj.mnu_name!=null)
{
txtName.text=obj.mnu_name;
}
}
//Function for IMenuItemRenderer
public function get menu():Menu
{
return null;
}
public function set menu(value:Menu):void
{
}
public function get measuredIconWidth():Number{return 0;}
public function get measuredTypeIconWidth():Number{return 0;}
public function get measuredBranchIconWidth():Number{return 0;}
]] ">"
"<" /mx:Script ">"
"<" mx:Text id="txtName" / ">"
"<" /mx:VBox ">"

2) Function for parent where it will be clicked.

private var l_menu:Menu;
private function openCustomMenu(event:MouseEvent):void
{
if(l_menu==null)
{
l_menu = Menu.createMenu(this,menuContentArray);
l_menu.itemRenderer = new ClassFactory(customMenuRender);
l_menu.addEventListener(MenuEvent.ITEM_CLICK , menuMouseClickHandler);
l_menu.minWidth=160;
l_menu.styleName="menuCornerRadious";
}
var item_Menu:ArrayCollection=menuContentArray;
var xPos:Number=event.stageX + (event.currentTarget.width-event.localX);
var yPos:Number=event.stageY - ((20*item_Menu.length)/2);
l_menu.show(xPos, yPos);
// Function for gettion menu item if required
setMenuEnable();
}

private function setMenuEnable():void
{
if(l_menu!=null)
{
for(var i:int=0;i {
var obj:customMenuRender =l_menu.indexToItemRenderer(i) as customMenuRender;
if(obj)
{
// Calling menu item render function
}
}
}
}