<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Assertion Through Structure &#187; Flex</title>
	<atom:link href="http://www.blog.dannygagne.com/archives/category/flex/feed" rel="self" type="application/rss+xml" />
	<link>http://www.blog.dannygagne.com</link>
	<description>Manipulating the future one day at a time</description>
	<lastBuildDate>Sun, 15 Jan 2012 16:14:05 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>Custom Right Click or Context Menu in Flex/Flash AS3</title>
		<link>http://www.blog.dannygagne.com/archives/80</link>
		<comments>http://www.blog.dannygagne.com/archives/80#comments</comments>
		<pubDate>Sun, 31 May 2009 10:12:03 +0000</pubDate>
		<dc:creator>danny</dc:creator>
				<category><![CDATA[Flex]]></category>

		<guid isPermaLink="false">http://www.blog.dannygagne.com/?p=80</guid>
		<description><![CDATA[UPDATE: Please see comments for a bug, and a work around. I've created a small little library for creating a right click menu in flash: This works not only on the top level components, but also on nested components. In the example you can right click on each button and see a custom menu. Demo: [...]]]></description>
			<content:encoded><![CDATA[<p><strong>UPDATE: Please see comments for a bug, and a work around.</strong></p>
<p>I've created a small little library for creating a right click menu in flash:</p>
<p>This works not only on the top level components, but also on nested components.  In the example you can right click on each button and see a custom menu.</p>
<p>Demo:<br />
<object id="VideoPlayback" style="width: 400px; height: 300px;" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="100" height="100" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="src" value="http://www.dannygagne.com/projects/flex/context-menu-demo/ContextMenuDemo.swf" /><embed id="VideoPlayback" style="width: 400px; height: 300px;" type="application/x-shockwave-flash" width="100" height="100" src="http://www.dannygagne.com/projects/flex/context-menu-demo/ContextMenuDemo.swf"></embed></object></p>
<p>Some Links:<br />
<a href="http://dannygagne.com/projects/flex/context-menu-demo/ContextMenuDemo.html" onclick="pageTracker._trackPageview('/outgoing/dannygagne.com/projects/flex/context-menu-demo/ContextMenuDemo.html?referer=');">AS3 Right Click Context Menu Right, Click To View Source</a> <a href="http://dannygagne.com/projects/flex/context-menu-demo/srcview/ContextMenuDemo.zip" onclick="pageTracker._trackPageview('/outgoing/dannygagne.com/projects/flex/context-menu-demo/srcview/ContextMenuDemo.zip?referer=');"> </a></p>
<p><a href="http://dannygagne.com/projects/flex/context-menu-demo/srcview/ContextMenuDemo.zip" onclick="pageTracker._trackPageview('/outgoing/dannygagne.com/projects/flex/context-menu-demo/srcview/ContextMenuDemo.zip?referer=');">Context Menu Source In Zip File</a></p>
<p><a href="http://dannygagne.com/projects/flex/context-menu-demo/srcview/ContextMenuDemo.zip" onclick="pageTracker._trackPageview('/outgoing/dannygagne.com/projects/flex/context-menu-demo/srcview/ContextMenuDemo.zip?referer=');"></a><a href="http://www.opensource.org/licenses/mit-license.php" onclick="pageTracker._trackPageview('/outgoing/www.opensource.org/licenses/mit-license.php?referer=');"></a> <a href="http://www.opensource.org/licenses/mit-license.php" onclick="pageTracker._trackPageview('/outgoing/www.opensource.org/licenses/mit-license.php?referer=');">MIT Licensed</a></p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;"><span style="color: #9900cc; font-weight: bold;">package</span>
<span style="color: #000000;">&#123;</span>
	<span style="color: #0033ff; font-weight: bold;">import</span> <span style="color: #004993;">flash.events</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">ContextMenuEvent</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #0033ff; font-weight: bold;">import</span> <span style="color: #004993;">flash.events</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">MouseEvent</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #0033ff; font-weight: bold;">import</span> <span style="color: #004993;">flash.ui</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">ContextMenuItem</span><span style="color: #000066; font-weight: bold;">;</span>
&nbsp;
	<span style="color: #0033ff; font-weight: bold;">import</span> mx<span style="color: #000066; font-weight: bold;">.</span>core<span style="color: #000066; font-weight: bold;">.</span>Application<span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #0033ff; font-weight: bold;">import</span> mx<span style="color: #000066; font-weight: bold;">.</span>core<span style="color: #000066; font-weight: bold;">.</span>UIComponent<span style="color: #000066; font-weight: bold;">;</span>
&nbsp;
	<span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #9900cc; font-weight: bold;">class</span> RightClickMenu
	<span style="color: #000000;">&#123;</span>
		<span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #6699cc; font-weight: bold;">var</span> MenuContents<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">Array</span> = <span style="color: #0033ff; font-weight: bold;">new</span> <span style="color: #004993;">Array</span> <span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">public</span>  <span style="color: #339966; font-weight: bold;">function</span> RightClickMenu<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000000;">&#123;</span><span style="color: #000000;">&#125;</span>
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #339966; font-weight: bold;">function</span> AddItem <span style="color: #000000;">&#40;</span><span style="color: #004993;">name</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">String</span><span style="color: #000066; font-weight: bold;">,</span> func<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">Function</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>
			MenuContents<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">push</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#123;</span>Name<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">name</span><span style="color: #000066; font-weight: bold;">,</span> Func<span style="color: #000066; font-weight: bold;">:</span>func<span style="color: #000000;">&#125;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
		<span style="color: #000000;">&#125;</span>
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #339966; font-weight: bold;">function</span> AssignRightClick <span style="color: #000000;">&#40;</span>uiComponent<span style="color: #000066; font-weight: bold;">:</span>UIComponent<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>
			uiComponent<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">addEventListener</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">MouseEvent</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">MOUSE_OVER</span><span style="color: #000066; font-weight: bold;">,</span> genEnableMenu <span style="color: #000000;">&#40;</span>uiComponent<span style="color: #000000;">&#41;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
			uiComponent<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">addEventListener</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">MouseEvent</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">MOUSE_MOVE</span><span style="color: #000066; font-weight: bold;">,</span> disableMenu<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
		<span style="color: #000000;">&#125;</span>
&nbsp;
		<span style="color: #009966; font-style: italic;">/* Assignment */</span>
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #339966; font-weight: bold;">function</span> ResetContextMenu <span style="color: #000000;">&#40;</span>event<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">MouseEvent</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>	<span style="color: #009900; font-style: italic;">//remove menu</span>
			Application<span style="color: #000066; font-weight: bold;">.</span>application<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">contextMenu</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">customItems</span> = <span style="color: #0033ff; font-weight: bold;">new</span> <span style="color: #004993;">Array</span> <span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
			<span style="color: #009900; font-style: italic;">//remove this function</span>
			Application<span style="color: #000066; font-weight: bold;">.</span>application<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">removeEventListener</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">MouseEvent</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">MOUSE_MOVE</span><span style="color: #000066; font-weight: bold;">,</span> ResetContextMenu<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
		<span style="color: #000000;">&#125;</span>
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #339966; font-weight: bold;">function</span> disableMenu<span style="color: #000000;">&#40;</span>event<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">MouseEvent</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #009900; font-style: italic;">//Stop the mouse move event from propagating to the application level, where we remove the menu</span>
			event<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">stopImmediatePropagation</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
		<span style="color: #000000;">&#125;</span>
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #339966; font-weight: bold;">function</span> genEnableMenu <span style="color: #000000;">&#40;</span>uiComponent<span style="color: #000066; font-weight: bold;">:</span>UIComponent<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">Function</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #0033ff; font-weight: bold;">return</span> <span style="color: #339966; font-weight: bold;">function</span> <span style="color: #000000;">&#40;</span>event<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">MouseEvent</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
			<span style="color: #000000;">&#123;</span>
				<span style="color: #009900; font-style: italic;">//add event listener to remove the menu on mouse move</span>
				Application<span style="color: #000066; font-weight: bold;">.</span>application<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">addEventListener</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">MouseEvent</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">MOUSE_MOVE</span><span style="color: #000066; font-weight: bold;">,</span> ResetContextMenu<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>			
&nbsp;
				<span style="color: #009900; font-style: italic;">//hide current menu</span>
				Application<span style="color: #000066; font-weight: bold;">.</span>application<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">contextMenu</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">hideBuiltInItems</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
&nbsp;
				<span style="color: #009900; font-style: italic;">//remove menu (ifyou right click and then move, this may not be killed.</span>
				Application<span style="color: #000066; font-weight: bold;">.</span>application<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">contextMenu</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">customItems</span> = <span style="color: #0033ff; font-weight: bold;">new</span> <span style="color: #004993;">Array</span> <span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>				
&nbsp;
				<span style="color: #009900; font-style: italic;">//create new menu</span>
				<span style="color: #0033ff; font-weight: bold;">for</span> <span style="color: #000000;">&#40;</span><span style="color: #6699cc; font-weight: bold;">var</span> i<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">Number</span> <span style="color: #0033ff; font-weight: bold;">in</span> MenuContents<span style="color: #000000;">&#41;</span>
				<span style="color: #000000;">&#123;</span>
					<span style="color: #6699cc; font-weight: bold;">var</span> menuItem<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">ContextMenuItem</span> = <span style="color: #0033ff; font-weight: bold;">new</span> <span style="color: #004993;">ContextMenuItem</span><span style="color: #000000;">&#40;</span>MenuContents<span style="color: #000000;">&#91;</span>i<span style="color: #000000;">&#93;</span><span style="color: #000066; font-weight: bold;">.</span>Name<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
					menuItem<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">addEventListener</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">ContextMenuEvent</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">MENU_ITEM_SELECT</span><span style="color: #000066; font-weight: bold;">,</span> MenuContents<span style="color: #000000;">&#91;</span>i<span style="color: #000000;">&#93;</span><span style="color: #000066; font-weight: bold;">.</span>Func<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
					Application<span style="color: #000066; font-weight: bold;">.</span>application<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">contextMenu</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">customItems</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">push</span><span style="color: #000000;">&#40;</span>menuItem<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
				<span style="color: #000000;">&#125;</span>
			<span style="color: #000000;">&#125;</span>
		<span style="color: #000000;">&#125;</span>
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #339966; font-weight: bold;">function</span> genClickCall <span style="color: #000000;">&#40;</span>func<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">Function</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">Function</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #0033ff; font-weight: bold;">return</span> <span style="color: #339966; font-weight: bold;">function</span> <span style="color: #000000;">&#40;</span>event<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">ContextMenuEvent</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
			<span style="color: #000000;">&#123;</span>
				func<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span>
				ResetContextMenu<span style="color: #000000;">&#40;</span><span style="color: #0033ff; font-weight: bold;">null</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
			<span style="color: #000000;">&#125;</span>
&nbsp;
		<span style="color: #000000;">&#125;</span>
&nbsp;
	<span style="color: #000000;">&#125;</span>
<span style="color: #000000;">&#125;</span></pre></div></div>

<p>To use the class 1) Create an instance of it, 2) Populate it, 3) bind it to the component.</p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;">		<span style="color: #000000;">&lt;!<span style="color: #66cc66;">&#91;</span>CDATA<span style="color: #66cc66;">&#91;</span></span>
<span style="color: #000000;">			import mx.controls.Alert;</span>
&nbsp;
<span style="color: #000000;">			private function appComplete <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:void</span>
<span style="color: #000000;">			<span style="color: #66cc66;">&#123;</span></span>
<span style="color: #000000;">				var menu1:RightClickMenu = new RightClickMenu <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">				menu1.AddItem<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;B1&quot;</span>, function <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:void<span style="color: #66cc66;">&#123;</span>Alert.show<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;B1&quot;</span><span style="color: #66cc66;">&#41;</span>;<span style="color: #66cc66;">&#125;</span><span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">				menu1.AddItem<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;B1-A&quot;</span>, function <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:void<span style="color: #66cc66;">&#123;</span>Alert.show<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;B1-A&quot;</span><span style="color: #66cc66;">&#41;</span>;<span style="color: #66cc66;">&#125;</span><span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">				menu1.AssignRightClick<span style="color: #66cc66;">&#40;</span>b1<span style="color: #66cc66;">&#41;</span>;</span>
&nbsp;
<span style="color: #000000;">				var menu2:RightClickMenu = new RightClickMenu <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">				menu2.AddItem<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;B2&quot;</span>, function <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:void<span style="color: #66cc66;">&#123;</span>Alert.show<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;B2&quot;</span><span style="color: #66cc66;">&#41;</span>;<span style="color: #66cc66;">&#125;</span><span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">				menu2.AssignRightClick<span style="color: #66cc66;">&#40;</span>b2<span style="color: #66cc66;">&#41;</span>;</span>
&nbsp;
<span style="color: #000000;">				var menu3:RightClickMenu = new RightClickMenu <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">				menu3.AddItem<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;B3&quot;</span>, function <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:void<span style="color: #66cc66;">&#123;</span>Alert.show<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;B3&quot;</span><span style="color: #66cc66;">&#41;</span>;<span style="color: #66cc66;">&#125;</span><span style="color: #66cc66;">&#41;</span>;</span>
<span style="color: #000000;">				menu3.AssignRightClick<span style="color: #66cc66;">&#40;</span>b3<span style="color: #66cc66;">&#41;</span>;		</span>
&nbsp;
<span style="color: #000000;">			<span style="color: #66cc66;">&#125;</span></span>
<span style="color: #000000;">		<span style="color: #66cc66;">&#93;</span><span style="color: #66cc66;">&#93;</span><span style="color: #7400FF;">&gt;</span></span></pre></div></div>

]]></content:encoded>
			<wfw:commentRss>http://www.blog.dannygagne.com/archives/80/feed</wfw:commentRss>
		<slash:comments>9</slash:comments>
		</item>
	</channel>
</rss>

