Packageflexlib.baseClasses
Classpublic class AccordionBase
InheritanceAccordionBase Inheritance mx.core.Container
Implementsmx.managers.IFocusManagerComponent, mx.managers.IHistoryManagerClient
SubclassesHAccordion, VAccordion

AccordionBase is a copy/paste version of the original Accordion class in the Flex framework.

The only modifications made to this class were to change some properties and methods from private to protected so we can override them in a subclass.

An Accordion navigator container has a collection of child containers, but only one of them at a time is visible. It creates and manages navigator buttons (accordion headers), which you use to navigate between the children. There is one navigator button associated with each child container, and each navigator button belongs to the Accordion container, not to the child. When the user clicks a navigator button, the associated child container is displayed. The transition to the new child uses an animation to make it clear to the user that one child is disappearing and a different one is appearing.

The Accordion container does not extend the ViewStack container, but it implements all the properties, methods, styles, and events of the ViewStack container, such as selectedIndex and selectedChild.

MXML Syntaxexpanded Hide MXML Syntax

The <mx:Accordion> tag inherits all of the tag attributes of its superclass, with the exception of scrolling-related attributes, and adds the following tag attributes:

  <mx:Accordion
    Properties
    headerRenderer="IFactory"
    historyManagementEnabled="true|false"
    resizeToContent="false|true"
    selectedIndex="undefined"
  
    Styles
    fillAlphas="[0.60, 0.40, 0.75, 0.65]"
    fillColors="[0xFFFFFF, 0xCCCCCC, 0xFFFFFF, 0xEEEEEE]"
    focusAlpha="0.5"
    focusRoundedCorners="tl tr bl br"
    headerHeight="depends on header font styles"
    headerStyleName="No default"
    horizontalGap="8"
    openDuration="250"
    openEasingFunction="undefined"
    paddingBottom="-1"
    paddingTop="-1"
    selectedFillColors="undefined"
    textRollOverColor="0xB333C"
    textSelectedColor="0xB333C"
    verticalGap="-1"
  
    Events
    change="No default"
    >
      ...
      child tags
      ...
  </mx:Accordion>
  

See also

mx.containers.accordionClasses.AccordionHeader


Public Properties
 PropertyDefined by
  headerRenderer : IFactory
A factory used to create the navigation buttons for each child.
AccordionBase
  historyManagementEnabled : Boolean
If set to true, this property enables history management within this Accordion container.
AccordionBase
  resizeToContent : Boolean
If set to true, this Accordion automatically resizes to the size of its current child.
AccordionBase
  selectedChild : Container
A reference to the currently visible child container.
AccordionBase
  selectedIndex : int
The zero-based index of the currently visible child container.
AccordionBase
Protected Properties
 PropertyDefined by
  accMinHeight : Number
AccordionBase
  accPreferredHeight : Number
AccordionBase
  accPreferredWidth : Number
AccordionBase
  contentHeight : Number
[read-only] The height of the area, in pixels, in which content is displayed.
AccordionBase
  contentWidth : Number
[read-only] The width of the area, in pixels, in which content is displayed.
AccordionBase
  tween : Tween
AccordionBase
  tweenContentHeight : Number
AccordionBase
  tweenContentWidth : Number
AccordionBase
  tweenNewSelectedIndex : int
AccordionBase
  tweenOldSelectedIndex : int
AccordionBase
Public Methods
 MethodDefined by
  
Constructor.
AccordionBase
  
getHeaderAt(index:int):Button
Returns a reference to the navigator button for a child container.
AccordionBase
  
loadState(state:Object):void
AccordionBase
  
saveState():Object
AccordionBase
Events
 EventSummaryDefined by
   Dispatched when the selected child container changes.AccordionBase
Styles
 StyleDescriptionDefined by
  
fillAlphas
Type: Array   CSS Inheritance: no
AccordionBase
  
fillColors
Type: Array   Format: Color   CSS Inheritance: no
AccordionBase
  
focusAlpha
Type: Number   CSS Inheritance: no
AccordionBase
  
focusRoundedCorners
Type: String   CSS Inheritance: no
AccordionBase
  
headerHeight
Type: Number   Format: Length   CSS Inheritance: no
Height of each accordion header, in pixels. The default value is automatically calculated based on the font styles for the header.
AccordionBase
  
headerStyleName
Type: String   CSS Inheritance: no
Name of CSS style declaration that specifies styles for the accordion headers (tabs).
AccordionBase
  
horizontalGap
Type: Number   Format: Length   CSS Inheritance: no
Number of pixels between children in the horizontal direction. The default value is 8.
AccordionBase
  
openDuration
Type: Number   Format: Time   CSS Inheritance: no
Duration, in milliseconds, of the animation from one child to another. The default value is 250.
AccordionBase
  
