skip to main content
OpenEdge Development: AppBuilder
Frequently Used Dialogs : Colors selector and editor
 
Colors selector and editor
The button shown is available in the Property Sheet, where relevant:
Almost every object with a visible run-time representation has a foreground and background color that you can set. Whether your settings will override any system defaults is platform-dependent. For example, you can set the title color for a frame object, but such settings have no effect under Windows.
It is good usability practice to be sparing with color. Too much color, or too many colors, can create a recreational or even childlike impression on the user. This might not be the most desirable outcome, if your application is one for office use. But you need not avoid color changes altogether. Used carefully, special color changes can help focus the user's attention in appropriate ways. This improves the usability of your product and, often, its marketability. Careful use of color can also be a defining element in a corporate identity program, allowing you to create semicustom software packages with little extra effort.
ABL widgets that display data use the foreground and background colors for that purpose. They display their data in the foreground color against the background color. In the case of data browser widgets, you can also choose a color for the internal lines separating rows and columns.
ABL widgets such as the rectangle use the foreground color for their border, and the background color for the fill, if filled.
Choosing colors
Select colors with the Color Selector dialog box.
To set foreground and background data colors for an object:
1. Select the object and choose ToolsColor, or open the property sheet and click Colors (the crayons). The Choose Color dialog box opens:
Sixteen colors remains the baseline standard under Windows, and those colors occupy slots 0 through 15 in the OpenEdge color table. The boxes labeled with the Unknown value (?) represent the default colors for the object. The default colors are those assigned by the object's parent, but are most often the colors shown in the example: black (slot 0) foreground and light gray (slot 8) background.
2. Click on a new color for the desired context. If you wish to use a color not in the default set, see the “Defining new colors” section.
3. If the object whose colors you are changing must be readable (text, instrumentation, graphs, etc.), verify that you have chosen a good combination by examining the text in the Sample rectangle.
Text is always less readable on a monitor than on paper, so it is good practice to change your design choices rather than compromise readability. While good contrast is the most important factor over which you have some control, other factors also come into play, including font size and style. There are also other factors in play over which you as the programmer have no control—the characteristics of the eventual user's monitor being the most important. For this reason, you should choose the most highly readable combinations whenever possible.
Defining new colors
The default Windows color table has only 16 slots (4 bits/pixel). AppBuilder's color table has a total of 256 slots, numbered 0 through 255. Only slots 0 through 15 have colors defined on them by default, and those colors match the default Windows set, as shown in Table 14.
 
Table 14: ABL color table
Slot
ABL color name
Red-Green-Blue (RGB) values
 
 
Decimal
Hex
0
Black
0
0
0
0
0
0
1
Dark Blue
0
0
128
0
0
80
2
Dark Green
0
128
0
0
80
0
3
Blue Green
0
128
128
0
80
80
4
Red
128
0
0
80
0
0
5
Purple
128
0
128
80
0
80
6
Olive
128
128
0
80
80
00
7
Gray
128
128
128
80
80
80
8
Light Gray
192
192
192
C0
C0
C0
9
Blue
0
0
255
00
00
FF
10
Green
0
255
0
00
FF
00
11
Turquoise
0
255
255
00
FF
FF
12
Red
255
0
0
FF
00
00
13
Pink
255
0
255
FF
00
FF
14
Yellow
255
255
0
FF
FF
00
15
White
255
255
255
FF
FF
FF
You can increase the colors available to your application—for example, to create a special corporate color scheme—by defining colors on slots 16 through 255 (16 through 127 for character mode), although not all objects can accept colors from slots above 15. You can also change the colors defined for slots 0 through 15 (for example, substituting a green for a red), though for compatibility reasons this is discouraged.
Note that changes made to the color table are permanent the moment they are made. Clicking Cancel does not discard the changes. To restore earlier colors, you must recreate them.
To add a new color to the table:
1. Click the arrowhead button to bring the next set of 16 color slots into view. They are all defined as black, initially.
2. Double-click the first undefined slot (slot 16, unless you have already defined additional colors for this application, or for another application during this OpenEdge session). It does not matter whether you click the foreground or the background slot—they are really the same slot, and when you define a color, it appears in both places. The standard Windows color-editor dialog box opens, as shown:
3. If none of the existing colors meets your needs, you can modify any or all of the 16 colors in the Custom colors bank. These are not the same 16 colors that appear in the default slots. Click on the color you wish to modify.
The color in that cell will immediately appear in the large color/solid swatch, its HSL and RGB values (HSL and RGB are just different color-notation schemes) appears in the readouts, and the cursors showing where the color is in the color space will reposition themselves appropriately, as shown:
4. To create the new color, you can:
*Move the cursors to new positions in the rainbow color space. The larger space represents the qualities of Hue (red, green, etc.) and saturation/intensity (bright, rich color versus muted, grayish color). The long, narrow space to the right represents luminance or value (in paint or printer's ink, the amount of white or black (but not both) in the color; on a monitor, the amount of energy exciting the phosphor).
*Set the HSL or RGB values explicitly. This is a particularly useful method if you are trying to work to a known standard, or reproduce colors for which you know those values.
5. When the color is correct, click Add to Custom Colors to preserve it, as shown:
6. If you wish to define additional custom colors, select another Custom Color cell and repeat Step 4 and Step 5. When you are finished, select a color cell and click OK. The color editor dialog box closes, and the selected color is assigned to the color table.