Class sap.m.TileContainerModule: sap/m/TileContainer

extends Control
known direct subclasses: PictureViewer, PictureViewer

A container that arranges same-size tiles nicely on carousel pages.


Since: 1.12.
Constructor Summary
new sap.m.TileContainer(sId?, mSettings?)Constructor for a new TileContainer.
Event Summary
tileAdd(oControlEvent)Fires when a Tile is added.
tileDelete(oControlEvent)Fires if a Tile is deleted in Edit mode.
tileMove(oControlEvent)Fires if a Tile is moved.
Events borrowed from class sap.ui.core.Control
Method Summary
sap.m.TileContainer.extend(sClassName, oClassInfo?, FNMetaImpl?)Creates a new subclass of class sap.m.TileContainer with name sClassName and enriches it with the information contained in oClassInfo.
sap.m.TileContainer.getMetadata()Returns a metadata object for class sap.m.TileContainer.
addTile(oTile)Adds a Tile to the end of the tiles collection.
attachTileAdd(oData?, fnFunction, oListener?)Attaches event handler fnFunction to the tileAdd event of this sap.m.TileContainer.
attachTileDelete(oData?, fnFunction, oListener?)Attaches event handler fnFunction to the tileDelete event of this sap.m.TileContainer.
attachTileMove(oData?, fnFunction, oListener?)Attaches event handler fnFunction to the tileMove event of this sap.m.TileContainer.
deleteTile(oTile)Deletes a Tile.
destroyTiles()Destroys all the tiles in the aggregation tiles.
detachTileAdd(fnFunction, oListener)Detaches event handler fnFunction from the tileAdd event of this sap.m.TileContainer.
detachTileDelete(fnFunction, oListener)Detaches event handler fnFunction from the tileDelete event of this sap.m.TileContainer.
detachTileMove(fnFunction, oListener)Detaches event handler fnFunction from the tileMove event of this sap.m.TileContainer.
fireTileAdd(mArguments?)Fires event tileAdd to attached listeners.
fireTileDelete(mArguments?)Fires event tileDelete to attached listeners.
fireTileMove(mArguments?)Fires event tileMove to attached listeners.
getAllowAdd()Gets current value of property allowAdd.
getEditable()Gets current value of property editable.
getHeight()Gets current value of property height.
getPageFirstTileIndex()Returns the index of the first Tile visible in the current page.
getTiles()Gets content of aggregation tiles.
getWidth()Gets current value of property width.
indexOfTile(oTile)Checks for the provided sap.m.Tile in the aggregation tiles.
insertTile(oTile, iIndex)Inserts a Tile to the given index.
moveTile(vTile, iNewIndex)Moves a given Tile to the given index.
removeAllTiles()Removes all the controls from the aggregation tiles.
removeTile(vTile)Removes a tile from the aggregation tiles.
scrollIntoView(vTile, bAnimated)Scrolls to the page where the given Tile or tile index is included.
scrollLeft()Scrolls one page to the left.
scrollRight()Scrolls one page to the right.
setAllowAdd(bAllowAdd)Sets a new value for property allowAdd.
setEditable(bValue)Sets the editable property to the TileContainer, allowing to move icons.
setHeight(sHeight)Sets a new value for property height.
setWidth(sWidth)Sets a new value for property width.
Constructor Detail
new sap.m.TileContainer(sId?, mSettings?)
Constructor for a new TileContainer.

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
  • Aggregations
    • tiles : sap.m.Tile[] (default)
  • Events
    • tileMove : fnListenerFunction or [fnListenerFunction, oListenerObject] or [oData, fnListenerFunction, oListenerObject]
    • tileDelete : fnListenerFunction or [fnListenerFunction, oListenerObject] or [oData, fnListenerFunction, oListenerObject]
    • tileAdd : 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:
{string}sId? ID for the new control, generated automatically if no ID is given
{object}mSettings? Initial settings for the new control
Event Detail
tileAdd(oControlEvent)
Fires when a Tile is added.
Parameters:
{sap.ui.base.Event}oControlEvent
{sap.ui.base.EventProvider}oControlEvent.getSource
{object}oControlEvent.getParameters
tileDelete(oControlEvent)
Fires if a Tile is deleted in Edit mode.
Parameters:
{sap.ui.base.Event}oControlEvent
{sap.ui.base.EventProvider}oControlEvent.getSource
{object}oControlEvent.getParameters
{sap.m.Tile}oControlEvent.getParameters.tile The deleted Tile.
tileMove(oControlEvent)
Fires if a Tile is moved.
Parameters:
{sap.ui.base.Event}oControlEvent
{sap.ui.base.EventProvider}oControlEvent.getSource
{object}oControlEvent.getParameters
{sap.m.Tile}oControlEvent.getParameters.tile The Tile that has been moved.
{int}oControlEvent.getParameters.newIndex The new index of the Tile in the tiles aggregation.
Method Detail
sap.m.TileContainer.extend(sClassName, oClassInfo?, FNMetaImpl?): function
Creates a new subclass of class sap.m.TileContainer 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:
{string}sClassName Name of the class being created
{object}oClassInfo? Object literal with information about the class
{function}FNMetaImpl? Constructor function for the metadata object; if not given, it defaults to sap.ui.core.ElementMetadata
Returns:
{function} Created class / constructor function
sap.m.TileContainer.getMetadata(): sap.ui.base.Metadata
Returns a metadata object for class sap.m.TileContainer.
Returns:
{sap.ui.base.Metadata} Metadata object describing this class
addTile(oTile): sap.m.TileContainer
Adds a Tile to the end of the tiles collection.
Parameters:
{sap.m.Tile}oTile The tile to add
Returns:
{sap.m.TileContainer} this pointer for chaining
attachTileAdd(oData?, fnFunction, oListener?): sap.m.TileContainer
Attaches event handler fnFunction to the tileAdd event of this sap.m.TileContainer.

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.m.TileContainer itself.

