Packageardisia.components.pane
Classpublic class Pane
InheritancePane Inheritance spark.components.Panel
Subclasses DataPane, ProgressDisplayBase

Pane instances are containers that can function as a simple container in their "normal" state, but can be floated and interacted with as if they are windows when floatPane() is called.

Note that the minimized and maximized properties do not do anything by default. Either the skin must implement any visual changes or an external class must handle any changes. The maximize skin part only changes when the minimized and maximized property values.

Be sure to call closeFloatedPane() when moving a pane to and from a float state to remove relevant listeners in both this control and any possible control bars. Do not simply remove the Pane from the displayList before calling closeFloatedPane().

To remove the pane and make it eligible for garbage collection, call dispose().

View the technical documentation on the Ardisia Labs website for more information.

Default MXML PropertymxmlContentFactory



Public Properties
 PropertyDefined By
  boundingMode : String
Set to bound the entire pane to the screen or no bounding at all.
Pane
  canBeDocked : Boolean = true
True to allow the pane to docked to a PaneNavigator when dragged over.
Pane
  canBeFloated : Boolean = true
Whether the pane can be floated.
Pane
  canBeResized : Boolean
True to allow the pane to be resized via mouse interaction while floated.
Pane
  displayCloseButton : Boolean
True to allow the pane to be closed via mouse interaction while floated.
Pane
  displayMaximizedButton : Boolean
True to allow the pane to be maximized via mouse interaction while floated.
Pane
  displayMinimizedButton : Boolean
True to allow the pane to be minimized via mouse interaction while floated.
Pane
  draggable : Boolean
True to allow the pane to be dragged while floated.
Pane
  icon : Object
The pane icon.
Pane
  includeInControlBar : Boolean = true
False to signal that a floatPaneControlBar should not manage this pane.
Pane
  isDragging : Boolean
[read-only] True if the pane is currently being dragged.
Pane
  isFloating : Boolean
[read-only] Whether the pane is currently floated.
Pane
  maximized : Boolean
Any visual changes must be handled by the skin or an external class.
Pane
  minimized : Boolean
Any visual changes must be handled by the skin or an external class.
Pane
  resizeThreshold : Number = 7
The threshold within the outer boundaries of the transformRegionPart that will trigger a pane resize, rather than a drag.
Pane
  restoreRectangle : Rectangle
The rectangle that describes the measurements and layout for a pane before it is maximized or minimized in the coordinate space of the pane's systemManager.
Pane
  title : String
[override] The pane title.
Pane
Protected Properties
 PropertyDefined By
  moveEffect : Move3D
Used for float/closeFloat animations.
Pane
  queueCenter : Boolean
Pane
  queueClose : Boolean
Pane
  queueCloseProperties : Object
Pane
  queueOpen : Boolean
Pane
  queueOpenProperties : Object
Pane
Public Methods
 MethodDefined By
  
center():void
Call to center the pane.
Pane
  
closeFloatedPane(skipTransition:Boolean = false):void
If the pane is floated, will be closed and unfloated.
Pane
  
dispose():void
Call dispose() to remove the pane from the display list and remove all of the attached listeners.
Pane
  
End a drag.
Pane
  
floatPane(parentElement:DisplayObject, modal:Boolean = false, center:Boolean = false, animateIn:Boolean = true, childList:String = null, moduleFactory:IFlexModuleFactory = null):void
Float the pane.
Pane
  
Start a drag.
Pane
  
updateBounds(proposedRect:Rectangle = null):void
Constrain the pane based on the "boundingMode" property.
Pane
Protected Methods
 MethodDefined By
  
checkDock(event:MouseEvent):void
Check if hovering over any PaneNavigatorBase controls.
Pane
  
closeButtonPartHandler(event:Event):void
Handles events for the close button.
Pane
  
effectHandler(event:Event):void
Handles events for effects.
Pane
  
eventHandler(event:Event):void
Handles events on the control.
Pane
  
Get the string description of where the mouse cursor is in relation to the edges of the dragRegionPart and the "resizeThreshold".
Pane
  
maximizeButtonPartHandler(event:Event):void
Handles events for the maximize button.
Pane
  
minimizeButtonPartHandler(event:Event):void
Handles dragging events for the minimize button.
Pane
  
modalHandler(event:Event):void
Handles events for modal checks.
Pane
  
Change the skin state and dispatch a "minimizeChange" event after the state changes.
Pane
  
Change the skin state and dispatch a "minimizeChange" event after the state changes.
Pane
  
Setup the animation for floating and closing.
Pane
  
skinHandler(event:Event):void
Handles events on the skin.
Pane
  
transformRegionPartHandler(event:Event):void
Handles events for resizing.
Pane
  
Update the close button part.
Pane
  
Update the icon part.
Pane
  
Update the maximize button part.
Pane
  
