Minimal Comps Tutorial #1

Getting Started

The first thing you want to do is get the components. Go here: http://code.google.com/p/minimalcomps/. There are a few options:

  1. Download the SWC and add it to your project. This now works for Flash CS4 as well as Flex Builder / Flash Builder.
  2. Download the zipped source and add it to your project - either CS4 or Flash/Flex Builder.
  3. Check out the source with SVN and add it to your project as above.

I'm going to assume you know how to add a SWC or a class path to a project in your tool of choice. If you are using Flash CS3, you'll have to manually embed the font that the components use. This page will give you a hand doing that. But if you are using CS4 (or later), it should get embedded when you include the SWC or source files in your project.

Using the Components

Whenever you instantiate a UI control, there's usually a set routine of things you do with it each and every time.

  1. Instantiate the control.
  2. Add it to the display list.
  3. Position it.
  4. For components with a label or text, set the text.
  5. Assign some event listener to it so you can respond to user gestures with it.

This can take up to six lines of code. I thought, "Why not do it in one?" Almost every Minimal Comp has the same three initial parameters in its constructor: the parent display object to add the component to, and the x, y position to place it. For components that need text, you can usually pass a string in as the fourth parameter. And the final parameter is usually the default event handler for that component - CLICK for a button, CHANGE for a slider, etc. Thus, to create a fully functional button, add it to the display list, position it, give it a label and a click handler, you just say this:

new PushButton(this, 100, 100, "Click me", onBtnClick);

If you don't need a reference to the component for later use, you don't even have to save it in a variable. This is quite often the case, as you do most of the customization right in the constructor.

Summary

That's about all you need to know to get started. Yeah, they are that simple. Take a look at the documentation to see what else you can do with them.