Touchwood Presents UI Marker Beta 1

Touchwood is proud to present UI Marker Beta 1. UI Marker is a Flex component that allows users to draw squares, lines, and notes on an AIR application's UI and save the screenshot as a PNG. This tool is valuable for design reviews and/or client input and feedback.

How to implement:

Let's say you want to setup your app to where a user can click F12 and make notations. Here's how you do it.

1. Link your AIR application to the UIMarker SWC by right mouse clicking on your project and selecting "Properties -> Flex Build Path -> Library Path -> Add SWC..."
2. Next setup setup a key listener that uses the PopupManager to create the component:

   public function init():void{

   this.addEventListener(KeyboardEvent.KEY_UP, keyClicked);

   }
   private function keyClicked(evt:KeyboardEvent):void{

   if(evt.keyCode == 123){

   if(sb == null){

   sb=SketchBar(PopUpManager.createPopUp( this, SketchBar , false));
   sb.target = test_cvs;

   }else{

   sb.visible = !sb.visible;

   }
   setFocus();

   }

   }

3. Viola!

Touchwood would love to hear your feedback for any sort of bugs and/or thoughts on how to improve the component.

 SWC and example project are attached to this post