A visual component that can be collapsed and expanded. It is composed of a caption bar of type BiCollapsiblePanelCaption and a content panel. You can add any components that you want to the content panel. The caption holds a title text of type BiLabel and a collapse button of type BiButton used to collapse and expand the content panel area. Collapse and expand actions are animatied by a BiSizeAnimator. If you anchor this component top/left/right/bottom it is important that you set its orientation state accordingly. Depending on the orientation state the panel can collapse/expand vertically/horizontally and the collapse button images will update accordingly to reflect collapse state and achoring.

This class extends BiComponent and therefore all methods and fields available for BiComponent are also available for BiCollapsiblePanel .

Constructor

new BiCollapsiblePanel ( sTitle,sOrientation )

Parameters

NameTypeOptionalDefaultDescription
sTitleStringSets the title of the label in the caption
sOrientationStringSets the orientation of the component (see orientation property for detailed info)

Properties

NameTypegetsetDescription
animatorBiSizeAnimatorcheckedThe animator responsible for folding/unfolding
buttonOrientationStringcheckedcheckedThe position of the collapse button. Can be either "left" or "right. The default is right.
captionBiCollapsiblePanelCaptioncheckedThe caption container component
centerTitleBooleancheckedcheckedThis will cause the text of the title label to be centered as opposed to being aligned to the left.
contentPanelBiComponentcheckedcheckedAdd your own components here.
foldedBooleancheckedWhether the content panel is currently closed/folded or not.
initiallyFoldedBooleancheckedCauses the content panel to be initially folded when the component is first created. The default is false.
orientationStringcheckedcheckedIndicates the alignment of the caption which also sets the expand direction. Valid values are "north" (meant to expand downwards), "south" (meant to expand upwards), "east" (meant to expand to the right), "west" (meant to expand to the left). east/west therefore expands horizontally and north/south expands vertically.
showCaptionBackgroundBooleancheckedcheckedWhether the caption bar should have visible background chrome or not.
showCollapseButtonBooleancheckedcheckedShow or hide the collapse button
speedNumber/StringcheckedcheckedThe duration of the animation. This is a convenience property that is delegated to the animator. For more information see the speed property of BiSizeAnimator.
titleStringcheckedcheckedText of the caption label.
toggleFoldingOnCaptionClickBooleancheckedcheckedIf the panel should collapse or not when the caption is clicked. The default is false.

Methods

NameDescription
foldThis will close the content panel.
toggleFoldingOpens/closes the content panel.
unfoldThis will open the content panel.

Events

NameTypeBubblesDescription
beforecollapseBiEventThe panel is about to close
beforeexpandBiEventThe panel is about to open
collapsedBiEventThe panel was closed
expandedBiEventThe panel was opened

Static Methods

NameDescription
getVerticalOrientationReturns true if the expand direction is down or up for the panel, returns false if it is left or right.

Static Fields

None.

Enumerations

None.

Remarks

Requires you to include the animation package in the Adf. This component delegates some of its properties to child components.

Method Details

fold

This will close the content panel.

Syntax

object.fold ( [ bQuickFold ] )

Parameters

NameTypeOptionalDefaultDescription
bQuickFoldBooleancheckedDo not animate to folded state, just fold.

Return Type

void

toggleFolding

Opens/closes the content panel.

Syntax

object.toggleFolding ( )

Parameters

No arguments.

Return Type

void

unfold

This will open the content panel.

Syntax

object.unfold ( )

Parameters

No arguments.

Return Type

void

Static Method Details

getVerticalOrientation

Returns true if the expand direction is down or up for the panel, returns false if it is left or right.

Syntax

BiCollapsiblePanel . getVerticalOrientation ( sOrientation )

Parameters

NameTypeOptionalDefaultDescription
sOrientationStringString with one of the values north/south/west/east

Return Type

Boolean