Update the minimize part.
Pane
  
Update the title part.
Pane
  
Update the transformRegion part.
Pane
Events
 Event Summary Defined By
  Dispatched when a floated pane is closed.Pane
  Dispatched when the "displayCloseButton" property changes.Pane
  Dispatched when the pane is docked to a pane navigator.Pane
  Dispatched repeatedly when a pane is being dragged.Pane
  Dispatched when a pane drag ends.Pane
  Dispatched before a pane drag begins.Pane
  Dispatched when the pane is floated.Pane
  Dispatched when a floating pane is focused and activated by the flex window manager.Pane
  Dispatched when a previously focused and active floating pane loses focus and is deactivated by the window manager.Pane
  Dispatched when the pane icon changes.Pane
  Dispatched when the maximize property value changes.Pane
  Dispatched when the minimize property value changes.Pane
  Dispatched right before an animate in animation runs.Pane
  Dispatched when the pane title changes.Pane
Styles
 Style Description Defined By
  
alphaOverPaneNavigator
Type: Number CSS Inheritance: no
The alpha to set the pane to when hovering over a PaneNavigator and the pane can be docked. The default value is 0.5.
Pane
  
backgroundAlpha
Type: Number CSS Inheritance: no
ONLY APPLICABLE WHEN THE PANE IS FLOATED.

Alpha of the background for this component. Valid values range from 0.0 to 1.0.

The default value is 1.
Pane
  
backgroundColor
Type: uint CSS Inheritance: no
ONLY APPLICABLE WHEN THE PANE IS FLOATED.

Background color of this component.

The default value is #FFFFFF.
Pane
  
paneChrome
Type: Number CSS Inheritance: no
ONLY APPLICABLE WHEN THE PANE IS FLOATED. Color of the chrome for a floated pane. The default value is #DDDDDD.
Pane
Skin Parts

This component uses skins made up of skin parts. Do not set the skin parts directly. The component's skin sets the skin parts.


 Skin Part Description Defined By
  
closeButtonPart:spark.components.supportClasses.ButtonBase
Required: false Part Type: Static
Optional button used to close the pane. Typically displayed when floating. If the "displayCloseButton" property is false, and this skin part is displayed, it will be disabled, hidden, and removed from layout.
Pane
  
iconPart:spark.primitives.BitmapImage
Required: false Part Type: Static
Bitmap image used to display the pane icon. Displayed when floating.
Pane
  
maximizeButtonPart:MaximizeButton
Required: false Part Type: Static
Optional button used to maximize a floating pane to fill the viewable screen real estate. If the "displayMaximizedButton" property is false, it will be disabled, hidden, and removed from layout.
Pane
  
minimizeButtonPart:spark.components.supportClasses.ButtonBase
Required: false Part Type: Static
Optional button used to change the floating pane. If the "displayMinimizedButton" property is false, it will be disabled, hidden, and removed from layout.
Pane
  
titleLabelPart:spark.components.supportClasses.TextBase
Required: false Part Type: Static
The label that displays the pane title. Typically displayed when floating.
Pane
  
transformRegionPart:spark.components.Group
Required: false Part Type: Static
Region of the pane that is resizable via mouse interaction when floated if the "canBeResized" property is true and the mouse is within the "resizeThreshold". Is also the region of the pane that is draggable via mouse interaction when: floated , the "draggable" property is true, the mouse is down, and the cursor is not within the "resizeThreshold".
Pane
Skin States

To skin the component, implement a skin that defines the following states. Although you must implement all skin states, a skin state can be empty. An empty skin state specifies no changes to the default skin state.


 Skin State Description Defined By
  
disabled
Pane
  
disabledAndFloating
Pane
  
disabledAndFloatingAndInactive
Pane
  
disabledAndFloatingAndInactiveWithControlBar
Pane
  
disabledAndFloatingWithControlBar
Pane
  
disabledWithControlBar
Pane
  
floating
Pane
  
floatingAndInactive
Pane
  
floatingAndInactiveWithControlBar
Pane
  
floatingWithControlBar
Pane
  
normal
Pane
  
normalWithControlBar
Pane
Property Detail
boundingModeproperty
boundingMode:String

Set to bound the entire pane to the screen or no bounding at all.

The default value is "none".


Implementation
    public function get boundingMode():String
    public function set boundingMode(value:String):void
canBeDockedproperty 
public var canBeDocked:Boolean = true

True to allow the pane to docked to a PaneNavigator when dragged over.

The default value is true.

canBeFloatedproperty 
public var canBeFloated:Boolean = true

Whether the pane can be floated.

NOTE: even if this property is true, the pane can still be floated programmatically. This property is intended to signal the intention of the developer as to whether this pane should be floated, not whether it can be floated.

The default value is true.

canBeResizedproperty 
canBeResized:Boolean

