Flamingo component suite 3.0 – command button panel

December 14th, 2007

Flamingo component suite comes with a flexible and powerful component that hosts command buttons, providing support for button groups, single selection mode (for toggle command buttons), same icon state / dimension and automatic column layout. The official documentation for the base command button panel and file viewer panel have the detailed walkthroughs, and here i will give a short overview of some of the main features.

As noted earlier, one of Flamingo’s goals is to provide a small and cohesive set of powerful UI components that allow creating modern applications that provide visual functionality similar to or superseding that of Vista Explorer and Office 2007. The command button panel and its extension, file viewer panel, address the functionality commonly found in file explorer applications.

Here is a simple file explorer that uses the breadcrumb bar and file viewer panel with button state set to medium:

Here, the icon for image files come from the file itself (thumbnails), while the icons for other mimetypes are taken from the latest SVN snapshot of the KDE Oxygen project.

Here is the same exact application with big icons:

The icons are properly scaled and the inner layout of the buttons changed to reflect the new button state. What about custom large icons?

The same functionality, only controlled by the flexible slider (on the left hand side of the application frame). Note that the bottom-right button has the icon based on the actual JPG contents (scaled down), while the other three buttons sport resolution-independent sharp visuals from Oxygen SVG images.

Here is the same application under the tiled state – with extra line of information on each file:

The last screenshot is from a sample SVN browser that uses the same icon computation approach, tiled state and extra line of information on each file (fetched from the SVN repository and set on the corresponding command button):

You’re welcome to play with the latest 3.0dev drop of Flamingo and read the detailed documentation on command button panel and file viewer panel.