The unit contains a ColorWheel and ValueBar component

.

Using the components:

Normally, you use both a color wheel and a value bar.

  1. Put a color wheel on your form.
  2. Put a value bar on your form beside the wheel.
  3. Set the ColorWheel's ValueBar property to the ValueBar component you just put on the form.

The two components are now linked together. When a selection is made in the color wheel the value bar will update to show the range for that selection.

Note: you won't see the colors in the UI Designer. Colors will only be displayed at runtime.

Reading and setting the color:

To set the color being displayed, use the TfpgColorWheel.SetSelectedColor method.

To read the color selected, read the TfpgValueBar.SelectedColor property.

If you want to know when the user picks a color, you can use the OnChange event in the ValueBar.

A colorwheel component. This component draws a ColorWheel at runtime. This allows the user to select the Hue and Saturation values in the HSV color range. Size of the crosshair. If the cursor size is set too big it will just 'clip' to the edge of the control. You can use this effect to get full cross hairs by making the CursorSize large. The width of the black area around the wheel.

The margin is there so that when the cross hair is on the edge of the wheel, the complete cross hair can be drawn, without being clipped. It makes selecting colors on the edge of the colorwheel easier.

If the margin is set too large, the colorwheel will not be drawn / displayed.

The percentage from the centre of the wheel. The percentage of the radius from the centre of the wheel, that is held for pure white.This makes it possible to easily select the color white. The percentage range is 0% - 50% of the colorwheel. The cross hair will also snap to the centre of the wheel when it enters this radius range. This event is triggered when a new color has been selected in the wheel. Used to link the ColorWheel to the ValueBar component. Hue value of selected color. Saturation value of selected color. Sets a new color value programatically. A ValueBar component. At runtime, this component draws a ValueBar. It allows the user to select the brightness (Value) color in the HSV colorspace. This components works with the TfpgColorWheel component to set the full HSV color values. Currently selected Value The Value color range is from 0.0 to 1.0, where 0 is black and 1 is the brightest. The selected HSV color but in TfpgColor format. Margin width around the ValueBar. Event is triggered when a new color is selected. The height of the selection cursor. Sets the Hue and Saturation values. This method is normally called by the component. These components work together to specify the full HSV color.