class sap.m.LightBox

Control sample: sap.m.LightBox
Visiblity: public
UX Guidelines: Light Box
Implements: sap.ui.core.PopupInterface
Available since: N/A
Module: sap/m/LightBox
Application Component: CA-UI5-CTR

Represents a popup containing an image and a footer.

Overview

The purpose of the control is to display an image in its original size as long as this is possible. On smaller screens images are scaled down to fit.

Notes:

Structure

Each LightBox holds a LightBoxItem which keeps the properties of the image:

Usage

The most common use case is to click on an image thumbnail to view it in bigger size. When the image that should be displayed in the control cannot be loaded, an error is displayed in the popup.

Responsive Behavior

On a mobile device, flipping the device to landscape will flip the lightbox and the image will be adjusted to fit the new dimensions.

Additional Information

Check out the API Reference.


Constructor

Constructor for a new LightBox.

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

new sap.m.LightBox(sId?, mSettings?)
Param Type Default Value Description
sId? string

ID for the new control, generated automatically if no ID is given

mSettings? object

Initial settings for the new control


Aggregations

Default Aggregation: imageContent

Name Cardinality Type Description
_busy 0..1 sap.m.BusyIndicator

BusyIndicator for loading state.

_closeButton 0..1 sap.m.Button

The close button aggregation inside the LightBox control. This button has to have text in it.

_invisiblePopupText 0..1 sap.ui.core.InvisibleText

Hidden text used for accessibility of the popup.

_verticalLayout 0..1 sap.ui.layout.VerticalLayout

A layout control used to display the error texts when the image could not be loaded.

imageContent (default) 0..n sap.m.LightBoxItem

Aggregation which holds data about the image and its description. Although multiple LightBoxItems may be added to this aggregation only the first one in the list will be taken into account.


Methods Overview

Method Description
addImageContent

Adds some imageContent to the aggregation imageContent.

bindImageContent

Binds aggregation imageContent to model data.

See ManagedObject.bindAggregation for a detailed description of the possible properties of oBindingInfo.

close

Closes the LightBox.

destroyImageContent

Destroys all the imageContent in the aggregation imageContent.

exit

Detaches all handlers and destroys the instance.

sap.m.LightBox.extend

Creates a new subclass of class sap.m.LightBox 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.

getImageContent

Gets content of aggregation imageContent.

Aggregation which holds data about the image and its description. Although multiple LightBoxItems may be added to this aggregation only the first one in the list will be taken into account.

sap.m.LightBox.getMetadata

Returns a metadata object for class sap.m.LightBox.

indexOfImageContent

Checks for the provided sap.m.LightBoxItem in the aggregation imageContent. and returns its index if found or -1 otherwise.

init

Sets up the initial values of the control.

insertImageContent

Inserts a imageContent into the aggregation imageContent.

invalidate

Invalidates the LightBox.

isOpen

Returns if the LightBox is open.

onAfterRendering

Overwrites the onAfterRendering.

onBeforeRendering

Overwrites the onBeforeRendering.

open

Opens the LightBox.

removeAllImageContent

Removes all the controls from the aggregation imageContent.

Additionally, it unregisters them from the hosting UIArea.

removeImageContent

Removes a imageContent from the aggregation imageContent.

unbindImageContent

Unbinds aggregation imageContent from model data.

addImageContent

Adds some imageContent to the aggregation imageContent.

Param Type DefaultValue Description
oImageContent sap.m.LightBoxItem

The imageContent to add; if empty, nothing is inserted

bindImageContent

Binds aggregation imageContent to model data.

See ManagedObject.bindAggregation for a detailed description of the possible properties of oBindingInfo.

Param Type DefaultValue Description
oBindingInfo sap.ui.base.ManagedObject.AggregationBindingInfo

The binding information

close

Closes the LightBox.

destroyImageContent

Destroys all the imageContent in the aggregation imageContent.

exit

Detaches all handlers and destroys the instance.

sap.m.LightBox.extend

Creates a new subclass of class sap.m.LightBox 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.

Param Type DefaultValue Description
sClassName string

Name of the class being created

oClassInfo object

Object literal with information about the class

FNMetaImpl function

Constructor function for the metadata object; if not given, it defaults to the metadata implementation used by this class

getImageContent

Gets content of aggregation imageContent.

Aggregation which holds data about the image and its description. Although multiple LightBoxItems may be added to this aggregation only the first one in the list will be taken into account.

sap.m.LightBox.getMetadata

Returns a metadata object for class sap.m.LightBox.

indexOfImageContent

Checks for the provided sap.m.LightBoxItem in the aggregation imageContent. and returns its index if found or -1 otherwise.

Param Type DefaultValue Description
oImageContent sap.m.LightBoxItem

The imageContent whose index is looked for

init

Sets up the initial values of the control.

insertImageContent

Inserts a imageContent into the aggregation imageContent.

Param Type DefaultValue Description
oImageContent sap.m.LightBoxItem

The imageContent to insert; if empty, nothing is inserted

iIndex int

The 0-based index the imageContent should be inserted at; for a negative value of iIndex, the imageContent is inserted at position 0; for a value greater than the current size of the aggregation, the imageContent is inserted at the last position

invalidate

Invalidates the LightBox.

Param Type DefaultValue Description
oOrigin sap.ui.base.ManagedObject

Origin of the invalidation.

isOpen

Returns if the LightBox is open.

onAfterRendering

Overwrites the onAfterRendering.

onBeforeRendering

Overwrites the onBeforeRendering.

open

Opens the LightBox.

removeAllImageContent

Removes all the controls from the aggregation imageContent.

Additionally, it unregisters them from the hosting UIArea.

removeImageContent

Removes a imageContent from the aggregation imageContent.

Param Type DefaultValue Description
vImageContent int string sap.m.LightBoxItem

The imageContent to remove or its index or id

unbindImageContent

Unbinds aggregation imageContent from model data.