LIST BOXES: More Control. More Beauty!

List boxes are powerful and very customizable form objects. And their power is extended with 4D v19 R6 thanks to two new properties: horizontal and vertical padding (the inner margins or the space between an element’s content and its border). They will give new presentation possibilities to your list boxes, and an even more professional appearance to your interface, 

List Boxes: Horizontal and Vertical Padding 

These properties can be set globally for the whole list box or for each element like columns, headers, or footers.

Once defined for the list box, they will be applied to every sub-object of the list box by inheritance. But of course, each sub-object can have its own settings.

Before

After

Design mode

In design mode, they will appear in the list of properties under “Coordinates and sizing.” These settings will use values defined in pixels, just like many other properties. When these values are set to zero, the default system padding value will be applied (like in previous versions). Any additional values will be added to the system values (remember that negative values are not allowed).

Programming

Like most List box settings, they can be defined with the LISTBOX SET PROPERTY command thanks to two new constants, lk cell horizontal padding and lk cell vertical padding.

Code sample

(This is the code that has been used to create the “Before / After” pictures at the top of this article)

// Set Horizontal padding for the List box globally
LISTBOX SET PROPERTY(*; "LB"; lk cell horizontal padding; 6)
// Then Set a specific Horizontal padding for the footers
LISTBOX SET PROPERTY(*; "LB_Footer@"; lk cell horizontal padding; 16)
// Set vertical padding for the List box globally
LISTBOX SET PROPERTY(*; "LB"; lk cell vertical padding; 2)
// Then Set a specific vertical padding for the headers
LISTBOX SET PROPERTY(*; "LB_Header@"; lk cell vertical padding; 9)
// and a specific vertical padding for the footers
LISTBOX SET PROPERTY(*; "LB_Footer@"; lk cell vertical padding; 10)

CONCLUSION

These two new properties will bring you additional graphical sophistication for managing list boxes. Don’t hesitate to use them!

More details on the documentation center. And as always, feel free to get in touch on the 4D Forums.