Package | feathers.controls |
Class | public class TabBar |
Inheritance | TabBar ![]() ![]() |
The following example sets the data provider, selects the second tab, and listens for when the selection changes:
var tabs:TabBar = new TabBar(); tabs.dataProvider = new ListCollection( [ { label: "One" }, { label: "Two" }, { label: "Three" }, ]); tabs.selectedIndex = 1; tabs.addEventListener( Event.CHANGE, tabs_changeHandler ); this.addChild( tabs );
See also
Property | Defined By | ||
---|---|---|---|
customFirstTabName : String
DEPRECATED: Replaced by customFirstTabStyleName. | TabBar | ||
customFirstTabStyleName : String
A style name to add to the first tab in this tab bar. | TabBar | ||
customLastTabName : String
DEPRECATED: Replaced by customLastTabStyleName. | TabBar | ||
customLastTabStyleName : String
A style name to add to the last tab in this tab bar. | TabBar | ||
customTabName : String
DEPRECATED: Replaced by customTabStyleName. | TabBar | ||
customTabStyleName : String
A style name to add to all tabs in this tab bar. | TabBar | ||
dataProvider : ListCollection
The collection of data to be displayed with tabs. | TabBar | ||
![]() | defaultTextEditorFactory : Function [static]
A function used by all UI controls that support text editor to
create an ITextEditor instance. | FeathersControl | |
![]() | defaultTextRendererFactory : Function [static]
A function used by all UI controls that support text renderers to
create an ITextRenderer instance. | FeathersControl | |
![]() | depth : int [read-only]
The component's depth in the display list, relative to the stage. | FeathersControl | |
direction : String
The tab bar layout is either vertical or horizontal. | TabBar | ||
distributeTabSizes : Boolean
If true, the tabs will be equally sized in the direction
of the layout. | TabBar | ||
firstGap : Number
Space, in pixels, between the first two tabs. | TabBar | ||
firstTabFactory : Function
Creates a new first tab. | TabBar | ||
![]() | focusIndicatorSkin : DisplayObject
If this component supports focus, this optional skin will be
displayed above the component when showFocus() is
called. | FeathersControl | |
![]() | focusManager : IFocusManager | FeathersControl | |
![]() | focusOwner : IFocusDisplayObject | FeathersControl | |
![]() | focusPadding : Number
Quickly sets all focus padding properties to the same value. | FeathersControl | |
![]() | focusPaddingBottom : Number
The minimum space, in pixels, between the object's bottom edge and the
bottom edge of the focus indicator skin. | FeathersControl | |
![]() | focusPaddingLeft : Number
The minimum space, in pixels, between the object's left edge and the
left edge of the focus indicator skin. | FeathersControl | |
![]() | focusPaddingRight : Number
The minimum space, in pixels, between the object's right edge and the
right edge of the focus indicator skin. | FeathersControl | |
![]() | focusPaddingTop : Number
The minimum space, in pixels, between the object's top edge and the
top edge of the focus indicator skin. | FeathersControl | |
gap : Number
Space, in pixels, between tabs. | TabBar | ||
globalStyleProvider : IStyleProvider [static]
The default IStyleProvider for all TabBar
components. | TabBar | ||
![]() | height : Number [override]
The height of the component, in pixels. | FeathersControl | |
horizontalAlign : String
Determines how the tabs are horizontally aligned within the bounds
of the tab bar (on the x-axis). | TabBar | ||
![]() | includeInLayout : Boolean
Determines if the ILayout should use this object or ignore it. | FeathersControl | |
![]() | isCreated : Boolean [read-only]
Determines if the component has been initialized and validated for
the first time. | FeathersControl | |
![]() | isEnabled : Boolean
Indicates whether the control is interactive or not. | FeathersControl | |
![]() | isFocusEnabled : Boolean | FeathersControl | |
![]() | isInitialized : Boolean [read-only]
Determines if the component has been initialized yet. | FeathersControl | |
![]() | isQuickHitAreaEnabled : Boolean
Similar to mouseChildren on the classic display list. | FeathersControl | |
lastGap : Number
Space, in pixels, between the last two tabs. | TabBar | ||
lastTabFactory : Function
Creates a new last tab. | TabBar | ||
![]() | layoutData : ILayoutData
Extra parameters associated with this display object that will be
used by the layout algorithm. | FeathersControl | |
![]() | maxHeight : Number
The maximum recommended height to be used for self-measurement and,
optionally, by any code that is resizing this component. | FeathersControl | |
![]() | maxWidth : Number
The maximum recommended width to be used for self-measurement and,
optionally, by any code that is resizing this component. | FeathersControl | |
![]() | minHeight : Number
The minimum recommended height to be used for self-measurement and,
optionally, by any code that is resizing this component. | FeathersControl | |
![]() | minTouchHeight : Number
If using isQuickHitAreaEnabled, and the hit area's
height is smaller than this value, it will be expanded. | FeathersControl | |
![]() | minTouchWidth : Number
If using isQuickHitAreaEnabled, and the hit area's
width is smaller than this value, it will be expanded. | FeathersControl | |
![]() | minWidth : Number
The minimum recommended width to be used for self-measurement and,
optionally, by any code that is resizing this component. | FeathersControl | |
![]() | nextTabFocus : IFocusDisplayObject | FeathersControl | |
padding : Number
Quickly sets all padding properties to the same value. | TabBar | ||
paddingBottom : Number
The minimum space, in pixels, between the tab bar's bottom edge and
the tabs. | TabBar | ||
paddingLeft : Number
The minimum space, in pixels, between the tab bar's left edge and the
tabs. | TabBar | ||
paddingRight : Number
The minimum space, in pixels, between the tab bar's right edge and
the tabs. | TabBar | ||
paddingTop : Number
The minimum space, in pixels, between the tab bar's top edge and the
tabs. | TabBar | ||
![]() | previousTabFocus : IFocusDisplayObject | FeathersControl | |
selectedIndex : int
The index of the currently selected tab. | TabBar | ||
selectedItem : Object
The currently selected item from the data provider. | TabBar | ||
![]() | styleName : String
The concatenated styleNameList, with values separated
by spaces. | FeathersControl | |
![]() | styleNameList : TokenList [read-only]
Contains a list of all "styles" assigned to this control. | FeathersControl | |
![]() | styleProvider : IStyleProvider
When a component initializes, a style provider may be used to set
properties that affect the component's visual appearance. | FeathersControl | |
tabFactory : Function
Creates a new tab. | TabBar | ||
tabInitializer : Function
Modifies the properties of an individual tab, using an item from the
data provider. | TabBar | ||
tabProperties : Object
An object that stores properties for all of the tab bar's tabs, and
the properties will be passed down to every tab when the tab bar
validates. | TabBar | ||
verticalAlign : String
Determines how the tabs are vertically aligned within the bounds
of the tab bar (on the y-axis). | TabBar | ||
![]() | width : Number [override]
The width of the component, in pixels. | FeathersControl |
Property | Defined By | ||
---|---|---|---|
![]() | actualHeight : Number = 0
The final height value that should be used for layout. | FeathersControl | |
![]() | actualWidth : Number = 0
The final width value that should be used for layout. | FeathersControl | |
![]() | defaultStyleProvider : IStyleProvider [read-only]
When the FeathersControl constructor is called, the
globalStyleProvider property is set to this value. | FeathersControl | |
![]() | explicitHeight : Number = NaN
The height value explicitly set by calling the height setter or
setSize(). | FeathersControl | |
![]() | explicitWidth : Number = NaN
The width value explicitly set by calling the width setter or
setSize(). | FeathersControl | |
firstTabName : String
DEPRECATED: Replaced by firstTabStyleName. | TabBar | ||
firstTabStyleName : String = feathers-tab-bar-tab
The value added to the styleNameList of the first tab. | TabBar | ||
lastTabName : String
DEPRECATED: Replaced by lastTabStyleName. | TabBar | ||
lastTabStyleName : String = feathers-tab-bar-tab
The value added to the styleNameList of the last tab. | TabBar | ||
tabName : String
DEPRECATED: Replaced by tabStyleName. | TabBar | ||
tabStyleName : String = feathers-tab-bar-tab
The value added to the styleNameList of the tabs. | TabBar | ||
toggleGroup : ToggleGroup
The toggle group. | TabBar |
Method | Defined By | ||
---|---|---|---|
TabBar()
Constructor. | TabBar | ||
![]() | hideFocus():void
If the visual indicator of focus has been displayed by
showFocus(), call this function to hide it. | FeathersControl | |
![]() | invalidate(flag:String):void
Call this function to tell the UI control that a redraw is pending. | FeathersControl | |
![]() | isInvalid(flag:String = null):Boolean
Indicates whether the control is pending validation or not. | FeathersControl | |
![]() | move(x:Number, y:Number):void
Sets both the x and the y positions of the control in a single
function call. | FeathersControl | |
![]() | setSize(width:Number, height:Number):void
Sets both the width and the height of the control in a single
function call. | FeathersControl | |
![]() | showFocus():void
If the object has focus, an additional visual indicator may
optionally be displayed to highlight the object. | FeathersControl | |
![]() | validate():void
Immediately validates the display object, if it is invalid. | FeathersControl |
Event | Summary | Defined By | ||
---|---|---|---|---|
Dispatched when the selected tab changes. | TabBar | |||
![]() | Dispatched after the component has validated for the first time. | FeathersControl | ||
![]() | Dispatched after initialize() has been called, but before the first time that draw() has been called. | FeathersControl | ||
![]() | Dispatched when the width or height of the control changes. | FeathersControl |
Constant | Defined By | ||
---|---|---|---|
DEFAULT_CHILD_NAME_TAB : String = feathers-tab-bar-tab [static]
DEPRECATED: Replaced by TabBar.DEFAULT_CHILD_STYLE_NAME_TAB. | TabBar | ||
DEFAULT_CHILD_STYLE_NAME_TAB : String = feathers-tab-bar-tab [static]
The default value added to the styleNameList of the tabs. | TabBar | ||
DIRECTION_HORIZONTAL : String = horizontal [static]
The tabs are displayed in order from left to right. | TabBar | ||
DIRECTION_VERTICAL : String = vertical [static]
The tabs are displayed in order from top to bottom. | TabBar | ||
HORIZONTAL_ALIGN_CENTER : String = center [static]
The tabs will be aligned horizontally to the center of the tab bar. | TabBar | ||
HORIZONTAL_ALIGN_JUSTIFY : String = justify [static]
If the direction is vertical, each tab will fill the entire width of
the tab bar, and if the direction is horizontal, the alignment will
behave the same as HORIZONTAL_ALIGN_LEFT. | TabBar | ||
HORIZONTAL_ALIGN_LEFT : String = left [static]
The tabs will be aligned horizontally to the left edge of the tab
bar. | TabBar | ||
HORIZONTAL_ALIGN_RIGHT : String = right [static]
The tabs will be aligned horizontally to the right edge of the tab
bar. | TabBar | ||
![]() | INVALIDATION_FLAG_ALL : String = all [static]
Flag to indicate that everything is invalid and should be redrawn. | FeathersControl | |
![]() | INVALIDATION_FLAG_DATA : String = data [static]
Invalidation flag to indicate that the primary data displayed by the
UI control has changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_FOCUS : String = focus [static]
Invalidation flag to indicate that the focus of the UI control has
changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_LAYOUT : String = layout [static]
Invalidation flag to indicate that the layout of the UI control has
changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_SCROLL : String = scroll [static]
Invalidation flag to indicate that the scroll position of the UI
control has changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_SELECTED : String = selected [static]
Invalidation flag to indicate that the selection of the UI control
has changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_SIZE : String = size [static]
Invalidation flag to indicate that the dimensions of the UI control
have changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_SKIN : String = skin [static]
Invalidation flag to indicate that the skin of the UI control has changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_STATE : String = state [static]
Invalidation flag to indicate that the state has changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_STYLES : String = styles [static]
Invalidation flag to indicate that the styles or visual appearance of
the UI control has changed. | FeathersControl | |
VERTICAL_ALIGN_BOTTOM : String = bottom [static]
The tabs will be aligned vertically to the bottom edge of the tab
bar. | TabBar | ||
VERTICAL_ALIGN_JUSTIFY : String = justify [static]
If the direction is horizontal, each tab will fill the entire height
of the tab bar. | TabBar | ||
VERTICAL_ALIGN_MIDDLE : String = middle [static]
The tabs will be aligned vertically to the middle of the tab bar. | TabBar | ||
VERTICAL_ALIGN_TOP : String = top [static]
The tabs will be aligned vertically to the top edge of the tab bar. | TabBar |
customFirstTabName | property |
customFirstTabName:String
DEPRECATED: Replaced by customFirstTabStyleName
.
DEPRECATION WARNING: This property is deprecated starting with Feathers 2.1. It will be removed in a future version of Feathers according to the standard Feathers deprecation policy.
public function get customFirstTabName():String
public function set customFirstTabName(value:String):void
See also
customFirstTabStyleName | property |
customFirstTabStyleName:String
A style name to add to the first tab in this tab bar. Typically used by a theme to provide different styles to the first tab.
In the following example, a custom first tab style name is provided to the tab bar:
tabs.customFirstTabStyleName = "my-custom-first-tab";
In your theme, you can target this sub-component style name to provide different styles than the default:
getStyleProviderForClass( ToggleButton ).setFunctionForStyleName( "my-custom-first-tab", setCustomFirstTabStyles );
The default value is null
.
public function get customFirstTabStyleName():String
public function set customFirstTabStyleName(value:String):void
See also
customLastTabName | property |
customLastTabName:String
DEPRECATED: Replaced by customLastTabStyleName
.
DEPRECATION WARNING: This property is deprecated starting with Feathers 2.1. It will be removed in a future version of Feathers according to the standard Feathers deprecation policy.
public function get customLastTabName():String
public function set customLastTabName(value:String):void
See also
customLastTabStyleName | property |
customLastTabStyleName:String
A style name to add to the last tab in this tab bar. Typically used by a theme to provide different styles to the last tab.
In the following example, a custom last tab style name is provided to the tab bar:
tabs.customLastTabStyleName = "my-custom-last-tab";
In your theme, you can target this sub-component style name to provide different styles than the default:
getStyleProviderForClass( ToggleButton ).setFunctionForStyleName( "my-custom-last-tab", setCustomLastTabStyles );
The default value is null
.
public function get customLastTabStyleName():String
public function set customLastTabStyleName(value:String):void
See also
customTabName | property |
customTabName:String
DEPRECATED: Replaced by customTabStyleName
.
DEPRECATION WARNING: This property is deprecated starting with Feathers 2.1. It will be removed in a future version of Feathers according to the standard Feathers deprecation policy.
public function get customTabName():String
public function set customTabName(value:String):void
See also
customTabStyleName | property |
customTabStyleName:String
A style name to add to all tabs in this tab bar. Typically used by a theme to provide different styles to different tab bars.
In the following example, a custom tab style name is provided to the tab bar:
tabs.customTabStyleName = "my-custom-tab";
In your theme, you can target this sub-component style name to provide different styles than the default:
getStyleProviderForClass( ToggleButton ).setFunctionForStyleName( "my-custom-tab", setCustomTabStyles );
The default value is null
.
public function get customTabStyleName():String
public function set customTabStyleName(value:String):void
See also
dataProvider | property |
dataProvider:ListCollection
The collection of data to be displayed with tabs. The default tab initializer interprets this data to customize the tabs with various fields available to buttons, including the following:
The following example passes in a data provider:
list.dataProvider = new ListCollection( [ { label: "General", defaultIcon: new Image( generalTexture ) }, { label: "Security", defaultIcon: new Image( securityTexture ) }, { label: "Advanced", defaultIcon: new Image( advancedTexture ) }, ]);
The default value is null
.
public function get dataProvider():ListCollection
public function set dataProvider(value:ListCollection):void
See also
direction | property |
direction:String
The tab bar layout is either vertical or horizontal.
In the following example, the tab bar's direction is set to vertical:
tabs.direction = TabBar.DIRECTION_VERTICAL;
The default value is TabBar.DIRECTION_HORIZONTAL
.
public function get direction():String
public function set direction(value:String):void
See also
distributeTabSizes | property |
distributeTabSizes:Boolean
If true
, the tabs will be equally sized in the direction
of the layout. In other words, if the tab bar is horizontal, each tab
will have the same width, and if the tab bar is vertical, each tab
will have the same height. If false
, the tabs will be
sized to their ideal dimensions.
The following example aligns the tabs to the middle without distributing them:
tabs.direction = TabBar.DIRECTION_VERTICAL; tabs.verticalAlign = TabBar.VERTICAL_ALIGN_MIDDLE; tabs.distributeTabSizes = false;
The default value is true
.
public function get distributeTabSizes():Boolean
public function set distributeTabSizes(value:Boolean):void
firstGap | property |
firstGap:Number
Space, in pixels, between the first two tabs. If NaN
,
the default gap
property will be used.
The following example sets the gap between the first and second tab to a different value than the standard gap:
tabs.firstGap = 30; tabs.gap = 20;
The default value is NaN
.
public function get firstGap():Number
public function set firstGap(value:Number):void
See also
firstTabFactory | property |
firstTabFactory:Function
Creates a new first tab. If the firstTabFactory
is
null
, then the tab bar will use the tabFactory
.
The first tab must be an instance of ToggleButton
. This
factory can be used to change properties on the first tab when it
is first created. For instance, if you are skinning Feathers
components without a theme, you might use this factory to set skins
and other styles on the first tab.
This function is expected to have the following signature:
function():ToggleButton
In the following example, a custom first tab factory is passed to the tab bar:
tabs.firstTabFactory = function():ToggleButton { var tab:ToggleButton = new ToggleButton(); tab.defaultSkin = new Image( upTexture ); tab.defaultSelectedSkin = new Image( selectedTexture ); tab.downSkin = new Image( downTexture ); return tab; };
The default value is null
.
public function get firstTabFactory():Function
public function set firstTabFactory(value:Function):void
See also
firstTabName | property |
firstTabName:String
DEPRECATED: Replaced by firstTabStyleName
.
DEPRECATION WARNING: This property is deprecated starting with Feathers 2.1. It will be removed in a future version of Feathers according to the standard Feathers deprecation policy.
protected function get firstTabName():String
protected function set firstTabName(value:String):void
See also
firstTabStyleName | property |
protected var firstTabStyleName:String = feathers-tab-bar-tab
The value added to the styleNameList
of the first tab.
This variable is protected
so that sub-classes can
customize the first tab style name in their constructors instead of
using the default style name defined by
DEFAULT_CHILD_STYLE_NAME_TAB
.
To customize the first tab name without subclassing, see
customFirstTabName
.
See also
gap | property |
gap:Number
Space, in pixels, between tabs.
In the following example, the tab bar's gap is set to 20 pixels:
tabs.gap = 20;
The default value is 0
.
public function get gap():Number
public function set gap(value:Number):void
globalStyleProvider | property |
public static var globalStyleProvider:IStyleProvider
The default IStyleProvider
for all TabBar
components.
The default value is null
.
See also
horizontalAlign | property |
horizontalAlign:String
Determines how the tabs are horizontally aligned within the bounds of the tab bar (on the x-axis).
The following example aligns the tabs to the left:
tabs.horizontalAlign = TabBar.HORIZONTAL_ALIGN_LEFT;
The default value is TabBar.HORIZONTAL_ALIGN_JUSTIFY
.
public function get horizontalAlign():String
public function set horizontalAlign(value:String):void
See also
lastGap | property |
lastGap:Number
Space, in pixels, between the last two tabs. If NaN
,
the default gap
property will be used.
The following example sets the gap between the last and next to last tab to a different value than the standard gap:
tabs.lastGap = 30; tabs.gap = 20;
The default value is NaN
.
public function get lastGap():Number
public function set lastGap(value:Number):void
See also
lastTabFactory | property |
lastTabFactory:Function
Creates a new last tab. If the lastTabFactory
is
null
, then the tab bar will use the tabFactory
.
The last tab must be an instance of Button
. This
factory can be used to change properties on the last tab when it
is first created. For instance, if you are skinning Feathers
components without a theme, you might use this factory to set skins
and other styles on the last tab.
This function is expected to have the following signature:
function():ToggleButton
In the following example, a custom last tab factory is passed to the tab bar:
tabs.lastTabFactory = function():ToggleButton { var tab:ToggleButton = new Button(); tab.defaultSkin = new Image( upTexture ); tab.defaultSelectedSkin = new Image( selectedTexture ); tab.downSkin = new Image( downTexture ); return tab; };
The default value is null
.
public function get lastTabFactory():Function
public function set lastTabFactory(value:Function):void
See also
lastTabName | property |
lastTabName:String
DEPRECATED: Replaced by lastTabStyleName
.
DEPRECATION WARNING: This property is deprecated starting with Feathers 2.1. It will be removed in a future version of Feathers according to the standard Feathers deprecation policy.
protected function get lastTabName():String
protected function set lastTabName(value:String):void
See also
lastTabStyleName | property |
protected var lastTabStyleName:String = feathers-tab-bar-tab
The value added to the styleNameList
of the last tab.
This variable is protected
so that sub-classes can
customize the last tab style name in their constructors instead of
using the default style name defined by
DEFAULT_CHILD_STYLE_NAME_TAB
.
To customize the last tab name without subclassing, see
customLastTabName
.
See also
padding | property |
padding:Number
Quickly sets all padding properties to the same value. The
padding
getter always returns the value of
paddingTop
, but the other padding values may be
different.
In the following example, the padding of all sides of the tab bar is set to 20 pixels:
tabs.padding = 20;
The default value is 0
.
public function get padding():Number
public function set padding(value:Number):void
See also
paddingBottom | property |
paddingBottom:Number
The minimum space, in pixels, between the tab bar's bottom edge and the tabs.
In the following example, the padding on the bottom edge of the tab bar is set to 20 pixels:
tabs.paddingBottom = 20;
The default value is 0
.
public function get paddingBottom():Number
public function set paddingBottom(value:Number):void
paddingLeft | property |
paddingLeft:Number
The minimum space, in pixels, between the tab bar's left edge and the tabs.
In the following example, the padding on the left edge of the tab bar is set to 20 pixels:
tabs.paddingLeft = 20;
The default value is 0
.
public function get paddingLeft():Number
public function set paddingLeft(value:Number):void
paddingRight | property |
paddingRight:Number
The minimum space, in pixels, between the tab bar's right edge and the tabs.
In the following example, the padding on the right edge of the tab bar is set to 20 pixels:
tabs.paddingRight = 20;
The default value is 0
.
public function get paddingRight():Number
public function set paddingRight(value:Number):void
paddingTop | property |
paddingTop:Number
The minimum space, in pixels, between the tab bar's top edge and the tabs.
In the following example, the padding on the top edge of the tab bar is set to 20 pixels:
tabs.paddingTop = 20;
The default value is 0
.
public function get paddingTop():Number
public function set paddingTop(value:Number):void
selectedIndex | property |
selectedIndex:int
The index of the currently selected tab. Returns -1 if no tab is selected.
In the following example, the tab bar's selected index is changed:
tabs.selectedIndex = 2;
The following example listens for when selection changes and requests the selected index:
function tabs_changeHandler( event:Event ):void { var tabs:TabBar = TabBar( event.currentTarget ); var index:int = tabs.selectedIndex; } tabs.addEventListener( Event.CHANGE, tabs_changeHandler );
The default value is -1
.
public function get selectedIndex():int
public function set selectedIndex(value:int):void
See also
selectedItem | property |
selectedItem:Object
The currently selected item from the data provider. Returns
null
if no item is selected.
In the following example, the tab bar's selected item is changed:
tabs.selectedItem = tabs.dataProvider.getItemAt(2);
The following example listens for when selection changes and requests the selected item:
function tabs_changeHandler( event:Event ):void { var tabs:TabBar = TabBar( event.currentTarget ); var item:Object = tabs.selectedItem; } tabs.addEventListener( Event.CHANGE, tabs_changeHandler );
The default value is null
.
public function get selectedItem():Object
public function set selectedItem(value:Object):void
See also
tabFactory | property |
tabFactory:Function
Creates a new tab. A tab must be an instance of ToggleButton
.
This factory can be used to change properties on the tabs when they
are first created. For instance, if you are skinning Feathers
components without a theme, you might use this factory to set skins
and other styles on a tab.
This function is expected to have the following signature:
function():ToggleButton
In the following example, a custom tab factory is passed to the tab bar:
tabs.tabFactory = function():ToggleButton { var tab:ToggleButton = new ToggleButton(); tab.defaultSkin = new Image( upTexture ); tab.defaultSelectedSkin = new Image( selectedTexture ); tab.downSkin = new Image( downTexture ); return tab; };
The default value is null
.
public function get tabFactory():Function
public function set tabFactory(value:Function):void
See also
tabInitializer | property |
tabInitializer:Function
Modifies the properties of an individual tab, using an item from the data provider. The default initializer will set the tab's label and icons. A custom tab initializer can be provided to update additional properties or to use different field names in the data provider.
This function is expected to have the following signature:
function( tab:ToggleButton, item:Object ):void
In the following example, a custom tab initializer is passed to the tab bar:
tabs.tabInitializer = function( tab:ToggleButton, item:Object ):void { tab.label = item.text; tab.defaultIcon = item.icon; };
public function get tabInitializer():Function
public function set tabInitializer(value:Function):void
See also
tabName | property |
tabName:String
DEPRECATED: Replaced by tabStyleName
.
DEPRECATION WARNING: This property is deprecated starting with Feathers 2.1. It will be removed in a future version of Feathers according to the standard Feathers deprecation policy.
protected function get tabName():String
protected function set tabName(value:String):void
See also
tabProperties | property |
tabProperties:Object
An object that stores properties for all of the tab bar's tabs, and
the properties will be passed down to every tab when the tab bar
validates. For a list of available properties, refer to
feathers.controls.ToggleButton
.
These properties are shared by every tab, so anything that cannot
be shared (such as display objects, which cannot be added to multiple
parents) should be passed to tabs using the tabFactory
or in the theme.
If the subcomponent has its own subcomponents, their properties
can be set too, using attribute @
notation. For example,
to set the skin on the thumb which is in a SimpleScrollBar
,
which is in a List
, you can use the following syntax:
list.verticalScrollBarProperties.@thumbProperties.defaultSkin = new Image(texture);
Setting properties in a tabFactory
function instead
of using tabProperties
will result in better
performance.
In the following example, the tab bar's tab properties are updated:
tabs.tabProperties.iconPosition = Button.ICON_POSITION_RIGHT;
The default value is null
.
public function get tabProperties():Object
public function set tabProperties(value:Object):void
See also
tabStyleName | property |
protected var tabStyleName:String = feathers-tab-bar-tab
The value added to the styleNameList
of the tabs. This
variable is protected
so that sub-classes can customize
the tab style name in their constructors instead of using the default
style name defined by DEFAULT_CHILD_STYLE_NAME_TAB
.
To customize the tab style name without subclassing, see
customTabStyleName
.
See also
toggleGroup | property |
protected var toggleGroup:ToggleGroup
The toggle group.
verticalAlign | property |
verticalAlign:String
Determines how the tabs are vertically aligned within the bounds of the tab bar (on the y-axis).
The following example aligns the tabs to the top:
tabs.verticalAlign = TabBar.VERTICAL_ALIGN_TOP;
The default value is TabBar.VERTICAL_ALIGN_JUSTIFY
.
public function get verticalAlign():String
public function set verticalAlign(value:String):void
See also
TabBar | () | Constructor |
public function TabBar()
Constructor.
change | Event |
starling.events.Event
starling.events.Event.CHANGE
Dispatched when the selected tab changes.
The properties of the event object have the following values:
Property | Value |
---|---|
bubbles | false |
currentTarget | The Object that defines the
event listener that handles the event. For example, if you use
myButton.addEventListener() to register an event listener,
myButton is the value of the currentTarget . |
data | null |
target | The Object that dispatched the event;
it is not always the Object listening for the event. Use the
currentTarget property to always access the Object
listening for the event. |
DEFAULT_CHILD_NAME_TAB | Constant |
public static const DEFAULT_CHILD_NAME_TAB:String = feathers-tab-bar-tab
DEPRECATED: Replaced by TabBar.DEFAULT_CHILD_STYLE_NAME_TAB
.
DEPRECATION WARNING: This property is deprecated starting with Feathers 2.1. It will be removed in a future version of Feathers according to the standard Feathers deprecation policy.
See also
DEFAULT_CHILD_STYLE_NAME_TAB | Constant |
public static const DEFAULT_CHILD_STYLE_NAME_TAB:String = feathers-tab-bar-tab
The default value added to the styleNameList
of the tabs.
See also
DIRECTION_HORIZONTAL | Constant |
public static const DIRECTION_HORIZONTAL:String = horizontal
The tabs are displayed in order from left to right.
See also
DIRECTION_VERTICAL | Constant |
public static const DIRECTION_VERTICAL:String = vertical
The tabs are displayed in order from top to bottom.
See also
HORIZONTAL_ALIGN_CENTER | Constant |
public static const HORIZONTAL_ALIGN_CENTER:String = center
The tabs will be aligned horizontally to the center of the tab bar.
See also
HORIZONTAL_ALIGN_JUSTIFY | Constant |
public static const HORIZONTAL_ALIGN_JUSTIFY:String = justify
If the direction is vertical, each tab will fill the entire width of
the tab bar, and if the direction is horizontal, the alignment will
behave the same as HORIZONTAL_ALIGN_LEFT
.
See also
HORIZONTAL_ALIGN_LEFT | Constant |
public static const HORIZONTAL_ALIGN_LEFT:String = left
The tabs will be aligned horizontally to the left edge of the tab bar.
See also
HORIZONTAL_ALIGN_RIGHT | Constant |
public static const HORIZONTAL_ALIGN_RIGHT:String = right
The tabs will be aligned horizontally to the right edge of the tab bar.
See also
VERTICAL_ALIGN_BOTTOM | Constant |
public static const VERTICAL_ALIGN_BOTTOM:String = bottom
The tabs will be aligned vertically to the bottom edge of the tab bar.
See also
VERTICAL_ALIGN_JUSTIFY | Constant |
public static const VERTICAL_ALIGN_JUSTIFY:String = justify
If the direction is horizontal, each tab will fill the entire height
of the tab bar. If the direction is vertical, the alignment will
behave the same as VERTICAL_ALIGN_TOP
.
See also
VERTICAL_ALIGN_MIDDLE | Constant |
public static const VERTICAL_ALIGN_MIDDLE:String = middle
The tabs will be aligned vertically to the middle of the tab bar.
See also
VERTICAL_ALIGN_TOP | Constant |
public static const VERTICAL_ALIGN_TOP:String = top
The tabs will be aligned vertically to the top edge of the tab bar.
See also