Class sap.ui.commons.ResponsiveContainerModule: sap/ui/commons/ResponsiveContainer

extends Control

Is used to provide a container, which can show different content depending on its current width. It fires an event, whenever a new range is reached. In addition the content of the new range is automatically shown, if it is set.
Deprecated API:
Since version 1.38.
Constructor Summary
new sap.ui.commons.ResponsiveContainer(sId?, mSettings?)Constructor for a new ResponsiveContainer.
Event Summary
rangeSwitch(oControlEvent)The event is fired the width of the container reaches a new range.
Events borrowed from class sap.ui.core.Control
Method Summary
sap.ui.commons.ResponsiveContainer.extend(sClassName, oClassInfo?, FNMetaImpl?)Creates a new subclass of class sap.ui.commons.ResponsiveContainer with name sClassName and enriches it with the information contained in oClassInfo.
sap.ui.commons.ResponsiveContainer.getMetadata()Returns a metadata object for class sap.ui.commons.ResponsiveContainer.
addRange(oRange)Adds some range to the aggregation ranges.
attachRangeSwitch(oData?, fnFunction, oListener?)Attaches event handler fnFunction to the rangeSwitch event of this sap.ui.commons.ResponsiveContainer.
destroyRanges()Destroys all the ranges in the aggregation ranges.
detachRangeSwitch(fnFunction, oListener)Detaches event handler fnFunction from the rangeSwitch event of this sap.ui.commons.ResponsiveContainer.
fireRangeSwitch(mParameters?)Fires event rangeSwitch to attached listeners.
getDefaultContent()ID of the element which is the current target of the association defaultContent, or null.
getHeight()Gets current value of property height.
getRanges()Gets content of aggregation ranges.
getWidth()Gets current value of property width.
indexOfRange(oRange)Checks for the provided sap.ui.commons.ResponsiveContainerRange in the aggregation ranges.
insertRange(oRange, iIndex)Inserts a range into the aggregation ranges.
removeAllRanges()Removes all the controls from the aggregation ranges.
removeRange(vRange)Removes a range from the aggregation ranges.
setDefaultContent(oDefaultContent)Sets the associated defaultContent.
setHeight(sHeight)Sets a new value for property height.
setWidth(sWidth)Sets a new value for property width.
Constructor Detail
new sap.ui.commons.ResponsiveContainer(sId?, mSettings?)

Constructor for a new ResponsiveContainer.

Accepts an object literal mSettings that defines initial property values, aggregated and associated objects as well as event handlers. See sap.ui.base.ManagedObject for a general description of the syntax of the settings object.

The supported settings are:

  • Properties

    • width : sap.ui.core.CSSSize (default: 100%)
    • height : sap.ui.core.CSSSize (default: 100%)

  • Aggregations

    • ranges : sap.ui.commons.ResponsiveContainerRange[]

  • Associations

  • Events

    • rangeSwitch : fnListenerFunction or [fnListenerFunction, oListenerObject] or [oData, fnListenerFunction, oListenerObject]

In addition, all settings applicable to the base type sap.ui.core.Control can be used as well.

Parameters:
stringsId?id for the new control, generated automatically if no id is given
objectmSettings?initial settings for the new control
Event Detail
rangeSwitch(oControlEvent)
The event is fired the width of the container reaches a new range.
Parameters:
sap.ui.base.EventoControlEvent
sap.ui.base.EventProvideroControlEvent.getSource
objectoControlEvent.getParameters
sap.ui.commons.ResponsiveContainerRangeoControlEvent.getParameters.currentRangeThe current range
Method Detail
sap.ui.commons.ResponsiveContainer.extend(sClassName, oClassInfo?, FNMetaImpl?): function

Creates a new subclass of class sap.ui.commons.ResponsiveContainer with name sClassName and enriches it with the information contained in oClassInfo.

oClassInfo might contain the same kind of information as described in sap.ui.core.Control.extend.

Parameters:
stringsClassNameName of the class being created
objectoClassInfo?Object literal with information about the class
functionFNMetaImpl?Constructor function for the metadata object; if not given, it defaults to sap.ui.core.ElementMetadata
Returns:
functionCreated class / constructor function
sap.ui.commons.ResponsiveContainer.getMetadata(): sap.ui.base.Metadata
Returns a metadata object for class sap.ui.commons.ResponsiveContainer.
Returns:
sap.ui.base.MetadataMetadata object describing this class
Adds some range to the aggregation ranges.
Parameters:
sap.ui.commons.ResponsiveContainerRangeoRangethe range to add; if empty, nothing is inserted
Returns:
sap.ui.commons.ResponsiveContainerReference to this in order to allow method chaining
attachRangeSwitch(oData?, fnFunction, oListener?): sap.ui.commons.ResponsiveContainer