openEasingFunction
Type: Function   CSS Inheritance: no
Tweening function used by the animation from one child to another.
AccordionBase
  
paddingBottom
Type: Number   Format: Length   CSS Inheritance: no
Number of pixels between the container's bottom border and its content area. The default value is -1, so the bottom border of the last header overlaps the Accordion container's bottom border.
AccordionBase
  
paddingTop
Type: Number   Format: Length   CSS Inheritance: no
Number of pixels between the container's top border and its content area. The default value is -1, so the top border of the first header overlaps the Accordion container's top border.
AccordionBase
  
selectedFillColors
Type: Array   Format: Color   CSS Inheritance: no
AccordionBase
  
textRollOverColor
Type: uint   Format: Color   CSS Inheritance: yes
Color of header text when rolled over. The default value is 0x2B333C.
AccordionBase
  
textSelectedColor
Type: uint   Format: Color   CSS Inheritance: yes
Color of selected text. The default value is 0x2B333C.
AccordionBase
  
verticalGap
Type: Number   Format: Length   CSS Inheritance: no
Number of pixels between children in the vertical direction. The default value is -1, so the top and bottom borders of adjacent headers overlap.
AccordionBase
Property detail
accMinHeightproperty
protected var accMinHeight:Number
accPreferredHeightproperty 
protected var accPreferredHeight:Number
accPreferredWidthproperty 
protected var accPreferredWidth:Number
contentHeightproperty 
contentHeight:Number  [read-only]

The height of the area, in pixels, in which content is displayed. You can override this getter if your content does not occupy the entire area of the container.

Implementation
    protected function get contentHeight():Number
contentWidthproperty 
contentWidth:Number  [read-only]

The width of the area, in pixels, in which content is displayed. You can override this getter if your content does not occupy the entire area of the container.

Implementation
    protected function get contentWidth():Number
headerRendererproperty 
headerRenderer:IFactory  [read-write]

A factory used to create the navigation buttons for each child. The default value is a factory which creates a mx.containers.accordionClasses.AccordionHeader. The created object must be a subclass of Button and implement the mx.core.IDataRenderer interface. The data property is set to the content associated with the header.

This property can be used as the source for data binding.

Implementation
    public function get headerRenderer():IFactory
    public function set headerRenderer(value:IFactory):void

See also

mx.containers.accordionClasses.AccordionHeader
historyManagementEnabledproperty 
historyManagementEnabled:Boolean  [read-write]

If set to true, this property enables history management within this Accordion container. As the user navigates from one child to another, the browser remembers which children were visited. The user can then click the browser's Back and Forward buttons to move through this navigation history.

The default value is true.

Implementation
    public function get historyManagementEnabled():Boolean
    public function set historyManagementEnabled(value:Boolean):void

See also

mx.managers.HistoryManager
resizeToContentproperty 
resizeToContent:Boolean  [read-write]

If set to true, this Accordion automatically resizes to the size of its current child.

The default value is false.

Implementation
    public function get resizeToContent():Boolean
    public function set resizeToContent(value:Boolean):void
selectedChildproperty 
selectedChild:Container  [read-write]

A reference to the currently visible child container. The default value is a reference to the first child. If there are no children, this property is null.

Note: You can only set this property in an ActionScript statement, not in MXML.

This property can be used as the source for data binding.

Implementation
    public function get selectedChild():Container
    public function set selectedChild(value:Container):void
selectedIndexproperty 
selectedIndex:int  [read-write]

The zero-based index of the currently visible child container. Child indexes are in the range 0, 1, 2, ... , n - 1, where n is the number of children. The default value is 0, corresponding to the first child. If there are no children, this property is -1.

The default value is 0.

This property can be used as the source for data binding.

Implementation
    public function get selectedIndex():int
    public function set selectedIndex(value:int):void
tweenproperty 
protected var tween:Tween
tweenContentHeightproperty 
protected var tweenContentHeight:Number
tweenContentWidthproperty 
protected var tweenContentWidth:Number
tweenNewSelectedIndexproperty 
protected var tweenNewSelectedIndex:int
tweenOldSelectedIndexproperty 
protected var tweenOldSelectedIndex:int
Constructor detail
AccordionBase()constructor
public function AccordionBase()

Constructor.

Method detail
getHeaderAt()method
public function getHeaderAt(index:int):Button

Returns a reference to the navigator button for a child container.

Parameters
index:int — Zero-based index of the child.

Returns
Button — Button object representing the navigator button.
loadState()method 
public function loadState(state:Object):void

Parameters
state:Object
saveState()method 
public function saveState():Object

Returns
Object
Event detail
changeevent 
Event object type: mx.events.IndexChangedEvent

Dispatched when the selected child container changes.