Code Babble

ButtonBar components are a useful way to organize associated functionality. A benefit to using a spark ButtonBar is the ability to give a user a choice, but they may only choose one parameter at a time. This sample demonstrates using a ButtonBar component to change the visibility of a component, disable and enable multiple components, and switch between viewable components identified by the ButtonBar. Also, I have added a List component with color tiles which dynamically change the background of a spark BorderContainer since it is somewhat related to the ButtonBar method.

Below is the sample SWF file containing the examples:

Example 1 in the SWF above demonstrates the ability of the ButtonBar component to change other component's visibility. This would be a good way to hide something that a user may not need when using your application. It's a simple example, but can easily be modified to change the visibility of Panels, Containers, or even other buttons that may not be necessary for the user to complete their tasks.

Example 2 demonstrates using a custom skin for the ButtonBar and subsequently for each individual button associated with it. The cp1On and cp2On shown on the buttons are actually images I drew with the pencil in Photoshop as a quick example. The buttons correspond to the adjacent ColorPickers to enable cp1 while disabling cp2 and vice versa. This shows how you can enable certain functionality in an application while disabling other functionality or components without making it go away. 

Example 3 increases the amount of buttons while using the standard label property of the ButtonBar's inherent skin. The functionality of this ButtonBar is activated by choosing an object's name which corresponds to an image that is embedded in a ViewStack component. It also updates a RichText component with the associated text pertinent to the image.

Example 4 consist of a spark List component and a spark BorderContainer. The List contains elements associated by an ArrayCollection that renders the colors a user can change the BorderContainer's backgroundColor property to depending on their selection.

Below is the Flash Builder 4 project ZIP file for the SWF above which contains more in-depth explanations of the code:

Button Bar Disable Enable Example Zip File

This concludes this sample project.