24-bit

I was thinking about a visual to use in a talk where I was explaining colour depth. Here is something playful that resulted from my quest for clarity. Open 24-bit Experiment

Another drop[down] in the bucket part II

This is a Flash-based AS3 drop down menu. It has two parts:

1. DropDown.as (download .zip here)
2. Frame script and appropriate Library items. Menus could easily be scripted but why not use the visual power of the Flash authoring tool. A script sample is found below.

What follows is sample runtime code. This would be found as a frame script in a Flash authoring tooled constructed file.

Import the DropDown class (DropDown.as).

import DropDown;

XML that provides info about the content and structure of the menu.

var myXML:XML = <menu><item>People<item>Michael<item>Teaching</item><item>Design</item></item><item>Jes</item></item><item>Cities<item>Winnipeg</item><item>Toronto Canada World Universe<item>Annex</item><item>Cabbagetown</item></item></item><item>Bicycles<item>Trek<item>Mountain</item><item>Road</item></item><item>Giant<item>Mountain</item><item>Road</item></item></item><item>Airplanes<item>Boeing<item>737</item><item>727</item></item><item>Airbus<item>A320</item><item>A319</item></item></item></menu;

Create a new DropDown instance.

var menu:DropDown = new DropDown(myXML);

Add the menu graphics.

//The arguments for this method are:
//@ level = submenu level to add graphic to
//@ libRef = A string. Refers to the class names 
//    of the library items used as graphic assets. 
//    You will require movie clips in your Library that 
//    are set to "export for actionscript". 
//    Each clip should have two frames and 
//    a stop() on the first frame. 
//    Frame 1 = up state, Frame 2 = over state.
//
//    *** Note: Level 0 is unseen but currently 
//    *** you must add a graphic asset.
//
menu.addMenuGraphic(0, "MC_menuItem");
menu.addMenuGraphic(1, "MC_menuItem");
menu.addMenuGraphic(2, "MC_menuItemSub");
menu.addMenuGraphic(3, "MC_menuItemSub2");

Initialize the menu. XML is read and parsed and the menu is drawn.

menu.initialize();

Position the menu.

menu.x = 10; menu.y = 10;

Close all the menu items that should be closed to begin.

menu.closeMenusByLabel(["Cities", "Bicycles", "Airplanes"]);

Add the menu to the stage.

addChild(menu);

Add listener for user clicks of the menu.

menu.addEventListener("MENU_CLICKED", onMenuClicked);

Add handler for menu click event.

function onMenuClicked($e) {
 trace ("Menu clicked: " + menu.menu_selected.label + " " + menu.menu_selected.name + " " + menu.menu_selected.index);
}

I would love suggestions to make this better.