True to allow the pane to be resized via mouse interaction while floated.

Can still be resized programmatically even if this property is false.

The default value is true.


Implementation
    public function get canBeResized():Boolean
    public function set canBeResized(value:Boolean):void
displayCloseButtonproperty 
displayCloseButton:Boolean

True to allow the pane to be closed via mouse interaction while floated.

Can still be closed programmatically even if this property is false.

The default value is true.


Implementation
    public function get displayCloseButton():Boolean
    public function set displayCloseButton(value:Boolean):void
displayMaximizedButtonproperty 
displayMaximizedButton:Boolean

True to allow the pane to be maximized via mouse interaction while floated.

Can still be maximized programmatically even if this property is false.

The default value is false.


Implementation
    public function get displayMaximizedButton():Boolean
    public function set displayMaximizedButton(value:Boolean):void
displayMinimizedButtonproperty 
displayMinimizedButton:Boolean

True to allow the pane to be minimized via mouse interaction while floated.

Can still be minimized programmatically even if this property is false.

The default value is false.


Implementation
    public function get displayMinimizedButton():Boolean
    public function set displayMinimizedButton(value:Boolean):void
draggableproperty 
draggable:Boolean

True to allow the pane to be dragged while floated.

The default value is true.


Implementation
    public function get draggable():Boolean
    public function set draggable(value:Boolean):void
iconproperty 
icon:Object

The pane icon.

This property is bindable and is bound to the "iconChange" event.

The default value is null.

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


Implementation
    public function get icon():Object
    public function set icon(value:Object):void
includeInControlBarproperty 
public var includeInControlBar:Boolean = true

False to signal that a floatPaneControlBar should not manage this pane.

See the docs for the FloatPaneControlBar class.

The default value is true.

isDraggingproperty 
isDragging:Boolean  [read-only]

True if the pane is currently being dragged.

The default value is false.


Implementation
    public function get isDragging():Boolean
isFloatingproperty 
isFloating:Boolean  [read-only]

Whether the pane is currently floated.


Implementation
    public function get isFloating():Boolean
maximizedproperty 
maximized:Boolean

Any visual changes must be handled by the skin or an external class.

This property is bindable.

The default value is false.

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


Implementation
    public function get maximized():Boolean
    public function set maximized(value:Boolean):void
minimizedproperty 
minimized:Boolean

Any visual changes must be handled by the skin or an external class.

This property is bindable.

The default value is false.

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


Implementation
    public function get minimized():Boolean
    public function set minimized(value:Boolean):void
moveEffectproperty 
protected var moveEffect:Move3D

Used for float/closeFloat animations.

queueCenterproperty 
protected var queueCenter:Boolean

queueCloseproperty 
protected var queueClose:Boolean

queueClosePropertiesproperty 
protected var queueCloseProperties:Object

queueOpenproperty 
protected var queueOpen:Boolean

queueOpenPropertiesproperty 
protected var queueOpenProperties:Object

resizeThresholdproperty 
public var resizeThreshold:Number = 7

The threshold within the outer boundaries of the transformRegionPart that will trigger a pane resize, rather than a drag.

The default value is 7.

restoreRectangleproperty 
public var restoreRectangle:Rectangle

The rectangle that describes the measurements and layout for a pane before it is maximized or minimized in the coordinate space of the pane's systemManager.

Useful to restore a floated pane layout after being changed from a maximized or minimized state into the simple floating state.

The default value is null.

titleproperty 
title:String[override]

The pane title.

This property is bindable and is bound to the "titleChange" event.

The default value is null.

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


Implementation
    public function get title():String
    public function set title(value:String):void
Method Detail
center()method
public function center():void

Call to center the pane.

checkDock()method 
protected function checkDock(event:MouseEvent):void

Check if hovering over any PaneNavigatorBase controls. If yes, calls the appropriate method on the navigator and allows for docking.

Only called is the "canBeDocked" property is true.

Parameters

event:MouseEvent — true if this check is for a drop

closeButtonPartHandler()method 
protected function closeButtonPartHandler(event:Event):void

Handles events for the close button.

Parameters

event:Event


Events
the — that triggered the handler
closeFloatedPane()method 
public function closeFloatedPane(skipTransition:Boolean = false):void

If the pane is floated, will be closed and unfloated. Will revert to the "normal" skin state.

Called automatically by the closeButtonPart.

Parameters

skipTransition:Boolean (default = false) — true to skip the closing animation transition

dispose()method 
public function dispose():void

Call dispose() to remove the pane from the display list and remove all of the attached listeners.

effectHandler()method 
protected function effectHandler(event:Event):void

Handles events for effects.

Parameters

event:Event — the Event that triggered the handler

endPaneDrag()method 
public function endPaneDrag():void

End a drag.