Attaches event handler fnFunction to the rangeSwitch event of this sap.ui.commons.ResponsiveContainer.

When called, the context of the event handler (its this) will be bound to oListener if specified, otherwise it will be bound to this sap.ui.commons.ResponsiveContainer itself.

The event is fired the width of the container reaches a new range.

Parameters:
objectoData?An application-specific payload object that will be passed to the event handler along with the event object when firing the event
functionfnFunctionThe function to be called when the event occurs
objectoListener?Context object to call the event handler with. Defaults to this sap.ui.commons.ResponsiveContainer itself
Returns:
sap.ui.commons.ResponsiveContainerReference to this in order to allow method chaining
Destroys all the ranges in the aggregation ranges.
Returns:
sap.ui.commons.ResponsiveContainerReference to this in order to allow method chaining
detachRangeSwitch(fnFunction, oListener): sap.ui.commons.ResponsiveContainer

Detaches event handler fnFunction from the rangeSwitch event of this sap.ui.commons.ResponsiveContainer.

The passed function and listener object must match the ones used for event registration.

Parameters:
functionfnFunctionThe function to be called, when the event occurs
objectoListenerContext object on which the given function had to be called
Returns:
sap.ui.commons.ResponsiveContainerReference to this in order to allow method chaining
fireRangeSwitch(mParameters?): sap.ui.commons.ResponsiveContainer
Fires event rangeSwitch to attached listeners.
Parameters:
objectmParameters?Parameters to pass along with the event
sap.ui.commons.ResponsiveContainerRangemParameters.currentRange?The current range
Returns:
sap.ui.commons.ResponsiveContainerReference to this in order to allow method chaining
getDefaultContent(): sap.ui.core.ID
ID of the element which is the current target of the association defaultContent, or null.
Returns:
sap.ui.core.ID
getHeight(): sap.ui.core.CSSSize

Gets current value of property height.

The width of the responsive container.

Default value is 100%.

Returns:
sap.ui.core.CSSSizeValue of property height

Gets content of aggregation ranges.

The ranges defined for this container

Returns:
sap.ui.commons.ResponsiveContainerRange[]
getWidth(): sap.ui.core.CSSSize

Gets current value of property width.

The width of the responsive container.

Default value is 100%.

Returns:
sap.ui.core.CSSSizeValue of property width
indexOfRange(oRange): int
Checks for the provided sap.ui.commons.ResponsiveContainerRange in the aggregation ranges. and returns its index if found or -1 otherwise.
Parameters:
sap.ui.commons.ResponsiveContainerRangeoRangeThe range whose index is looked for
Returns:
intThe index of the provided control in the aggregation if found, or -1 otherwise
insertRange(oRange, iIndex): sap.ui.commons.ResponsiveContainer
Inserts a range into the aggregation ranges.
Parameters:
sap.ui.commons.ResponsiveContainerRangeoRangethe range to insert; if empty, nothing is inserted
intiIndexthe 0-based index the range should be inserted at; for a negative value of iIndex, the range is inserted at position 0; for a value greater than the current size of the aggregation, the range is inserted at the last position
Returns:
sap.ui.commons.ResponsiveContainerReference to this in order to allow method chaining

Removes all the controls from the aggregation ranges.

Additionally, it unregisters them from the hosting UIArea.

Returns:
sap.ui.commons.ResponsiveContainerRange[]An array of the removed elements (might be empty)
Removes a range from the aggregation ranges.
Parameters:
int|string|sap.ui.commons.ResponsiveContainerRangevRangeThe range to remove or its index or id
Returns:
sap.ui.commons.ResponsiveContainerRangeThe removed range or null
setDefaultContent(oDefaultContent): sap.ui.commons.ResponsiveContainer
Sets the associated defaultContent.
Parameters:
sap.ui.core.ID|sap.ui.core.ControloDefaultContentID of an element which becomes the new target of this defaultContent association; alternatively, an element instance may be given
Returns:
sap.ui.commons.ResponsiveContainerReference to this in order to allow method chaining

Sets a new value for property height.

The width of the responsive container.

When called with a value of null or undefined, the default value of the property will be restored.

Default value is 100%.

Parameters:
sap.ui.core.CSSSizesHeightNew value for property height
Returns:
sap.ui.commons.ResponsiveContainerReference to this in order to allow method chaining

Sets a new value for property width.

The width of the responsive container.

When called with a value of null or undefined, the default value of the property will be restored.

Default value is 100%.

Parameters:
sap.ui.core.CSSSizesWidthNew value for property width
Returns:
sap.ui.commons.ResponsiveContainerReference to this in order to allow method chaining