Print Friendly

# Class Ext.BasicLayoutRegion

Package: | Ext
Class: | BasicLayoutRegion
Extends: | Observable
Subclasses: | LayoutRegion
Defined In: | BasicLayoutRegion.js

This class represents a lightweight region in a layout manager. This region does not move dom nodes and does not have a titlebar, tabs or any other features. All it does is size and position panels. To create a BasicLayoutRegion, add lightweight:true or basic:true to your regions config.
Properties - Methods - Events

## Public Properties

Property | Defined By
--- | ---
| panels : Ext.util.MixedCollection | BasicLayoutRegion
A collection of panels in this region.

## Public Methods

Method | Defined By
--- | ---
| add( `ContentPanel... panel` ) : Ext.ContentPanel | BasicLayoutRegion
Add the passed ContentPanel(s)
| addEvents( `Object object` ) : void | Observable
Used to define events on this Observable
| addListener( `String eventName`, `Function handler`, [`Object scope`], [`Object options`] ) : void | Observable
Appends an event handler to this component
| fireEvent( `String eventName`, `Object... args` ) : Boolean | Observable
Fires the specified event with the passed parameters (minus the event name).
| getActivePanel() : Ext.ContentPanel | BasicLayoutRegion
Get the active panel for this region.
| getEl() : Ext.Element | BasicLayoutRegion
Returns the container element for this region.
| getPanel( `Number/String/ContentPanel panel` ) : Ext.ContentPanel | BasicLayoutRegion
Returns the panel specified or null if it's not in this region.
| getPosition() : String | BasicLayoutRegion
Returns this regions position (north/south/east/west/center).
| hasListener( `String eventName` ) : Boolean | Observable
Checks to see if this object has any listeners for a specified event
| hasPanel( `Number/String/ContentPanel panel` ) : Boolean | BasicLayoutRegion
Returns true if the panel is in this region.
| isVisible() : Boolean | BasicLayoutRegion
Returns true if this region is currently visible.
| on( `String eventName`, `Function handler`, [`Object scope`], [`Object options`] ) : void | Observable
Appends an event handler to this element (shorthand for addListener)
| purgeListeners() : void | Observable
Removes all listeners for this object
| remove( `Number/String/ContentPanel panel`, `Boolean preservePanel` ) : Ext.ContentPanel | BasicLayoutRegion
Removes the specified panel. If preservePanel is not true (either here or in the config), the panel is destroyed.
| removeListener( `String eventName`, `Function handler`, [`Object scope`] ) : void | Observable
Removes a listener
| resizeTo( `Number newSize` ) : void | BasicLayoutRegion
Resizes the region to the specified size. For vertical regions (west, east) this adjusts the width, for horizontal (...
| showPanel( `Number/String/ContentPanel panelId` ) : Ext.ContentPanel | BasicLayoutRegion
Show the specified panel.
| un( `String eventName`, `Function handler`, [`Object scope`] ) : void | Observable
Removes a listener (shorthand for removeListener)

## Public Events

Event | Defined By
--- | ---
| beforeremove : ( `Ext.LayoutRegion this`, `Ext.ContentPanel panel`, `Object e` ) | BasicLayoutRegion
Fires before a panel is removed (or closed). To cancel the removal set "e.cancel = true" on the event argument.
| collapsed : ( `Ext.LayoutRegion this` ) | BasicLayoutRegion
Fires when this region is collapsed.
| expanded : ( `Ext.LayoutRegion this` ) | BasicLayoutRegion
Fires when this region is expanded.
| invalidated : ( `Ext.LayoutRegion this` ) | BasicLayoutRegion
Fires when the layout for this region is changed.
| panelactivated : ( `Ext.LayoutRegion this`, `Ext.ContentPanel panel` ) | BasicLayoutRegion
Fires when a panel is activated.
| paneladded : ( `Ext.LayoutRegion this`, `Ext.ContentPanel panel` ) | BasicLayoutRegion
Fires when a panel is added.
| panelremoved : ( `Ext.LayoutRegion this`, `Ext.ContentPanel panel` ) | BasicLayoutRegion
Fires when a panel is removed.
| resized : ( `Ext.LayoutRegion this`, `Number newSize` ) | BasicLayoutRegion
Fires when the user resizes this region.
| slidehide : ( `Ext.LayoutRegion this` ) | BasicLayoutRegion
Fires when this region slides out of view.
| slideshow : ( `Ext.LayoutRegion this` ) | BasicLayoutRegion
Fires when this region is slid into view.
| visibilitychange : ( `Ext.LayoutRegion this`, `Boolean visibility` ) | BasicLayoutRegion
Fires when this region is shown or hidden

## Property Details

### panels

`public Ext.util.MixedCollection panels`
A collection of panels in this region.
This property is defined by BasicLayoutRegion.

## Method Details

### add

`public function add( `ContentPanel... panel` )`
Add the passed ContentPanel(s)
Parameters:

- `panel` : ContentPanel...
  The ContentPanel(s) to add (you can pass more than one)

Returns:

- `Ext.ContentPanel`
  The panel added (if only one was added)

This method is defined by BasicLayoutRegion.

### addEvents

`public function addEvents( `Object object` )`
Used to define events on this Observable
Parameters:

- `object` : Object
  The object with the events defined

Returns:

- `void`

This method is defined by Observable.

### addListener

`public function addListener( `String eventName`, `Function handler`, [`Object scope`], [`Object options`] )`
Appends an event handler to this component
Parameters:

- `eventName` : String
  The type of event to listen for
- `handler` : Function
  The method the event invokes
- `scope` : Object
  (optional) The scope in which to execute the handler function. The handler function's "this" context.
- `options` : Object
  (optional) An object containing handler configuration properties. This may contain any of the following properties:
  - scope {Object} The scope in which to execute the handler function. The handler function's "this" context.
  - delay {Number} The number of milliseconds to delay the invocation of the handler after te event fires.
  - single {Boolean} True to add a handler to handle just the next firing of the event, and then remove itself.
  - buffer {Number} Causes the handler to be scheduled to run in an Ext.util.DelayedTask delayed by the specified number of milliseconds. If the event fires again within that time, the original handler is not invoked, but the new handler is scheduled in its place.

  Combining Options
  Using the options argument, it is possible to combine different types of listeners:
  A normalized, delayed, one-time listener that auto stops the event and passes a custom argument (forumId)

      el.on('click', this.onClick, this, {
       			single: true,
          		delay: 100,
          		forumId: 4
      		});

  Attaching multiple handlers in 1 call
  The method also allows for a single argument to be passed which is a config object containing properties which specify multiple handlers.

      el.on({
      			'click': {
              		fn: this.onClick,
              		scope: this,
              		delay: 100
          		},
          		'mouseover': {
              		fn: this.onMouseOver,
              		scope: this
          		},
          		'mouseout': {
              		fn: this.onMouseOut,
              		scope: this
          		}
      		});

  Or a shorthand syntax which passes the same scope object to all handlers:

      el.on({
      			'click': this.onClick,
          		'mouseover': this.onMouseOver,
          		'mouseout': this.onMouseOut,
          		scope: this
      		});

Returns:

- `void`

This method is defined by Observable.

### fireEvent

`public function fireEvent( `String eventName`, `Object... args` )`
Fires the specified event with the passed parameters (minus the event name).
Parameters:

- `eventName` : String
- `args` : Object...
  Variable number of parameters are passed to handlers

Returns:

- `Boolean`
  returns false if any of the handlers return false otherwise it returns true

This method is defined by Observable.

### getActivePanel

`public function getActivePanel()`
Get the active panel for this region.
Parameters:

- None.

Returns:

- `Ext.ContentPanel`
  The active panel or null

This method is defined by BasicLayoutRegion.

### getEl

`public function getEl()`
Returns the container element for this region.
Parameters:

- None.

Returns:

- `Ext.Element`

This method is defined by BasicLayoutRegion.

### getPanel

`public function getPanel( `Number/String/ContentPanel panel` )`
Returns the panel specified or null if it's not in this region.
Parameters:

- `panel` : Number/String/ContentPanel
  The panels index, id or the panel itself

Returns:

- `Ext.ContentPanel`

This method is defined by BasicLayoutRegion.

### getPosition

`public function getPosition()`
Returns this regions position (north/south/east/west/center).
Parameters:

- None.

Returns:

- `String`

This method is defined by BasicLayoutRegion.

### hasListener

`public function hasListener( `String eventName` )`
Checks to see if this object has any listeners for a specified event
Parameters:

- `eventName` : String
  The name of the event to check for

Returns:

- `Boolean`
  True if the event is being listened for, else false

This method is defined by Observable.

### hasPanel

`public function hasPanel( `Number/String/ContentPanel panel` )`
Returns true if the panel is in this region.
Parameters:

- `panel` : Number/String/ContentPanel
  The panels index, id or the panel itself

Returns:

- `Boolean`

This method is defined by BasicLayoutRegion.

### isVisible

`public function isVisible()`
Returns true if this region is currently visible.
Parameters:

- None.

Returns:

- `Boolean`

This method is defined by BasicLayoutRegion.

### on

`public function on( `String eventName`, `Function handler`, [`Object scope`], [`Object options`] )`
Appends an event handler to this element (shorthand for addListener)
Parameters:

- `eventName` : String
  The type of event to listen for
- `handler` : Function
  The method the event invokes
- `scope` : Object
  (optional) The scope in which to execute the handler function. The handler function's "this" context.
- `options` : Object
  (optional)

Returns:

- `void`

This method is defined by Observable.

### purgeListeners

`public function purgeListeners()`
Removes all listeners for this object
Parameters:

- None.

Returns:

- `void`

This method is defined by Observable.

### remove

`public function remove( `Number/String/ContentPanel panel`, `Boolean preservePanel` )`
Removes the specified panel. If preservePanel is not true (either here or in the config), the panel is destroyed.
Parameters:

- `panel` : Number/String/ContentPanel
  The panels index, id or the panel itself
- `preservePanel` : Boolean
  Overrides the config preservePanel option

Returns:

- `Ext.ContentPanel`
  The panel that was removed

This method is defined by BasicLayoutRegion.

### removeListener

`public function removeListener( `String eventName`, `Function handler`, [`Object scope`] )`
Removes a listener
Parameters:

- `eventName` : String
  The type of event to listen for
- `handler` : Function
  The handler to remove
- `scope` : Object
  (optional) The scope (this object) for the handler

Returns:

- `void`

This method is defined by Observable.

### resizeTo

`public function resizeTo( `Number newSize` )`
Resizes the region to the specified size. For vertical regions (west, east) this adjusts the width, for horizontal (north, south) the height.
Parameters:

- `newSize` : Number
  The new width or height

Returns:

- `void`

This method is defined by BasicLayoutRegion.

### showPanel

`public function showPanel( `Number/String/ContentPanel panelId` )`
Show the specified panel.
Parameters:

- `panelId` : Number/String/ContentPanel
  The panels index, id or the panel itself

Returns:

- `Ext.ContentPanel`
  The shown panel or null

This method is defined by BasicLayoutRegion.

### un

`public function un( `String eventName`, `Function handler`, [`Object scope`] )`
Removes a listener (shorthand for removeListener)
Parameters:

- `eventName` : String
  The type of event to listen for
- `handler` : Function
  The handler to remove
- `scope` : Object
  (optional) The scope (this object) for the handler

Returns:

- `void`

This method is defined by Observable.

## Event Details

### beforeremove

`public event beforeremove`
Fires before a panel is removed (or closed). To cancel the removal set "e.cancel = true" on the event argument.
Subscribers will be called with the following parameters:

- `this` : Ext.LayoutRegion
- `panel` : Ext.ContentPanel
  The panel
- `e` : Object
  The cancel event object

This event is defined by BasicLayoutRegion.

### collapsed

`public event collapsed`
Fires when this region is collapsed.
Subscribers will be called with the following parameters:

- `this` : Ext.LayoutRegion

This event is defined by BasicLayoutRegion.

### expanded

`public event expanded`
Fires when this region is expanded.
Subscribers will be called with the following parameters:

- `this` : Ext.LayoutRegion

This event is defined by BasicLayoutRegion.

### invalidated

`public event invalidated`
Fires when the layout for this region is changed.
Subscribers will be called with the following parameters:

- `this` : Ext.LayoutRegion

This event is defined by BasicLayoutRegion.

### panelactivated

`public event panelactivated`
Fires when a panel is activated.
Subscribers will be called with the following parameters:

- `this` : Ext.LayoutRegion
- `panel` : Ext.ContentPanel
  The activated panel

This event is defined by BasicLayoutRegion.

### paneladded

`public event paneladded`
Fires when a panel is added.
Subscribers will be called with the following parameters:

- `this` : Ext.LayoutRegion
- `panel` : Ext.ContentPanel
  The panel

This event is defined by BasicLayoutRegion.

### panelremoved

`public event panelremoved`
Fires when a panel is removed.
Subscribers will be called with the following parameters:

- `this` : Ext.LayoutRegion
- `panel` : Ext.ContentPanel
  The panel

This event is defined by BasicLayoutRegion.

### resized

`public event resized`
Fires when the user resizes this region.
Subscribers will be called with the following parameters:

- `this` : Ext.LayoutRegion
- `newSize` : Number
  The new size (width for east/west, height for north/south)

This event is defined by BasicLayoutRegion.

### slidehide

`public event slidehide`
Fires when this region slides out of view.
Subscribers will be called with the following parameters:

- `this` : Ext.LayoutRegion

This event is defined by BasicLayoutRegion.

### slideshow

`public event slideshow`
Fires when this region is slid into view.
Subscribers will be called with the following parameters:

- `this` : Ext.LayoutRegion

This event is defined by BasicLayoutRegion.

### visibilitychange

`public event visibilitychange`
Fires when this region is shown or hidden
Subscribers will be called with the following parameters:

- `this` : Ext.LayoutRegion
- `visibility` : Boolean
  true or false

This event is defined by BasicLayoutRegion.

Ext - Copyright © 2006-2007 Ext JS, LLC
All rights reserved.