In my downhill struggle over proper use of the bounding-box in a custom component - which in my case is class CustomComp extends MovieClip - that has an originating "bounding box" I find it is best to set the bounding box's alpha level to 0 via the flash IDE. This will prevent the bounding box from showing up in the Live Preview and in the compiled/exported SWF.

The steps I follow to create an extended MovieClip class as a component with a live preview are similar to the BoundBox concept outlined on: http://www.ultrashock.com/tutorials/flashmx/Components.php

Create your custom class definition, i.e. something starting with the likes of:

class Btn extends MovieClip {
	[Inspectable(name="1 width", defaultValue=60, type=Number)]
	public var __width:Number;
	[Inspectable(name="2 height", defaultValue=16, type=Number)]
	private var __height:Number;
	[Inspectable(name="3 text", defaultValue="Send", type=String)]
	private var _bGlyph;
//...
}

Start with a fresh Flash Document with a completely empty stage and nothing in the library. Now it's time to add first our BoundingBox. Right-click in the Library window and click New Symbol


Name the new symbol appropriately and it is to be just a simple MovieClip object which we'll be using later. Hit OK after you enter the symbol name.



Now it's time to draw our bounding box with the Rectangle Tool. It's important to note that the X and Y on this are both 0! I simple use a "stroke" and an empty fill - which looks like a red diagonal line instead of a specific color.


Once we've created the Bounding Box's outline, double click back on the stage and right-click the library again to create a symbol for our new extended MovieClip class which we so aptly named "Btn". Be sure to check the "Export for actionscript" and enter the exact name of the class file and class itself in the Identifier and AS 2.0 Class fields. Hit OK to add to the library.


Once you hit OK, you'll be editing the visual contents of the newly created Btn symbol - which you can tell your editing in the area just above the timeline. Now we want to drag an instance of the BoundingBox symbol onto the center of the contents of our Btn symbol we're currently editing as follows.


Now we've dropped a BoundingBox symbol onto the Btn movie. We need to make sure we create an instance name for the bounding box so that we can manage it later for use in a live-preview or even an exported movie just to make sure it doesn't get in the way of anything. I usually use "BoundingBox" as the instance name so that every class I built that is to become a custom component with a bounding box I can manage removing the bounding box in the actionscript regardless of the class. It's very important to have your BoundingBox object have a X and Y set to 0 !

IMPORTANT - Be sure to set the alpha to 0 on the bounding box's rectangle shape so that it doesn't appear in the live preview later or in the exported swf. The whole point of the bounding box is just the same as the attachMovie method in the MovieClip class - it intializes the size of the movie seeing as this cannot be done in the constructor function of the class that extends MovieClip.


Now it's time to make this symbol a component. Double click back on the stage to avoid confusion and then right-click the Btn symbol and click on Component Definition...


You need not enter anything here but the name of the class for this symbol. In our case just enter in "Btn" in the AS 2.0 Class field and just click OK.

NOTE: You must save your flash document as a .FLA before being able to declare custom classes as a component!


You'll see the Btn symbol in the library change from Type = MovieClip to Type = Component and a small block-like icon appear next to it - like a flashback from the BeOS icon-set. Now right-click again on the Btn symbol and click "Component Definition...". You'll see the [Inspectable] properties/parameters show up automatically. Now you have a custom lightweight component.


Notes: This is just a primer rundown of how to get started creating components. There is a healthy amount of assumed knowledge for those that might be trying to decipher this. But It's worth searching for tutorials on components regarding:

• The [Inspectable] and [Collection] tags.


• How to generate a Live Preview movie for your new custom component


• How to get around the issues with debugging and managing your Live Preview movie through the flash IDE


• How to setup your class parameters correctly when it comes to using the Flash IDE parameters explorer.


• This rundown is not remotely close to complete, and I'd say search away and do some research. I'll tell you now it's a fight right from the get go to get your custom components to do what you want - i.e. I could write a huge tutorial on just how to get the [Collection] tag working for a single parameter in your custom component.