Scaleform Clik Controls Buttonbar
ButtonBar
The ButtonBar class is a component that creates a navigable bar of buttons, which is commonly used in user interfaces.
This class is part of the Scaleform CLIK (Common Lightweight Interface Kit) controls and extends the UIComponent class to provide additional functionality for button navigation and management.
Class Details
- Package:
scaleform.clik.controls - Filename:
ButtonBar.as
Import Statements
The ButtonBar class imports several classes which are used within the code:
import flash.display.MovieClip;
import flash.events.Event;
import flash.system.ApplicationDomain;
import flash.text.TextFieldAutoSize;
import scaleform.clik.constants.InputValue;
import scaleform.clik.constants.InvalidationType;
import scaleform.clik.constants.NavigationCode;
import scaleform.clik.core.UIComponent;
import scaleform.clik.data.DataProvider;
import scaleform.clik.events.ButtonBarEvent;
import scaleform.clik.events.ButtonEvent;
import scaleform.clik.events.IndexEvent;
import scaleform.clik.events.InputEvent;
import scaleform.clik.interfaces.IDataProvider;
import scaleform.clik.ui.InputDetails;
Properties
| Property | Type | Description |
|---|---|---|
DIRECTION_HORIZONTAL |
String |
A constant for horizontal direction of the button bar. |
DIRECTION_VERTICAL |
String |
A constant for vertical direction of the button bar. |
_autoSize |
String |
Indicates how the button bar should auto-size. |
_buttonWidth |
Number |
The width of each button in the bar. |
_dataProvider |
IDataProvider |
The data provider for the button bar. |
_direction |
String |
The direction in which the buttons are laid out. |
_group |
ButtonGroup |
The group that the buttons belong to. |
_itemRenderer |
String |
The class name of the item renderer. |
_itemRendererClass |
Class |
The Class object of the item renderer. |
_labelField |
String |
The field of the data provider to use for button labels. |
_labelFunction |
Function |
A function used to determine the label for each button. |
_renderers |
Array |
An array of item renderer instances. |
_spacing |
Number |
The spacing between buttons in the bar. |
_selectedIndex |
Number |
The index of the currently selected button in the bar. |
container |
MovieClip |
The MovieClip container that holds the buttons. |
Methods
Constructor
public function ButtonBar()
- Initializes a new instance of the
ButtonBarclass.
Public Methods
function get dataProvider() : IDataProviderfunction set dataProvider(param1:IDataProvider) : voidfunction set itemRendererName(param1:String) : voidfunction get spacing() : Numberfunction set spacing(param1:Number) : voidfunction get direction() : Stringfunction set direction(param1:String) : voidfunction get autoSize() : Stringfunction set autoSize(param1:String) : voidfunction get buttonWidth() : Numberfunction set buttonWidth(param1:Number) : voidfunction get selectedIndex() : intfunction set selectedIndex(param1:int) : voidfunction get selectedItem() : Objectfunction get data() : Objectfunction get labelField() : Stringfunction set labelField(param1:String) : voidfunction get labelFunction() : Functionfunction set labelFunction(param1:Function) : voidfunction invalidateSettings() : voidfunction itemToLabel(param1:Object) : Stringfunction getButtonAt(param1:int) : Button
Protected Methods
function initialize() : voidfunction handleInput(param1:InputEvent) : voidfunction toString() : Stringfunction configUI() : voidfunction draw() : voidfunction refreshData() : voidfunction updateRenderers() : voidfunction populateData(param1:Array) : voidfunction populateRendererData(param1:Button, param2:uint) : voidfunction setupRenderer(param1:Button, param2:uint) : voidfunction handleButtonGroupChange(param1:Event) : voidfunction handleDataChange(param1:Event) : voidfunction changeFocus() : void
Events
Event.CHANGE: Dispatched when the data provider is changed.IndexEvent.INDEX_CHANGE: Dispatched when the selected index has changed.ButtonEvent.CLICK: Dispatched when a button within the group is clicked.ButtonBarEvent.BUTTON_SELECT: Dispatched when a button is selected.
📝 Remarks
- The class uses constants
DIRECTION_HORIZONTALandDIRECTION_VERTICALto determine the layout of buttons within the bar. - The
dataProviderproperty is used to populate the buttons with data. Data can come from any class that implements theIDataProviderinterface. - It uses an item renderer class (default is
"Button") to create the individual buttons. - The
ButtonBarclass supports auto-sizing, custom button widths, and manages button spacing. - It also includes functionality for handling button selection and focus management.
Example Usage:
var buttonBar:ButtonBar = new ButtonBar();
buttonBar.dataProvider = new DataProvider([ { label: "Home" }, { label: "Settings" }, { label: "About" } ]);
buttonBar.itemRendererName = "MyCustomButton";
buttonBar.direction = ButtonBar.DIRECTION_HORIZONTAL;
buttonBar.spacing = 5;
buttonBar.autoSize = TextFieldAutoSize.LEFT;
buttonBar.buttonWidth = 100;
addChild(buttonBar);
This will create a button bar with three buttons labeled “Home”, “Settings”, and “About”, using a custom button renderer class, laid out horizontally with 5 pixels spacing between each button, left auto-sizing, and a button width of 100 pixels.