Fires when a Tile is added.

Parameters:
{object}oData? An application-specific payload object that will be passed to the event handler along with the event object when firing the event
{function}fnFunction The function to be called when the event occurs
{object}oListener? Context object to call the event handler with. Defaults to this sap.m.TileContainer itself
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining
attachTileDelete(oData?, fnFunction, oListener?): sap.m.TileContainer
Attaches event handler fnFunction to the tileDelete event of this sap.m.TileContainer.

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.m.TileContainer itself.

Fires if a Tile is deleted in Edit mode.

Parameters:
{object}oData? An application-specific payload object that will be passed to the event handler along with the event object when firing the event
{function}fnFunction The function to be called when the event occurs
{object}oListener? Context object to call the event handler with. Defaults to this sap.m.TileContainer itself
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining
attachTileMove(oData?, fnFunction, oListener?): sap.m.TileContainer
Attaches event handler fnFunction to the tileMove event of this sap.m.TileContainer.

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.m.TileContainer itself.

Fires if a Tile is moved.

Parameters:
{object}oData? An application-specific payload object that will be passed to the event handler along with the event object when firing the event
{function}fnFunction The function to be called when the event occurs
{object}oListener? Context object to call the event handler with. Defaults to this sap.m.TileContainer itself
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining
deleteTile(oTile): sap.m.TileContainer
Deletes a Tile.
Parameters:
{sap.m.Tile}oTile The tile to move
Returns:
{sap.m.TileContainer} this pointer for chaining
destroyTiles(): sap.m.TileContainer
Destroys all the tiles in the aggregation tiles.
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining
detachTileAdd(fnFunction, oListener): sap.m.TileContainer
Detaches event handler fnFunction from the tileAdd event of this sap.m.TileContainer.

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

Parameters:
{function}fnFunction The function to be called, when the event occurs
{object}oListener Context object on which the given function had to be called
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining
detachTileDelete(fnFunction, oListener): sap.m.TileContainer
Detaches event handler fnFunction from the tileDelete event of this sap.m.TileContainer.

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

Parameters:
{function}fnFunction The function to be called, when the event occurs
{object}oListener Context object on which the given function had to be called
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining
detachTileMove(fnFunction, oListener): sap.m.TileContainer
Detaches event handler fnFunction from the tileMove event of this sap.m.TileContainer.

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

Parameters:
{function}fnFunction The function to be called, when the event occurs
{object}oListener Context object on which the given function had to be called
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining
fireTileAdd(mArguments?): sap.m.TileContainer
Fires event tileAdd to attached listeners.
Parameters:
{Map}mArguments? The arguments to pass along with the event
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining
fireTileDelete(mArguments?): sap.m.TileContainer
Fires event tileDelete to attached listeners.

