| Package | mx.controls |
| Class | public class TabBar |
| Inheritance | TabBar  ToggleButtonBar ButtonBar NavBar Box Container UIComponent FlexSprite Sprite DisplayObjectContainer InteractiveObject DisplayObject EventDispatcher Object |
Using the TabBar control lets the tabs be directly determined by the data so that you can change the view or views in any way.
MXML Syntax
Hide MXML Syntax
The <mx:TabBar> tag inherits all of the tag attributes
of its superclass, and adds the following tag attributes:
Show MXML Syntax
<mx:TabBar
Styles
firstTabStyleName="Value of the tabStyleName property"
horizontalAlign="left|center|right"
horizontalGap="-1"
lastTabStyleName="Value of the tabStyleName property"
selectedTabTextStyleName="activeTabStyle"
tabHeight="undefined"
tabStyleName="Tab"
tabWidth="undefined"
verticalAlign="top|middle|bottom"
verticalGap="-1"
Events
itemClick="No default"
>
...
child tags
...
</mx:TabBar>
Default MXML PropertydataProvider
| Method | Defined By | ||
|---|---|---|---|
|
TabBar()
Constructor.
| TabBar | ||
 |
Adds a child DisplayObject to this Container.
| Container | |
|
Adds a child DisplayObject to this Container.
| Container | |
|
addEventListener(type:String, listener:Function, useCapture:Boolean = false, priority:int = 0, useWeakReference:Boolean = false):void
Registers an event listener object with an EventDispatcher object so that the listener
receives notification of an event.
| EventDispatcher | |
|
Indicates whether the security restrictions
would cause any display objects to be omitted from the list returned by calling
the DisplayObjectContainer.getObjectsUnderPoint() method
with the specified point point.
| DisplayObjectContainer | |
|
Queues a function to be called later.
| UIComponent | |
|
Deletes a style property from this component instance.
| UIComponent | |
|
Determines whether the specified display object is a child of the DisplayObjectContainer instance or
the instance itself.
| DisplayObjectContainer | |
|
Converts a Point object from content coordinates to global coordinates.
| Container | |
|
Converts a Point object from content to local coordinates.
| Container | |
|
| UIComponent | |
|
Given a single UIComponentDescriptor, create the corresponding
component and add the component as a child of this Container.
| Container | |
|
Iterate through the Array of childDescriptors,
and call the createComponentFromDescriptor() method for each one.
| Container | |
|
| UIComponent | |
|
| UIComponent | |
|
Returns a UITextFormat object corresponding to the text styles
for this UIComponent.
| UIComponent | |
| UIComponent | ||
|
Shows or hides the focus indicator around this component.
| UIComponent | |
|
drawRoundRect(x:Number, y:Number, width:Number, height:Number, cornerRadius:Object = null, color:Object = null, alpha:Object = null, gradientMatrix:Matrix = null, gradientType:String = "linear", gradientRatios:Array = null, hole:Object = null):void
Programatically draws a rectangle into this skin's Graphics object.
| UIComponent | |
|
Called by the effect instance when it stops playing on the component.
| UIComponent | |
|
Called by the effect instance when it starts playing on the component.
| UIComponent | |
|
Ends all currently playing effects on the component.
| UIComponent | |
|
Executes all the data bindings on this Container.
| Container | |
|
Executes the bindings into this Container's child UIComponent objects.
| Container | |
|
Called after printing is complete.
| UIComponent | |
|
| UIComponent | |
|
Returns a rectangle that defines the area of the display object relative to the coordinate system
of the targetCoordinateSpace object.
| DisplayObject | |
|
Gets the nth child component object.
| Container | |
|
Returns the child whose name property is the specified String.
| Container | |
|
Gets the zero-based index of a specific child.
| Container | |
|
Returns an Array of DisplayObject objects consisting of the content children
of the container.
| Container | |
|
Finds the type selectors for this UIComponent instance.
| UIComponent | |
|
A convenience method for determining whether to use the
explicit or measured height
| UIComponent | |
|
A convenience method for determining whether to use the
explicit or measured width
| UIComponent | |
|
Gets the object that currently has focus.
| UIComponent | |
|
Returns an array of objects that lie under the specified point and are children
(or grandchildren, and so on) of this DisplayObjectContainer instance.
| DisplayObjectContainer | |
|
Returns a rectangle that defines the boundary of the display object,
based on the coordinate system defined by the targetCoordinateSpace
parameter, excluding any strokes on shapes.
| DisplayObject | |
|
Returns the item in the dataProvider that was used
by the specified Repeater to produce this Repeater, or
null if this Repeater isn't repeated.
| UIComponent | |
|
Gets a style property that has been set anywhere in this
component's style lookup chain.
| UIComponent | |
|
Converts a Point object from global to content coordinates.
| Container | |
|
Converts the point object from the Stage (global) coordinates
to the display object's (local) coordinates.
| DisplayObject | |
|
Checks whether the EventDispatcher object has any listeners registered for a specific type
of event.
| EventDispatcher | |
|
Indicates whether an object has a specified property defined.
| Object | |
|
Evaluates the display object to see if it overlaps or intersects with the
obj display object.
| DisplayObject | |
|
Evaluates the display object to see if it overlaps or intersects with the
point specified by the x and y parameters.
| DisplayObject | |
|
Returns a box Matrix which can be passed to the
drawRoundRect() method
as the rot parameter when drawing a horizontal gradient.
| UIComponent | |
|
Initializes the internal structure of this component.
| UIComponent | |
|
Initializes various properties which keep track of repeated instances
of this component.
| UIComponent | |
|
Marks a component so that its updateDisplayList()
method gets called during a later screen update.
| UIComponent | |
|
Marks a component so that its commitProperties()
method gets called during a later screen update.
| UIComponent | |
|
Marks a component so that its measure()
method gets called during a later screen update.
| UIComponent | |
|
Indicates whether an instance of the Object class is in the prototype chain of the object specified
as the parameter.
| Object | |
|
Converts a Point object from local to content coordinates.
| Container | |
|
Converts the point object from the display object's (local) coordinates to the
Stage (global) coordinates.
| DisplayObject | |
|
Measures the specified HTML text, which may contain HTML tags such
as <font> and <b>,
assuming that it is displayed
in a single-line UITextField using a UITextFormat
determined by the styles of this UIComponent.
| UIComponent | |
|
Measures the specified text, assuming that it is displayed
in a single-line UITextField using a UITextFormat
determined by the styles of this UIComponent.
| UIComponent | |
|
Moves the component to a specified position within its parent.
| UIComponent | |
|
Propagate style changes to the children.
| UIComponent | |
|
Returns true if the chain of owner properties
points from child to this UIComponent.
| UIComponent | |
|
Called by Flex when a UIComponent object is added to or removed from a parent.
| UIComponent | |
|
Method used to convert number of pixels to a
percentage relative to the contents of this container.
| Box | |
|
Prepares an IFlexDisplayObject for printing.
| UIComponent | |
|
Indicates whether the specified property exists and is enumerable.
| Object | |
|
Builds or rebuilds the CSS style cache for this component
and, if the recursive parameter is true,
for all descendants of this component as well.
| UIComponent | |
|
For each effect event, register the EffectManager
as one of the event listeners.
| UIComponent | |
|
Removes all children from the child list of this container.
| Container | |
|
Removes a child DisplayObject from the child list of this Container.
| Container | |
|
Removes a child DisplayObject from the child list of this Container
at the specified index.
| Container | |
|
Removes a listener from the EventDispatcher object.
| EventDispatcher | |
|
| UIComponent | |
|
| UIComponent | |
|
[static]
Resumes the background processing of methods
queued by callLater(), after a call to
suspendBackgroundProcessing().
| UIComponent | |
|
Sizes the object.
| UIComponent | |
|
Sets the index of a particular child.
| Container | |
|
Set the current state.
| UIComponent | |
|
Sets the focus to this component.
| UIComponent | |
|
Sets the availability of a dynamic property for loop operations.
| Object | |
|
Sets a style property on this component instance.
| UIComponent | |
|
Called when the visible property changes.
| UIComponent | |
|
Lets the user drag the specified sprite.
| Sprite | |
|
Ends the startDrag() method.
| Sprite | |
|
Detects changes to style properties.
| UIComponent | |
|
Flex calls the stylesInitialized() method when
the styles for a component are first initialized.
| UIComponent | |
|
[static]
Blocks the background processing of methods
queued by callLater(),
until resumeBackgroundProcessing() is called.
| UIComponent | |
|
Swaps the z-order (front-to-back order) of the two specified child objects.
| DisplayObjectContainer | |
|
Swaps the z-order (front-to-back order) of the child objects at the two specified index positions in the
child list.
| DisplayObjectContainer | |
|
Returns a string indicating the location of this object
within the hierarchy of DisplayObjects in the Application.
| FlexSprite | |
|
| UIComponent | |
|
Validate and update the properties and layout of this object
and redraw it, if necessary.
| UIComponent | |
|
Used by layout logic to validate the properties of a component
by calling the commitProperties() method.
| UIComponent | |
|
| UIComponent | |
|
Handles both the valid and invalid events from a
validator assigned to this component.
| UIComponent | |
|
Returns the primitive value of the specified object.
| Object | |
|
Returns a box Matrix which can be passed to drawRoundRect()
as the rot parameter when drawing a vertical gradient.
| UIComponent | |
|
Checks whether an event listener is registered with this EventDispatcher object or any of
its ancestors for the specified event type.
| EventDispatcher | |
| Event | Summary | Defined By | ||
|---|---|---|---|---|
| Dispatched when Flash Player gains operating system focus and becomes active. | EventDispatcher | ||
| Dispatched when the component is added to a container as a content child by using the addChild() or addChildAt() method. | UIComponent | ||
| Dispatched when a display object is added to the display list. | DisplayObject | ||
| Dispatched when a display object is added to the on stage display list, either directly or through the addition of a sub tree in which the display object is contained. | DisplayObject | ||
| Dispatched after a child has been added to a container. | Container | ||
| Dispatched after the index (among the container children) of a container child changes. | Container | ||
| Dispatched before a child of a container is removed. | Container | ||
| Dispatched when the component has finished its construction, property processing, measuring, layout, and drawing. | UIComponent | ||
| Dispatched after the view state has changed. | UIComponent | ||
| Dispatched after the currentState property changes, but before the view state changes. | UIComponent | ||
| Dispatched when the data property changes. | Container | ||
| Dispatched when Flash Player loses operating system focus and is becoming inactive. | EventDispatcher | ||
| Dispatched when a user presses and releases the main button of a pointing device twice in rapid succession over the same InteractiveObject when that object's doubleClickEnabled flag is set to true. | InteractiveObject | ||
| Dispatched by the drag initiator (the component that is the source of the data being dragged) when the drag operation completes, either when you drop the dragged data onto a drop target or when you end the drag-and-drop operation without performing a drop. | UIComponent | ||
| Dispatched by the drop target when the user releases the mouse over it. | UIComponent | ||
| Dispatched by a component when the user moves the mouse over the component during a drag operation. | UIComponent | ||
| Dispatched by the component when the user drags outside the component, but does not drop the data onto the target. | UIComponent | ||
| Dispatched by a component when the user moves the mouse while over the component during a drag operation. | UIComponent | ||
| Dispatched after an effect ends. | UIComponent | ||
| Dispatched just before an effect starts. | UIComponent | ||
| Dispatched when the playhead is entering a new frame. | DisplayObject | ||
| Dispatched after the component has returned to the root view state. | UIComponent | ||
| Dispatched before the component exits from the root view state. | UIComponent | ||
| Dispatched when an object's state changes from visible to invisible. | UIComponent | ||
| Dispatched when the component has finished its construction and has all initialization properties set. | UIComponent | ||
| Dispatched when a component is monitored by a Validator and the validation failed. | UIComponent | ||
| Dispatched when a tab navigation item is selected. | TabBar | |||
| Dispatched when the user presses a key. | InteractiveObject | ||
| Dispatched when the user attempts to change focus by using keyboard navigation. | InteractiveObject | ||
| Dispatched when the user releases a key. | InteractiveObject | ||
| Dispatched when a user presses the pointing device button over an InteractiveObject instance in the Flash Player window. | InteractiveObject | ||
| Dispatched from a component opened using the PopUpManager when the user clicks outside it. | UIComponent | ||
| Dispatched when the user attempts to change focus by using a pointer device. | InteractiveObject | ||
| Dispatched when a user moves the pointing device while it is over an InteractiveObject. | InteractiveObject | ||
| Dispatched when the user moves a pointing device away from an InteractiveObject instance. | InteractiveObject | ||
| Dispatched when the user moves a pointing device over an InteractiveObject instance in the Flash Player window. | InteractiveObject | ||
| Dispatched when a user releases the pointing device button over an InteractiveObject instance in the Flash Player window. | InteractiveObject | ||
| Dispatched when a mouse wheel is spun over an InteractiveObject instance in the Flash Player window. | InteractiveObject | ||
| Dispatched from a component opened using the PopUpManager when the user scrolls the mouse wheel outside it. | UIComponent | ||
| Dispatched when the object has moved. | UIComponent | ||
| Dispatched at the beginning of the component initialization sequence. | UIComponent | ||
| Dispatched when the component is removed from a container as a content child by using the removeChild() or removeChildAt() method. | UIComponent | ||
| Dispatched when a display object is about to be removed from the display list. | DisplayObject | ||
| Dispatched when a display object is about to be removed from the display list, either directly or through the removal of a sub tree in which the display object is contained. | DisplayObject | ||
| Dispatched when the display list is about to be updated and rendered. | DisplayObject | ||
| Dispatched when the component is resized. | UIComponent | ||
| Dispatched when the user moves a pointing device away from an InteractiveObject instance. | InteractiveObject | ||
| Dispatched when the user moves a pointing device over an InteractiveObject instance. | InteractiveObject | ||
| Dispatched when an object's state changes from invisible to visible. | UIComponent | ||
| Dispatched when the value of the object's tabChildren flag changes. | InteractiveObject | ||
| Dispatched when the object's tabEnabled flag changes. | InteractiveObject | ||
| Dispatched when the value of the object's tabIndex property changes. | InteractiveObject | ||
| Dispatched by the component when it is time to create a ToolTip. | UIComponent | ||
| Dispatched by the component when its ToolTip has been hidden and will be discarded soon. | UIComponent | ||
| Dispatched by the component when its ToolTip is about to be hidden. | UIComponent | ||
| Dispatched by the component when its ToolTip is about to be shown. | UIComponent | ||
| Dispatched by the component when its ToolTip has been shown. | UIComponent | ||
| Dispatched by a component whose toolTip property is set, as soon as the user moves the mouse over it. | UIComponent | ||
| Dispatched when an object has had its commitProperties(), measure(), and updateDisplayList() methods called (if needed). | UIComponent | ||
| Dispatched when a component is monitored by a Validator and the validation succeeded. | UIComponent | ||
| Dispatched when values are changed programmatically or by user interaction. | UIComponent | ||
| Style | Description | Defined By | ||
|---|---|---|---|---|
| Type: uint Format: Color CSS Inheritance: yes Background color of the component when it is disabled. | Container | ||
| Type: uint Format: Color CSS Inheritance: yes Determines the color of a ProgressBar. | Container | ||
| Type: Number Format: Length CSS Inheritance: no The vertical distance in pixels from the lower edge of the component to the lower edge of its parent container. | UIComponent | ||
| Type: Number Format: Length CSS Inheritance: no Height of each button, in pixels. | ButtonBar | ||
| Type: String CSS Inheritance: no Name of CSS style declaration that specifies styles for the buttons. | ButtonBar | ||
| Type: Number Format: Length CSS Inheritance: no Width of each button, in pixels. | ButtonBar | ||
| Type: uint Format: Color CSS Inheritance: yes Color of text in the component, including the component label. | Container | ||
| Type: uint Format: Color CSS Inheritance: yes Color of text in the component if it is disabled. | Container | ||
| Type: Number CSS Inheritance: no The alpha value for the overlay that is placed on top of the container when it is disabled. | Container | ||
| Type: uint Format: Color CSS Inheritance: yes Color of the component highlight when validation fails. | UIComponent | ||
| Type: String CSS Inheritance: no Name of CSS style declaration that specifies styles for the first button. | ButtonBar | ||
|
firstTabStyleName
| Type: String CSS Inheritance: no Name of CSS style declaration that specifies the styles to use for the first tab navigation item. The default value is "tabStyleName". | TabBar | ||
| Type: Number CSS Inheritance: no Specifies the alpha transparency value of the focus skin. | ButtonBar | ||
| Type: String CSS Inheritance: no Specifies which corners of the focus rectangle should be rounded. | ButtonBar | ||
| Type: String CSS Inheritance: yes Sets the antiAliasType property of internal TextFields. | Container | ||
| Type: String CSS Inheritance: yes Name of the font to use. | Container | ||
| Type: String CSS Inheritance: yes Sets the gridFitType property of internal TextFields that represent text in Flex controls. | Container | ||
| Type: Number CSS Inheritance: yes Sets the sharpness property of internal TextFields that represent text in Flex controls. | Container | ||
| Type: Number Format: Length CSS Inheritance: yes Height of the text, in pixels. | Container | ||
| Type: String CSS Inheritance: yes Determines whether the text is italic font. | Container | ||
| Type: Number CSS Inheritance: yes Sets the thickness property of internal TextFields that represent text in Flex controls. | Container | ||
| Type: String CSS Inheritance: yes Determines whether the text is boldface. | Container | ||
|
horizontalAlign
| Type: String CSS Inheritance: no Horizontal alignment of the tab navigation items. Possible values are "left", "center",
and "right".
The default value is "left". | TabBar | ||
| Type: Number Format: Length CSS Inheritance: no The horizontal distance in pixels from the center of the component's parent container to the center of the component. | UIComponent | ||
|
horizontalGap
| Type: Number Format: Length CSS Inheritance: no Number of pixels between tab navigation items in the horizontal direction. The default value is -1. | TabBar | ||
| Type: Boolean CSS Inheritance: yes A Boolean value that indicates whether kerning is enabled ( true) or disabled (false). | Container | ||
| Type: String CSS Inheritance: no Name of CSS style declaration that specifies styles for the last button. | ButtonBar | ||
|
lastTabStyleName
| Type: String CSS Inheritance: no Name of CSS style declaration that specifies the styles to use for the last tab navigation item. The default value is "tabStyleName". | TabBar | ||
| Type: Number Format: Length CSS Inheritance: no The horizontal distance in pixels from the left edge of the component's parent container to the left edge of the component. | UIComponent | ||
| Type: Number CSS Inheritance: yes The number of additional pixels to appear between each character. | Container | ||
| Type: Number Format: Length CSS Inheritance: no Number of pixels between the container's bottom border and the bottom of its content area. | Box | ||
| Type: Number Format: Length CSS Inheritance: no Number of pixels between the container's left border and the left edge of its content area. | Container | ||
| Type: Number Format: Length CSS Inheritance: no Number of pixels between the container's right border and the right edge of its content area. | Container | ||
| Type: Number Format: Length CSS Inheritance: no Number of pixels between the container's top border and the top of its content area. | Box | ||
| Type: Number Format: Length CSS Inheritance: no The horizontal distance in pixels from the right edge of the component to the right edge of its parent container. | UIComponent | ||
| Type: String CSS Inheritance: no Name of CSS style declaration that specifies styles for the text of the selected button. | ToggleButtonBar | ||
|
selectedTabTextStyleName
| Type: String CSS Inheritance: no Name of CSS style declaration that specifies the styles to use for the text of the selected tab navigation item. The default value is "activeTabStyle". | TabBar | ||
|
tabHeight
| Type: Number Format: Length CSS Inheritance: no Height of each tab navigation item, in pixels. When this property is undefined, the height of each tab
is determined by the font styles applied to the container.
If you set this property, the specified value overrides this calculation.
The default value is undefined. | TabBar | ||
|
tabStyleName
| Type: String CSS Inheritance: no Name of CSS style declaration that specifies the styles to use for the tab navigation items. The default value is "Tab". | TabBar | ||
|
tabWidth
| Type: Number Format: Length CSS Inheritance: no Width of the tab navigation item, in pixels. If undefined, the default tab widths are calculated from the label text. The default value is undefined. | TabBar | ||
| Type: String CSS Inheritance: yes Alignment of text within a container. | Container | ||
| Type: String CSS Inheritance: no Determines whether the text is underlined. | Container | ||
| Type: Number Format: Length CSS Inheritance: yes Offset of first line of text from the left side of the container, in pixels. | Container | ||
| Type: uint Format: Color CSS Inheritance: yes Theme color of a component. | UIComponent | ||
| Type: Number Format: Length CSS Inheritance: no The vertical distance in pixels from the top edge of the component's parent container to the top edge of the component. | UIComponent | ||
|
verticalAlign
| Type: String CSS Inheritance: no Vertical alignment of the tab navigation items. Possible values are "top", "middle",
and "bottom".
The default value is "top". | TabBar | ||
| Type: Number Format: Length CSS Inheritance: no The vertical distance in pixels from the center of the component's parent container to the center of the component. | UIComponent | ||
|
verticalGap
| Type: Number Format: Length CSS Inheritance: no Number of pixels between tab navigation items in the vertical direction. The default value is -1. | TabBar | ||
| TabBar | () | Constructor |
public function TabBar()
Constructor.
| itemClick | Event |
mx.events.ItemClickEvent
mx.events.ItemClickEvent.ITEM_CLICK
Dispatched when a tab navigation item is selected. This event is sent only if the data provider is not a ViewStack container.
TheItemClickEvent.ITEM_CLICK constant defines the value of the
type property of the event object for an itemClick event.
The properties of the event object have the following values:
| Property | Value |
|---|---|
bubbles | false |
cancelable | 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. |
index | The index of the navigation item that was clicked. |
item | The item in the data provider of the navigation item that was clicked. |
label | The label of the navigation item that was clicked. |
relatedObject | The child object that generated the event. |
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. |
<?xml version="1.0"?>
<!-- Simple example to demonstrate the TabBar control. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.events.ItemClickEvent;
import mx.controls.TabBar;
[Bindable]
public var STATE_ARRAY:Array = [{label:"Alabama", data:"Montgomery"},
{label:"Alaska", data:"Juneau"},
{label:"Arkansas", data:"LittleRock"}
];
private function clickEvt(event:ItemClickEvent):void {
// Access target TabBar control.
var targetComp:TabBar = TabBar(event.currentTarget);
forClick.text="label is: " + event.label + ", index is: " +
event.index + ", capital is: " +
targetComp.dataProvider[event.index].data;
}
]]>
</mx:Script>
<mx:Panel title="TabBar Control Example" height="75%" width="75%"
paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10">
<mx:Label width="100%" color="blue"
text="Select a tab to change the current panel."/>
<mx:TabBar itemClick="clickEvt(event);">
<mx:dataProvider>{STATE_ARRAY}</mx:dataProvider>
</mx:TabBar>
<mx:TextArea id="forClick" height="100%" width="100%"/>
</mx:Panel>
</mx:Application>
Send me an e-mail when comments are added to this page | Comment Report
Current page: http://livedocs.adobe.com/livecycle/es/sdkHelp/common/langref/mx/controls/TabBar.html