Flex: Creating a custom context menu item for an application

Here is a little piece of code I would like to share with all my fellow Flex Geeks out there. This code explains how to create a custom context menu item for an app. If you have any questions, please feel free to ask. There are other similar flex resources at http://blog.flexexamples.com.

<?xml version=”1.0″ encoding=”utf-8″?>
<!– http://blog.mygeeklife.net/creating-a-custom-context-menu-for-an-application/ –>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml”
layout=”absolute”
creationComplete=”contextMenuItems();”
backgroundGradientColors=”[#ffffff, #a9b4d8]”>

<mx:Script>
<![CDATA[

// Declare a bindable private variable

[Bindable]
private var cm:ContextMenu;

// This function initializes a new Context Menu

private function contextMenuItems():void {

// Declare ContextMenuItem variable

var myGeekLifeLink:ContextMenuItem = new ContextMenuItem(”MyGeekLife”);

// Add event listener which calls the myGeekLifeLink_menuItemSelect function declared below

myGeekLifeLink.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, myGeekLifeLink_menuItemSelect);

// Create new context menu

cm = new ContextMenu();

// Hide default context menu items

cm.hideBuiltInItems();

// Add link

cm.customItems.push(myGeekLifeLink);

// Apply context menu to application

application.contextMenu = cm;
}

// Navigates to new url when link is clicked

private function myGeekLifeLink_menuItemSelect(evt:ContextMenuEvent):void {
navigateToURL(new URLRequest(’http://www.mygeeklife.net/’));
}

]]>
</mx:Script>

<mx:VBox width=”100%” height=”100%” horizontalAlign=”center” verticalAlign=”middle”>
<mx:Panel width=”250″ height=”200″ title=”Example App”>
<mx:Text text=”Right click anywhere on the application to initialize the Context Menu. Click on MyGeekLife to be taken to the URL. ” width=”229″ height=”160″ fontFamily=”Arial” fontSize=”17″ color=”#000000″/>
</mx:Panel>
</mx:VBox>

</mx:Application>

Share and Enjoy: These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Digg
  • StumbleUpon
  • SphereIt
  • del.icio.us
  • Sphinn
  • Facebook
  • Google
  • Mixx
  • Ma.gnolia
  • Technorati
  • Slashdot
  • YahooMyWeb
  • Live
  • Reddit
  • NewsVine

Tags: , , , , , , ,

3 Responses to “Flex: Creating a custom context menu item for an application”

  1. Josette Says:

    These look like DOS commands to my older eye - is Flex DOS based? I DO enjoy this tech stuff.

    Jos

  2. S.A.M. Says:

    Jos>>

    Flex is written in MXML and AS3. It isn’t DOS based but it was a good guess. Basically, Flex allows programmers to develop Rich Internet Applications with all the bells and whistles of a desktop application in the browser.

    Thanks for the comment,

    S.A.M.

  3. Martin Says:

    LOL at DOS based… what DOS based?! what did you do in the past Josette!?

Leave a Reply