Tutorial Two: The Color Picker

In this tutorial we will first use the Bean Patterns feature to build a JavaBeans component with three properties - red, green, and blue - which are used to set the background color. In Part Two, we will create a form incorporating this bean, which uses sliders to set these RGB values and display the resulting color.

Part One - Building a JavaBeans component

If you have not already done so, switch back to the GUI Editing Workspace. If you have just completed Tutorial One, you probably still have the Clock Form and Editor open - close these windows.

We will now create a new class from template and a package for that class at the same time.

Creating the class from template:

We will use Bean Patterns to create a JavaBeans component. The bean will have three properties - red, green and blue - and display these values as a background.

The Bean Patterns:

We will now need to manually add some code to the set methods of the color properties.

Adding code:

We would like to assign an icon to the ColorPreview bean. So we will need to generate its BeanInfo and in it specify the location of the icon.

The icon is already in the tutorial/colorpicker package, so we will copy it from there. Expand tutorial/colorpicker, right-click on the third node in the hierarchy (like the node above it, it is named ColorPreview), and choose Copy from its context menu. Then right-click on the examples/colorpicker node and choose Paste | Copy to put a copy of the icon into the package.

Generating BeanInfo
Compiling your bean:

We will now add our new bean to the Component Palette, where it will be available for use just like any standard component.

Add the new bean to the Component Palette:

This concludes Part One of the Color Picker tutorial. In Tutorial Two: Part Two, we will build a Form which uses this bean and allows background color to be set via sliders.

Beginning Prev Next