Customize the Right-click menu in Flash | ContextMenuItem Tutorial

    Overview:

    Flash give publishers the opportunity to customize the right-click menu which pops up in the swf file with a context menu item in actionscript.

    ContextMenuItem

    ContextMenuItem(caption:String, callbackFunction:Function, [separatorBefore:Boolean], [enabled:Boolean], [visible:Boolean])

    Creates a new ContextMenuItem object that can be added to the

    ContextMenu.customItems

    array.

    Steps:

    The menu item has a caption, which is displayed to the user in the right click menu. It also has a a callback function handler by naming the function in the code to be invoked once the menu item is selected. It then has three boolean values which specify whether the item has a separator before it, is enabled, and is visible.

    To add a new context menu item to a context menu, you simply create the context menu items and then push them into the customItems array.
    You can enable or disable specific menu items, make items visible or invisible, or change the caption or callback handler associated with a menu item at any time.
    In the example here the menu items about clearing and rewriting the text are set to toggle each other, so you can’t rewrite the text if it hasn’t yet been cleared and vice versa.

    To further customize the context menu flash allows us to hide the built in items in the menu with hideBuiltInItems(). This hides all the built in item from view (except ‘settings’) by setting their visibility to false.

    Example:

    Get Adobe Flash player


    Actionscript:

    var myMenu:ContextMenu = new ContextMenu();
    myMenu.hideBuiltInItems();
    var ccs:ContextMenuItem = new ContextMenuItem("Visit Circle Cube Studio", visitCCS, false, true, true);
    var pog:ContextMenuItem = new ContextMenuItem("Visit Interactive Flash Portfolio", visitPOG, false, true, true);
    var ct:ContextMenuItem = new ContextMenuItem("Clear Text", clearText, true, true, true);
    var rw:ContextMenuItem = new ContextMenuItem("Rewrite Text", rwText, true, false, true);
    var mt:ContextMenuItem = new ContextMenuItem("Move Text", moveText, false, true, true);

    myMenu.customItems.push(ccs, pog, ct, mt, rw);
    _root.menu = myMenu;

    function visitCCS () {
    getURL("http://circlecube.com", "_blank");
    }
    function visitPOG () {
    getURL("http://www.circlecube.com/test/", "_blank");
    }
    function clearText() {
    myText = "";
    ct.enabled = false;
    rw.enabled = true;
    }
    function rwText() {
    myText = "Rewrite: \nRight-click to see the customized menu";
    ct.enabled = true;
    rw.enabled = false;
    }
    function moveText() {
    theText._y += 10;
    }

    Download:

    Download the Zip file (right-clickMenu.zip)

    This entry was posted in tutorial and tagged , , , , , , , , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

    5 Comments

    1. fossx
      Posted March 13, 2008 at 11:25 pm | Permalink

      Simple and straightforward. Thanks.

    2. Posted April 10, 2008 at 12:16 pm | Permalink

      Can you tell me how to implement this in my index.htm?
      I have a swf file and I want to hide the right-click menu…

    3. Posted April 10, 2008 at 12:27 pm | Permalink

      Hello,
      can you tell me how to implement this?

      I have a script:

      function AC_AddExtension(src, ext)
      {
      if (src.indexOf(‘?’) != -1)
      return src.replace(/\?/, ext+’?');
      else
      return src + ext;
      }

      function AC_Generateobj(objAttrs, params, embedAttrs)
      {
      var str = ”;
      for (var i in params)
      str += ‘ ‘;
      str += ”;

      document.write(str);
      }

      function AC_FL_RunContent(){
      var ret =
      AC_GetArgs
      ( arguments, “.swf”, “movie”, “clsid:d27cdb6e-ae6d-11cf-96b8-444553540000″
      , “application/x-shockwave-flash”
      );
      AC_Generateobj(ret.objAttrs, ret.params, ret.embedAttrs);
      }

      function AC_SW_RunContent(){
      var ret =
      AC_GetArgs
      ( arguments, “.dcr”, “src”, “clsid:166B1BCA-3F9C-11CF-8075-444553540000″
      , null
      );
      AC_Generateobj(ret.objAttrs, ret.params, ret.embedAttrs);
      }

      function AC_GetArgs(args, ext, srcParamName, classid, mimeType){
      var ret = new Object();
      ret.embedAttrs = new Object();
      ret.params = new Object();
      ret.objAttrs = new Object();
      for (var i=0; i < args.length; i=i+2){
      var currArg = args[i].toLowerCase();

      switch (currArg){
      case “classid”:
      break;
      case “pluginspage”:
      ret.embedAttrs[args[i]] = args[i+1];
      break;
      case “src”:
      case “movie”:
      args[i+1] = AC_AddExtension(args[i+1], ext);
      ret.embedAttrs["src"] = args[i+1];
      ret.params[srcParamName] = args[i+1];
      break;
      case “onafterupdate”:
      case “onbeforeupdate”:
      case “onblur”:
      case “oncellchange”:
      case “onclick”:
      case “ondblClick”:
      case “ondrag”:
      case “ondragend”:
      case “ondragenter”:
      case “ondragleave”:
      case “ondragover”:
      case “ondrop”:
      case “onfinish”:
      case “onfocus”:
      case “onhelp”:
      case “onmousedown”:
      case “onmouseup”:
      case “onmouseover”:
      case “onmousemove”:
      case “onmouseout”:
      case “onkeypress”:
      case “onkeydown”:
      case “onkeyup”:
      case “onload”:
      case “onlosecapture”:
      case “onpropertychange”:
      case “onreadystatechange”:
      case “onrowsdelete”:
      case “onrowenter”:
      case “onrowexit”:
      case “onrowsinserted”:
      case “onstart”:
      case “onscroll”:
      case “onbeforeeditfocus”:
      case “onactivate”:
      case “onbeforedeactivate”:
      case “ondeactivate”:
      case “type”:
      case “codebase”:
      ret.objAttrs[args[i]] = args[i+1];
      break;
      case “width”:
      case “height”:
      case “align”:
      case “vspace”:
      case “hspace”:
      case “class”:
      case “title”:
      case “accesskey”:
      case “name”:
      case “id”:
      case “tabindex”:
      ret.embedAttrs[args[i]] = ret.objAttrs[args[i]] = args[i+1];
      break;
      default:
      ret.embedAttrs[args[i]] = ret.params[args[i]] = args[i+1];
      }
      }
      ret.objAttrs["classid"] = classid;
      if (mimeType) ret.embedAttrs["type"] = mimeType;
      return ret;
      }

      Can I implement it in here somewhere?

    4. steve
      Posted August 17, 2008 at 1:31 am | Permalink

      Can you customoize a right click to have customized menus on different areas of a screen instead of having those options only available globaly?

    5. Naresh kumar
      Posted July 21, 2010 at 8:42 am | Permalink

      I try this same tutorials in action script 3.0. I got all the menu.
      But I am not able to give a email link to my “email me” item.

      So can you create a this same tutorials in action script 3

      Thanks.

    Post a Comment

    Your email is never published nor shared. Required fields are marked *

    *
    *

    You may use these HTML tags and attributes: <a href="" title="" rel=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

    • Recent Posts

      WordPress updates plugin directory

      New additions to the plugin directory include: favorites, incorporating support forums into it's own tab for each plugin as well as support stats being displayed! Great! I think we also need the ability to give plugins ratings and reviews (bonus points if it can be done from within a wordpress admin dashboard when installing plugins). [...]

      Short Head

      Use zipf's short head to tune your website rather than redesign the whole thing. To make a website successful it needs to meet the needs of the users. Find out what those needs are by using the short head philosophy to equate most searched things as the biggest needs of the users. Use personas to [...]

      Img Set?

      Great article at a list apart discusing the state of the industry regarding responsive images. This picks apart the set attribute of the img element from a surprisingly objective view coming from someone so close to the picture element. Insightful discussion about the principle behind the proposals than the actual solution too. If the working [...]

      Triudo

      A mesmerizing animated triangle-ish shape form. Embedded Link triduo triduo Tweet

      Git – the paradigm shift

      A great developer story about the differences on what Git is vs other version control and what Git is not. This is how we should learn it. I heard over and over that it was distributed, but never grasped what that meant, so here are a few links and explanations that will help unlearn version [...]

      Tweening Lib comes to Javascript!

      I'm very excited to share the news that the tween library from GreenSock (hands down the best tweening library I used in flash) is not ported for use in javascript! This will be great! I missed that simple syntax from as3 when animating javascript, and now I can have my cake and eat it too. [...]

      Responsive CSS Tricks

      Here are a few useful css tricks to remember when building responsive design sites from web designer wall Embedded Link 5 Useful CSS Tricks for Responsive Design Making the design to be responsive is very easy as shown in my Responsive Design in 3 Steps tutorial, but maintaining the elements to look aesthetically balanced on [...]

      Picture element of srcset attribute?

      Bruce details the reasons and story behind the srcset attribute which is now introduced as an alternative to the picture element. Some aspects of the attribute are nice (like the fact that it's an attribute and not a new element, so it's creating up new elements with for problems. It's adapting currently used elements to [...]

      SVG Preloader with Raphael JS

      Here's a very creative use of using a newly available technology. Using svg graphics which are very lightweight, for a website preloader. I like the animation used as well. Embedded Link Make a stylish preloader with SVG | Tutorial | .net magazine Many sites neglect users with slow connections. Ian Culshaw explains how to use [...]

      CSS3 Button/Icon set

      I've been secretly hoping to see a few of these pop up once the whole icon font idea spread through the nets. I really like this idea and it's a very nice implementation too! I only see some quality issues on a couple of the icons (such as youtube), but it's awesome and I hope [...]

    • Recent Comments

      Bruce Brownlee

      Bruce Brownlee

      Ah IE6. I'd have 2 more years of sleep without IE6. Margin doubling, no properties,...
      versaena

      versaena

      how to give color at runtime…… thank you
      Mobile Websites

      Mobile Websites

      I disagree, mobile websites are the future – desktop websites and mobile websites...
      Matt Fasick

      Matt Fasick

      That's cool. I like the ripple effect as well.
      Nico

      Nico

      hi! really great job guy! very impressive.. just a question… do u have a solution to do a refresh...
      Evan Mullins

      Evan Mullins

      Agreed! I've just seen some people get pretty heated about separating all functionality...