eventHandler()method 
protected function eventHandler(event:Event):void

Handles events on the control.

Parameters

event:Event — the Event that triggered the handler

floatPane()method 
public function floatPane(parentElement:DisplayObject, modal:Boolean = false, center:Boolean = false, animateIn:Boolean = true, childList:String = null, moduleFactory:IFlexModuleFactory = null):void

Float the pane. If the pane is already floating and you want to move to a different systemManager, close the pane first.

Parameters

parentElement:DisplayObject — DisplayObject used to determine SystemManager's layers and the reference point for the pane. It may not be the actual parent of the popup as all popups are parented by the SystemManager
 
modal:Boolean (default = false) — Boolean to make the floated pane modal
 
center:Boolean (default = false) — Boolean true to center the pane in the systemManager
 
animateIn:Boolean (default = true) — Boolean true to animate the pane into floating view
 
childList:String (default = null) — The child list in which to add the pop-up. One of PopUpManagerChildList.APPLICATION, PopUpManagerChildList.POPUP, or PopUpManagerChildList.PARENT (default)
 
moduleFactory:IFlexModuleFactory (default = null) — moduleFactory where this Pane should look for embedded fonts and style manager

getResizeMouseLocation()method 
protected function getResizeMouseLocation():String

Get the string description of where the mouse cursor is in relation to the edges of the dragRegionPart and the "resizeThreshold".

Returns
String — CompassQuadrant string
maximizeButtonPartHandler()method 
protected function maximizeButtonPartHandler(event:Event):void

Handles events for the maximize button.

Parameters

event:Event


Events
the — that triggered the handler
minimizeButtonPartHandler()method 
protected function minimizeButtonPartHandler(event:Event):void

Handles dragging events for the minimize button.

Parameters

event:Event


Events
the — that triggered the handler
modalHandler()method 
protected function modalHandler(event:Event):void

Handles events for modal checks.

Parameters

event:Event — the Event that triggered the handler

setMaximized()method 
protected function setMaximized():void

Change the skin state and dispatch a "minimizeChange" event after the state changes.

Note: no visual changes are made automatically. Any changes need to be made by an external class or in the skin.

setMinimized()method 
protected function setMinimized():void

Change the skin state and dispatch a "minimizeChange" event after the state changes.

Note: no visual changes are made automatically. Any changes need to be made by an external class or in the skin.

setupAnimation()method 
protected function setupAnimation():void

Setup the animation for floating and closing.

skinHandler()method 
protected function skinHandler(event:Event):void

Handles events on the skin.

Parameters

event:Event — the Event that triggered the handler

startPaneDrag()method 
public function startPaneDrag():void

Start a drag. Assume that the mouse button is down.

transformRegionPartHandler()method 
protected function transformRegionPartHandler(event:Event):void

Handles events for resizing.

Parameters

event:Event


Events
the — that triggered the handler
updateBounds()method 
public function updateBounds(proposedRect:Rectangle = null):void

Constrain the pane based on the "boundingMode" property.

Parameters

proposedRect:Rectangle (default = null) — Rectangle if passed, use this rectangle instead of the Pane rectangle to calculate position.

updateCloseButtonPart()method 
protected function updateCloseButtonPart():void

Update the close button part.

updateIconPart()method 
protected function updateIconPart():void

Update the icon part.

updateMaximizeButtonPart()method 
protected function updateMaximizeButtonPart():void

Update the maximize button part.

updateMinimizeButtonPart()method 
protected function updateMinimizeButtonPart():void

Update the minimize part.

updateTitleLabelPart()method 
protected function updateTitleLabelPart():void

Update the title part.

updateTransformRegionPart()method 
protected function updateTransformRegionPart():void

Update the transformRegion part.

Event Detail
closed Event
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched when a floated pane is closed.

displayCloseButtonChanged Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched when the "displayCloseButton" property changes.

docked Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched when the pane is docked to a pane navigator.

dragging Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched repeatedly when a pane is being dragged.

draggingEnd Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched when a pane drag ends.

draggingStarting Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched before a pane drag begins. Can be cancelled.

floated Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched when the pane is floated. Will bubble, so can be intercepted by the systemManager.

floatedPaneActive Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched when a floating pane is focused and activated by the flex window manager.

floatedPaneInactive Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched when a previously focused and active floating pane loses focus and is deactivated by the window manager.

iconChange Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched when the pane icon changes.

maximizeChange Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched when the maximize property value changes.

minimizeChange Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched when the minimize property value changes.

readyToAnimate Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched right before an animate in animation runs. Useful because this is the moment before animating but all the Pane's properties and dimensions are set.

titleChange Event  
Event Object Type: ardisia.components.pane.events.PaneEvent
PaneEvent.type property = ardisia.components.pane.events.PaneEvent

Dispatched when the pane title changes.