The BlockLayout is used to display several objects in a section-based manner.
The BlockLayout uses horizontal and vertical subdivisions, and full-width banners to display a set of elements. By placing pictorial and textual elements side-by-side in different blocks, you can establish a visual connection between blocks and between similar elements.
The BlockLayout contains BlockLayout cells. Every cell consists of a title and content. The title can be text or a link.
Special full-width sections of the BlockLayout allow horizontal scrolling through a set of blocks.
The BlockLayout comes in five predefined types for background colors:
Note: With version 1.48 colors can be set for each individual cell. There are 11 pre-defined color sets, each with 4 different shades for the Belize theme and 6 different shades for the Fiori 3 theme. The main colors of the sets can be changed in Theme Designer. To change the background of a particular cell, set backgroundColorSet
(main color) and backgroundColorShade
(shade).
Note: Usage of disabled, emphasized or subtle links as titles is not recommended. Dark background designs, for example Accent, are not fully supported with regards to Accessibility when used with links as titles.
Constructor for a new BlockLayout.
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.ui.layout.BlockLayout(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 |
Name | Type | Default Value | Description |
---|---|---|---|
background | sap.ui.layout.BlockBackgroundType | Default | Determines the background used for the Layout |
keepFontSize | boolean | false | Keeps the font-size of the contents as is, independent from the screen size. |
Default Aggregation: content
Name | Cardinality | Type | Description |
---|---|---|---|
content (default) | 0..n | sap.ui.layout.BlockLayoutRow |
The Rows to be included in the content of the control |
Method | Description |
---|---|
addContent |
Adds some content to the aggregation content. |
destroyContent |
Destroys all the content in the aggregation content. |
sap.ui.layout.BlockLayout.extend |
Creates a new subclass of class sap.ui.layout.BlockLayout with name
|
getBackground |
Gets current value of property background. Determines the background used for the Layout Default value is |
getContent |
Gets content of aggregation content. The Rows to be included in the content of the control |
getKeepFontSize |
Gets current value of property keepFontSize. Keeps the font-size of the contents as is, independent from the screen size. Default value is |
sap.ui.layout.BlockLayout.getMetadata |
Returns a metadata object for class sap.ui.layout.BlockLayout. |
indexOfContent |
Checks for the provided |
insertContent |
Inserts a content into the aggregation content. |
removeAllContent |
Removes all the controls from the aggregation content. Additionally, it unregisters them from the hosting UIArea. |
removeContent |
Removes a content from the aggregation content. |
setBackground |
Sets a new value for property background. Determines the background used for the Layout When called with a value of Default value is |
setKeepFontSize |
Sets a new value for property keepFontSize. Keeps the font-size of the contents as is, independent from the screen size. When called with a value of Default value is |
Adds some content to the aggregation content.
Param | Type | DefaultValue | Description |
---|---|---|---|
oContent | sap.ui.layout.BlockLayoutRow |
The content to add; if empty, nothing is inserted |
Creates a new subclass of class sap.ui.layout.BlockLayout 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 |
Gets current value of property background.
Determines the background used for the Layout
Default value is "Default"
.
Gets content of aggregation content.
The Rows to be included in the content of the control
Gets current value of property keepFontSize.
Keeps the font-size of the contents as is, independent from the screen size.
Default value is false
.
Returns a metadata object for class sap.ui.layout.BlockLayout.
Checks for the provided sap.ui.layout.BlockLayoutRow
in the aggregation content. and returns its index if found or -1 otherwise.
Param | Type | DefaultValue | Description |
---|---|---|---|
oContent | sap.ui.layout.BlockLayoutRow |
The content whose index is looked for |
Inserts a content into the aggregation content.
Param | Type | DefaultValue | Description |
---|---|---|---|
oContent | sap.ui.layout.BlockLayoutRow |
The content to insert; if empty, nothing is inserted |
|
iIndex | int |
The |
Removes all the controls from the aggregation content.
Additionally, it unregisters them from the hosting UIArea.
Removes a content from the aggregation content.
Param | Type | DefaultValue | Description |
---|---|---|---|
vContent | int string sap.ui.layout.BlockLayoutRow |
The content to remove or its index or id |
Sets a new value for property background.
Determines the background used for the Layout
When called with a value of null
or undefined
, the default value of the property will be restored.
Default value is "Default"
.
Param | Type | DefaultValue | Description |
---|---|---|---|
sBackground | sap.ui.layout.BlockBackgroundType | "Default" |
New value for property |
Sets a new value for property keepFontSize.
Keeps the font-size of the contents as is, independent from the screen size.
When called with a value of null
or undefined
, the default value of the property will be restored.
Default value is false
.
Param | Type | DefaultValue | Description |
---|---|---|---|
bKeepFontSize | boolean | false |
New value for property |