Expects the following event parameters:

  • tile of type sap.m.TileThe deleted Tile.
Parameters:
{Map}mArguments? The arguments to pass along with the event
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining
fireTileMove(mArguments?): sap.m.TileContainer
Fires event tileMove to attached listeners.

Expects the following event parameters:

  • tile of type sap.m.TileThe Tile that has been moved.
  • newIndex of type intThe new index of the Tile in the tiles aggregation.
Parameters:
{Map}mArguments? The arguments to pass along with the event
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining
getAllowAdd(): boolean
Gets current value of property allowAdd.

Determines whether the user is allowed to add Tiles in Edit mode (editable = true).

Returns:
{boolean} Value of property allowAdd
getEditable(): boolean
Gets current value of property editable.

Determines whether the TileContainer is editable so you can move, delete or add tiles.

Returns:
{boolean} Value of property editable
getHeight(): sap.ui.core.CSSSize
Gets current value of property height.

Defines the height of the TileContainer in px.

Default value is 100%.

Returns:
{sap.ui.core.CSSSize} Value of property height
getPageFirstTileIndex(): int
Returns the index of the first Tile visible in the current page.
Returns:
{int} The index of the first Tile that is visible in the current page
getTiles(): sap.m.Tile[]
Gets content of aggregation tiles.

The Tiles to be displayed by the TileContainer.

Returns:
{sap.m.Tile[]}
getWidth(): sap.ui.core.CSSSize
Gets current value of property width.

Defines the width of the TileContainer in px.

Default value is 100%.

Returns:
{sap.ui.core.CSSSize} Value of property width
indexOfTile(oTile): int
Checks for the provided sap.m.Tile in the aggregation tiles. and returns its index if found or -1 otherwise.
Parameters:
{sap.m.Tile}oTile The tile whose index is looked for
Returns:
{int} The index of the provided control in the aggregation if found, or -1 otherwise
insertTile(oTile, iIndex): sap.m.TileContainer
Inserts a Tile to the given index.
Parameters:
{sap.m.Tile}oTile The Tile to insert
{int}iIndex The new Tile position in the tiles aggregation
Returns:
{sap.m.TileContainer} this pointer for chaining
moveTile(vTile, iNewIndex): sap.m.TileContainer
Moves a given Tile to the given index.
Parameters:
{sap.m.Tile}vTile The tile to move
{int}iNewIndex The new Tile position in the tiles aggregation
Returns:
{sap.m.TileContainer} this pointer for chaining
removeAllTiles(): sap.m.Tile[]
Removes all the controls from the aggregation tiles.

Additionally, it unregisters them from the hosting UIArea.

Returns:
{sap.m.Tile[]} An array of the removed elements (might be empty)
removeTile(vTile): sap.m.Tile
Removes a tile from the aggregation tiles.
Parameters:
{int|string|sap.m.Tile}vTile The tileto remove or its index or id
Returns:
{sap.m.Tile} The removed tile or null
scrollIntoView(vTile, bAnimated)
Scrolls to the page where the given Tile or tile index is included. Optionally this can be done animated or not. With IE9 the scroll is never animated.
Parameters:
{sap.m.Tile|int}vTile The Tile or tile index to be scrolled into view
{boolean}bAnimated Whether the scroll should be animated
scrollLeft()
Scrolls one page to the left.
scrollRight()
Scrolls one page to the right.
setAllowAdd(bAllowAdd): sap.m.TileContainer
Sets a new value for property allowAdd.

Determines whether the user is allowed to add Tiles in Edit mode (editable = true).

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

Parameters:
{boolean}bAllowAdd New value for property allowAdd
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining
setEditable(bValue): sap.m.TileContainer
Sets the editable property to the TileContainer, allowing to move icons. This is currently also set with a long tap.
Parameters:
{boolean}bValue Whether the container is in edit mode or not
Returns:
{sap.m.TileContainer} this pointer for chaining
setHeight(sHeight): sap.m.TileContainer
Sets a new value for property height.

Defines the height of the TileContainer in px.

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.CSSSize}sHeight New value for property height
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining
setWidth(sWidth): sap.m.TileContainer
Sets a new value for property width.

Defines the width of the TileContainer in px.

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.CSSSize}sWidth New value for property width
Returns:
{sap.m.TileContainer} Reference to this in order to allow method chaining