Package | km.components |
Class | public class Accordion |
Inheritance | Accordion ![]() ![]() |
import km.components.*; var acc:Accordion = new Accordion(); acc.panelPlacement = Accordion.LEFT; acc.operationMode = Accordion.MODE_MAX_ONE; acc.sizeToContent = true; acc.setSize(400,320); acc.move(40,40); var s1:Shape = new Shape(); var s2:Shape = new Shape(); var s3:Shape = new Shape(); var s4:Shape = new Shape(); s1.graphics.beginFill(0xff0000); s1.graphics.drawCircle(50,50,30); s2.graphics.beginFill(0x00ff00); s2.graphics.drawCircle(50,50,60); s3.graphics.beginFill(0x0000ff); s3.graphics.drawCircle(20,20,20); s4.graphics.beginFill(0xffff00); s4.graphics.drawCircle(80,80,20); var p1:AccordionPanel = new AccordionPanel(); p1.header.label.valign = 'bottom'; acc.addPanel(p1,'caption 1', s1); var p2:AccordionPanel = acc.addPanel(p1.clone(),'caption 2', s2); var p3:AccordionPanel = acc.addPanel(p1.clone(),'caption 3', s3); var p4:AccordionPanel = acc.addPanel(p1.clone(),'caption 4', s4); p1.duotone = [0x600000,0xffe0e0]; p2.duotone = [0x006000,0xe0ffe0]; p3.duotone = [0x000060,0xe0e0ff]; p4.duotone = [0x606000,0xffffe0]; addChild(acc);
Property | Defined by | ||
---|---|---|---|
![]() | duotone : Array The duotone property can be used to convert the colors of the component into duotone.
| UIComponent | |
![]() | enabled : Boolean Specifies if the component is enabled.
If a component is disabled, it will be turned into grayscale and become partly transparent. | UIComponent | |
![]() | height : Number | UIComponent | |
numPanels : int [read-only] Gets the number of panels the accordion contains.
| Accordion | ||
onChange : Function onChange handler.
| Accordion | ||
operationMode : int Specifies the operation mode of the accordion.
0 = always one panel open, 1 = max one panel open, 2 = multiple open panels allowed. | Accordion | ||
oppositeHeaderSide : Boolean Gets or sets if the header should be on the opposite side.
| Accordion | ||
panelPlacement : int Get or set where the panels will be placed from.
Possible values are Accordion.LEFT (= 0), Accordion.RIGHT (= 1), Accordion.TOP (= 2), Accordion.BOTTOM (= 3). | Accordion | ||
panels : Array [read-only] Gets the panels the accordion contains.
| Accordion | ||
sizeToContent : Boolean Gets or sets if the panels should be sized to the content they contain.
If sizeToContent is set to true and the content of a panel is changed in a way that affects the size of the content, the update function of the accordion should be called manually, so it can reset itself to the new content size. | Accordion | ||
![]() | toolTip : String Text to use as toolTip when ToolTip is enabled.
| UIComponent | |
![]() | width : Number | UIComponent | |
![]() | x : Number | UIComponent | |
![]() | y : Number | UIComponent |
Method | Defined by | ||
---|---|---|---|
Accordion | |||
addPanel(panel:AccordionPanel, headerText:String = null, content:DisplayObject = null):AccordionPanel
Adds a panel to the component.
| Accordion | ||
![]() |
clone():*
Returns a clone of the component.
The skin of the component is cloned but other things like the text of a label or the items of a list aren't. | UIComponent | |
closePanel(panel:AccordionPanel, animated:Boolean = true):void
Closes the specified panel.
| Accordion | ||
getContentArea(panel:AccordionPanel):Rectangle
Gets the area available for content of the specified panel.
| Accordion | ||
getPanelAt(index:int):AccordionPanel
Returns the panel at the specified index.
| Accordion | ||
isOpen(panel:AccordionPanel):Boolean
Returns if the specified panel is open.
| Accordion | ||
lockPanel(panel:AccordionPanel):void
Locks the specified panel so header clicks have no effect.
| Accordion | ||
![]() |
move(x:int, y:int, animationMode:int = 0, animationFrames:int = 12, easeInOut:Boolean = false):void
Moves the component to the specified coordinates.
| UIComponent | |
openPanel(panel:AccordionPanel, animated:Boolean = true):void
Opens the specified panel.
| Accordion | ||
Removes the specified panel from the component.
| Accordion | ||
setAnimation(duration:int, easeInOut:Boolean = true, openCloseEffect:int = 0):void
Controls the panel animation.
| Accordion | ||
![]() |
setProperties(o:Object):void
Sets a number of properties at once.
| UIComponent | |
![]() |
setSize(w:int, h:int):void
Sets the size width and height.
| UIComponent | |
unlockPanel(panel:AccordionPanel):void
Unlocks the specified panel.
| Accordion |
Event | Summary | Defined by | ||
---|---|---|---|---|
![]() | The animationComplete event is broadcasted when an animated move is completed. | UIComponent | ||
The change event is broadcasted when there's a change in what panels are open or closed. When panels are opened or closed by scripting, the event is not broadcasted. It's also possible to use the onChange handler. | Accordion | |||
The panelAnimationComplete event is broadcasted when all panels have arrived at the right position. | Accordion |
Constant | Defined by | ||
---|---|---|---|
BOTTOM : int = 3 [static]
| Accordion | ||
LEFT : int = 0 [static]
| Accordion | ||
MODE_ALWAYS_ONE : int = 0 [static]
| Accordion | ||
MODE_MAX_ONE : int = 1 [static]
| Accordion | ||
MODE_MULTI : int = 2 [static]
| Accordion | ||
RIGHT : int = 1 [static]
| Accordion | ||
TOP : int = 2 [static]
| Accordion |
numPanels | property |
numPanels:int
[read-only]Gets the number of panels the accordion contains.
Implementation public function get numPanels():int
onChange | property |
public var onChange:Function
onChange handler.
operationMode | property |
operationMode:int
[read-write] Specifies the operation mode of the accordion.
0 = always one panel open, 1 = max one panel open, 2 = multiple open panels allowed.
public function get operationMode():int
public function set operationMode(value:int):void
oppositeHeaderSide | property |
oppositeHeaderSide:Boolean
[read-write]Gets or sets if the header should be on the opposite side.
Implementation public function get oppositeHeaderSide():Boolean
public function set oppositeHeaderSide(value:Boolean):void
panelPlacement | property |
panelPlacement:int
[read-write] Get or set where the panels will be placed from.
Possible values are Accordion.LEFT (= 0), Accordion.RIGHT (= 1), Accordion.TOP (= 2), Accordion.BOTTOM (= 3).
public function get panelPlacement():int
public function set panelPlacement(value:int):void
panels | property |
panels:Array
[read-only]Gets the panels the accordion contains.
Implementation public function get panels():Array
sizeToContent | property |
sizeToContent:Boolean
[read-write] Gets or sets if the panels should be sized to the content they contain.
If sizeToContent is set to true and the content of a panel is changed in a way that affects
the size of the content, the update function of the accordion should be called manually,
so it can reset itself to the new content size.
public function get sizeToContent():Boolean
public function set sizeToContent(value:Boolean):void
Accordion | () | constructor |
public function Accordion()
addPanel | () | method |
public function addPanel(panel:AccordionPanel, headerText:String = null, content:DisplayObject = null):AccordionPanel
Adds a panel to the component.
Parameterspanel:AccordionPanel |
|
headerText:String (default = null )
|
|
content:DisplayObject (default = null )
|
AccordionPanel |
closePanel | () | method |
public function closePanel(panel:AccordionPanel, animated:Boolean = true):void
Closes the specified panel.
Parameterspanel:AccordionPanel |
|
animated:Boolean (default = true )
|
getContentArea | () | method |
public function getContentArea(panel:AccordionPanel):Rectangle
Gets the area available for content of the specified panel.
Parameterspanel:AccordionPanel |
Rectangle |
import km.components.*; var acc:Accordion = new Accordion(); acc.panelPlacement = Accordion.TOP; acc.operationMode = Accordion.MODE_ALWAYS_ONE; acc.sizeToContent = true; acc.setSize(400,320); acc.move(40,40); var s1:Shape = new Shape(); s1.graphics.beginFill(0xff0000); s1.graphics.drawCircle(50,50,30); var p1:AccordionPanel = acc.addPanel(new AccordionPanel(), 'caption 1', s1); var p2:AccordionPanel = acc.addPanel(new AccordionPanel(), 'caption 2'); p1.duotone = [0x600000,0xffe0e0]; p2.duotone = [0x006000,0xe0ffe0]; addChild(acc); var ca:Rectangle = acc.getContentArea(p2); var rt:RichTextEditor = new RichTextEditor(); rt.setSize(ca.width, ca.height); p2.contentHolder.addChild(rt); // update the rich text editor now so it is redrawn and // after that, update the accordion so it can reset itself // to the right content size of the panels. If sizeToContent // wouldn't be set to true, the following two lines wouldn't // be required. rt.updateNow(); acc.update();
getPanelAt | () | method |
public function getPanelAt(index:int):AccordionPanel
Returns the panel at the specified index.
Parametersindex:int |
AccordionPanel |
isOpen | () | method |
public function isOpen(panel:AccordionPanel):Boolean
Returns if the specified panel is open.
Parameterspanel:AccordionPanel |
Boolean |
lockPanel | () | method |
public function lockPanel(panel:AccordionPanel):void
Locks the specified panel so header clicks have no effect.
Parameterspanel:AccordionPanel |
openPanel | () | method |
public function openPanel(panel:AccordionPanel, animated:Boolean = true):void
Opens the specified panel.
Parameterspanel:AccordionPanel |
|
animated:Boolean (default = true )
|
removePanel | () | method |
public function removePanel(panel:AccordionPanel):AccordionPanel
Removes the specified panel from the component.
Parameterspanel:AccordionPanel |
AccordionPanel |
setAnimation | () | method |
public function setAnimation(duration:int, easeInOut:Boolean = true, openCloseEffect:int = 0):void
Controls the panel animation.
Parametersduration:int — the amount of msec (between 0 and 5000) the animation takes.
|
|
easeInOut:Boolean (default = true ) — 0 = cover / uncover, 1 = push / pull, 2 = fold / unfold .
|
|
openCloseEffect:int (default = 0 )
|
unlockPanel | () | method |
public function unlockPanel(panel:AccordionPanel):void
Unlocks the specified panel.
Parameterspanel:AccordionPanel |
change | event |
flash.events.Event
The change event is broadcasted when there's a change in what panels are open or closed.
When panels are opened or closed by scripting, the event is not broadcasted.
It's also possible to use the onChange handler.
panelAnimationComplete | event |
flash.events.Event
The panelAnimationComplete event is broadcasted when all panels have arrived at the right position.
BOTTOM | constant |
public static const BOTTOM:int = 3
LEFT | constant |
public static const LEFT:int = 0
MODE_ALWAYS_ONE | constant |
public static const MODE_ALWAYS_ONE:int = 0
MODE_MAX_ONE | constant |
public static const MODE_MAX_ONE:int = 1
MODE_MULTI | constant |
public static const MODE_MULTI:int = 2
RIGHT | constant |
public static const RIGHT:int = 1
TOP | constant |
public static const TOP:int = 2