div-tabs
Tabs. Height of the first tab is determined by its contents, and height of the remaining depends on the platform.
JSON
{
type*: "tabs",
accessibility: {
description: "string",
hint: "string",
mode: "string",
mute_after_action: "bool_int",
state_description: "string",
type: "string"
},
alignment_horizontal: "string",
alignment_vertical: "string",
alpha: "number",
background: [ div-background, ... ],
border: {
corner_radius: "int",
corners_radius: {
bottom-left: "int",
bottom-right: "int",
top-left: "int",
top-right: "int"
},
has_shadow: "bool_int",
shadow: {
alpha: "number",
blur: "int",
color: "string",
offset*: {
x*: {
unit: "string",
value*: "number"
},
y*: {
unit: "string",
value*: "number"
}
}
},
stroke: {
color*: "string",
unit: "string",
width: "int"
}
},
column_span: "int",
dynamic_height: "bool_int",
extensions: [
{
id*: "string",
params: "object"
},
...
],
focus: {
background: [ div-background, ... ],
border: {
corner_radius: "int",
corners_radius: {
bottom-left: "int",
bottom-right: "int",
top-left: "int",
top-right: "int"
},
has_shadow: "bool_int",
shadow: {
alpha: "number",
blur: "int",
color: "string",
offset*: {
x*: {
unit: "string",
value*: "number"
},
y*: {
unit: "string",
value*: "number"
}
}
},
stroke: {
color*: "string",
unit: "string",
width: "int"
}
},
next_focus_ids: {
down: "string",
forward: "string",
left: "string",
right: "string",
up: "string"
},
on_blur: [
{
download_callbacks: {
on_fail_actions: [ div-action, ... ],
on_success_actions: [ div-action, ... ]
},
log_id*: "string",
log_url: "string",
menu_items: [
{
action: div-action,
actions: [ div-action, ... ],
text*: "string"
},
...
],
payload: "object",
referer: "string",
target: "string",
url: "string"
},
...
],
on_focus: [
{
download_callbacks: {
on_fail_actions: [ div-action, ... ],
on_success_actions: [ div-action, ... ]
},
log_id*: "string",
log_url: "string",
menu_items: [
{
action: div-action,
actions: [ div-action, ... ],
text*: "string"
},
...
],
payload: "object",
referer: "string",
target: "string",
url: "string"
},
...
]
},
has_separator: "bool_int",
height: div-size,
id: "string",
items*: [
{
div*: div,
title*: "string",
title_click_action: {
download_callbacks: {
on_fail_actions: [ div-action, ... ],
on_success_actions: [ div-action, ... ]
},
log_id*: "string",
log_url: "string",
menu_items: [
{
action: div-action,
actions: [ div-action, ... ],
text*: "string"
},
...
],
payload: "object",
referer: "string",
target: "string",
url: "string"
}
},
...
],
margins: {
bottom: "int",
left: "int",
right: "int",
top: "int",
unit: "string"
},
paddings: {
bottom: "int",
left: "int",
right: "int",
top: "int",
unit: "string"
},
restrict_parent_scroll: "bool_int",
row_span: "int",
selected_actions: [
{
download_callbacks: {
on_fail_actions: [ div-action, ... ],
on_success_actions: [ div-action, ... ]
},
log_id*: "string",
log_url: "string",
menu_items: [
{
action: div-action,
actions: [ div-action, ... ],
text*: "string"
},
...
],
payload: "object",
referer: "string",
target: "string",
url: "string"
},
...
],
selected_tab: "int",
separator_color: "string",
separator_paddings: {
bottom: "int",
left: "int",
right: "int",
top: "int",
unit: "string"
},
switch_tabs_by_content_swipe_enabled: "bool_int",
tab_title_style: {
active_background_color: "string",
active_font_weight: "string",
active_text_color: "string",
animation_duration: "int",
animation_type: "string",
corner_radius: "int",
corners_radius: {
bottom-left: "int",
bottom-right: "int",
top-left: "int",
top-right: "int"
},
font_family: "string",
font_size: "int",
font_size_unit: "string",
font_weight: "string",
inactive_background_color: "string",
inactive_font_weight: "string",
inactive_text_color: "string",
item_spacing: "int",
letter_spacing: "number",
line_height: "int",
paddings: {
bottom: "int",
left: "int",
right: "int",
top: "int",
unit: "string"
}
},
title_paddings: {
bottom: "int",
left: "int",
right: "int",
top: "int",
unit: "string"
},
tooltips: [
{
animation_in: {
duration: "int",
end_value: "number",
interpolator: "string",
items: [ div-animation, ... ],
name*: "string",
repeat: div-count,
start_delay: "int",
start_value: "number"
},
animation_out: {
duration: "int",
end_value: "number",
interpolator: "string",
items: [ div-animation, ... ],
name*: "string",
repeat: div-count,
start_delay: "int",
start_value: "number"
},
div*: div,
duration: "int",
id*: "string",
offset: {
x*: {
unit: "string",
value*: "number"
},
y*: {
unit: "string",
value*: "number"
}
},
position*: "string"
},
...
],
transform: {
pivot_x: div-pivot,
pivot_y: div-pivot,
rotation: "number"
},
transition_change: div-change-transition,
transition_in: div-appearance-transition,
transition_out: div-appearance-transition,
transition_triggers: [ "string", ... ],
visibility: "string",
visibility_action: {
download_callbacks: {
on_fail_actions: [
{
download_callbacks: div-download-callbacks,
log_id*: "string",
log_url: "string",
menu_items: [
{
action: div-action,
actions: [ div-action, ... ],
text*: "string"
},
...
],
payload: "object",
referer: "string",
target: "string",
url: "string"
},
...
],
on_success_actions: [
{
download_callbacks: div-download-callbacks,
log_id*: "string",
log_url: "string",
menu_items: [
{
action: div-action,
actions: [ div-action, ... ],
text*: "string"
},
...
],
payload: "object",
referer: "string",
target: "string",
url: "string"
},
...
]
},
log_id*: "string",
log_limit: "int",
payload: "object",
referer: "string",
url: "string",
visibility_duration: "int",
visibility_percentage: "int"
},
visibility_actions: [
{
download_callbacks: {
on_fail_actions: [
{
download_callbacks: div-download-callbacks,
log_id*: "string",
log_url: "string",
menu_items: [
{
action: div-action,
actions: [ div-action, ... ],
text*: "string"
},
...
],
payload: "object",
referer: "string",
target: "string",
url: "string"
},
...
],
on_success_actions: [
{
download_callbacks: div-download-callbacks,
log_id*: "string",
log_url: "string",
menu_items: [
{
action: div-action,
actions: [ div-action, ... ],
text*: "string"
},
...
],
payload: "object",
referer: "string",
target: "string",
url: "string"
},
...
]
},
log_id*: "string",
log_limit: "int",
payload: "object",
referer: "string",
url: "string",
visibility_duration: "int",
visibility_percentage: "int"
},
...
],
width: div-size
}Parameters
| Parameters | Description |
|---|---|
accessibility | object Accessibility settings. The value has the type |
alignment_horizontal | string Horizontal alignment of an element inside the parent element. Possible values: |
alignment_vertical | string Vertical alignment of an element inside the parent element. Possible values: |
alpha | number Sets transparency of the entire element: Restriction for the value Default value: |
background | array Element background. It can contain multiple layers. An array must not be empty. |
border | object Element stroke. The value has the type |
column_span | int Merges cells in a column of the grid element. Restriction for the value |
dynamic_height | bool_int Updating height when changing the active element. In the browser, the value is always Default value: Available platforms: Android, iOS. |
extensions | array Extensions for additional processing of an element. The list of extensions is given in DivExtension. An array must not be empty. Available platforms: Android, iOS. |
focus | object Parameters when focusing on an element or losing focus. The value has the type Available platforms: Android. |
has_separator | bool_int A separating line between tabs and contents. Default value: |
height | object Element height. For Android: if there is text in this or in a child element, specify height in The value has the type Default value: |
id | string Element ID. It must be unique within the root element. It is used as A string must not be empty. |
items | array Required parameter. Tabs. Transition between tabs can be implemented using: div-action://set_current_item?id=&item= — set the current tab with an ordinal number item inside an element, with the specified id;div-action://set_next_item?id=[&overflow={clamp|ring}] — go to the next tab inside an element, with the specified id;div-action://set_previous_item?id=[&overflow={clamp|ring}] — go to the previous tab inside an element, with the specified id.The optional overflow parameter is used to set navigation when the first or last element is reached:clamp — transition will stop at the border element;ring — go to the beginning or end, depending on the current element.By default, An array must not be empty. |
margins | object External margins from the element stroke. The value has the type |
paddings | object Internal margins from the element stroke. The value has the type |
restrict_parent_scroll | bool_int If the parameter is enabled, tabs won't transmit the scroll gesture to the parent element. Default value: Available platforms: Android, browser. |
row_span | int Merges cells in a string of the grid element. Restriction for the value |
selected_actions | array List of actions to be executed when selecting an element in pager. An array must not be empty. |
selected_tab | int Ordinal number of the tab that will be opened by default. Restriction for the value Default value: |
separator_color | string Separator color. Valid formats: Default value: |
separator_paddings | object Indents from the separating line. Not used if The value has the type Default value: |
switch_tabs_by_content_swipe_enabled | bool_int Switching tabs by scrolling through the contents. Default value: |
tab_title_style | object Design style of tab titles. The value has the type |
title_paddings | object Indents in the tab name. The value has the type Default value: |
tooltips | array Tooltips linked to an element. A tooltip can be shown by An array must not be empty. Available platforms: Android, iOS. |
transform | object Applies the passed transformation to the element. Content that doesn't fit into the original view area is cut off. The value has the type Available platforms: Android, browser. |
transition_change | object Change animation. It is played when the position or size of an element changes in the new layout. The value has the type List of possible values: |
transition_in | object Appearance animation. It is played when an element with a new ID appears. To learn more about the concept of transitions, see Animated transitions. The value has the type List of possible values: |
transition_out | object Disappearance animation. It is played when an element disappears in the new layout. The value has the type List of possible values: |
transition_triggers | array Animation starting triggers. Default value: An array must not be empty. |
type | string Required parameter. The value must always be |
visibility | string Element visibility. Possible values: Default value: |
visibility_action | object Tracking visibility of a single element. Not used if the The value has the type |
visibility_actions | array Actions when an element appears on the screen. An array must not be empty. |
width | object Element width. The value has the type Default value: |
| Parameters | Description |
|---|---|
accessibility | object Accessibility settings. The value has the type |
alignment_horizontal | string Horizontal alignment of an element inside the parent element. Possible values: |
alignment_vertical | string Vertical alignment of an element inside the parent element. Possible values: |
alpha | number Sets transparency of the entire element: Restriction for the value Default value: |
background | array Element background. It can contain multiple layers. An array must not be empty. |
border | object Element stroke. The value has the type |
column_span | int Merges cells in a column of the grid element. Restriction for the value |
dynamic_height | bool_int Updating height when changing the active element. In the browser, the value is always Default value: Available platforms: Android, iOS. |
extensions | array Extensions for additional processing of an element. The list of extensions is given in DivExtension. An array must not be empty. Available platforms: Android, iOS. |
focus | object Parameters when focusing on an element or losing focus. The value has the type Available platforms: Android. |
has_separator | bool_int A separating line between tabs and contents. Default value: |
height | object Element height. For Android: if there is text in this or in a child element, specify height in The value has the type Default value: |
id | string Element ID. It must be unique within the root element. It is used as A string must not be empty. |
items | array Required parameter. Tabs. Transition between tabs can be implemented using: div-action://set_current_item?id=&item= — set the current tab with an ordinal number item inside an element, with the specified id;div-action://set_next_item?id=[&overflow={clamp|ring}] — go to the next tab inside an element, with the specified id;div-action://set_previous_item?id=[&overflow={clamp|ring}] — go to the previous tab inside an element, with the specified id.The optional overflow parameter is used to set navigation when the first or last element is reached:clamp — transition will stop at the border element;ring — go to the beginning or end, depending on the current element.By default, An array must not be empty. |
margins | object External margins from the element stroke. The value has the type |
paddings | object Internal margins from the element stroke. The value has the type |
restrict_parent_scroll | bool_int If the parameter is enabled, tabs won't transmit the scroll gesture to the parent element. Default value: Available platforms: Android, browser. |
row_span | int Merges cells in a string of the grid element. Restriction for the value |
selected_actions | array List of actions to be executed when selecting an element in pager. An array must not be empty. |
selected_tab | int Ordinal number of the tab that will be opened by default. Restriction for the value Default value: |
separator_color | string Separator color. Valid formats: Default value: |
separator_paddings | object Indents from the separating line. Not used if The value has the type Default value: |
switch_tabs_by_content_swipe_enabled | bool_int Switching tabs by scrolling through the contents. Default value: |
tab_title_style | object Design style of tab titles. The value has the type |
title_paddings | object Indents in the tab name. The value has the type Default value: |
tooltips | array Tooltips linked to an element. A tooltip can be shown by An array must not be empty. Available platforms: Android, iOS. |
transform | object Applies the passed transformation to the element. Content that doesn't fit into the original view area is cut off. The value has the type Available platforms: Android, browser. |
transition_change | object Change animation. It is played when the position or size of an element changes in the new layout. The value has the type List of possible values: |
transition_in | object Appearance animation. It is played when an element with a new ID appears. To learn more about the concept of transitions, see Animated transitions. The value has the type List of possible values: |
transition_out | object Disappearance animation. It is played when an element disappears in the new layout. The value has the type List of possible values: |
transition_triggers | array Animation starting triggers. Default value: An array must not be empty. |
type | string Required parameter. The value must always be |
visibility | string Element visibility. Possible values: Default value: |
visibility_action | object Tracking visibility of a single element. Not used if the The value has the type |
visibility_actions | array Actions when an element appears on the screen. An array must not be empty. |
width | object Element width. The value has the type Default value: |
tab_title_style
| Parameters | Description |
|---|---|
active_background_color | string Background color of the active tab title. Valid formats: Default value: |
active_font_weight | string Active tab title style. Possible values: Available platforms: Android, browser. |
active_text_color | string Color of the active tab title text. Valid formats: Default value: |
animation_duration | int Duration of active title change animation. Restriction for the value Default value: |
animation_type | string Active title change animation. Possible values: Default value: Available platforms: Android, iOS. |
corner_radius | int Title corner rounding radius. If the parameter isn't specified, the rounding is maximum (half of the smallest size). Not used if the Restriction for the value Available platforms: Android, browser. |
corners_radius | object Rounding radii of corners of multiple titles. Empty values are replaced by The value has the type Available platforms: Android, browser. |
font_family | string Font family: text — a standard text font;display — a family of fonts with a large font size.Possible values: Default value: |
font_size | int Title font size. Restriction for the value Default value: |
font_size_unit | string Units of title font size measurement. Possible values: Default value: Available platforms: Android. |
font_weight | string Parameter is deprecated. Style. Use Possible values: Default value: |
inactive_background_color | string Background color of the inactive tab title. Valid formats: Available platforms: Android, browser. |
inactive_font_weight | string Inactive tab title style. Possible values: Available platforms: Android, browser. |
inactive_text_color | string Color of the inactive tab title text. Valid formats: Default value: |
item_spacing | int Spacing between neighbouring tab titles. Restriction for the value Default value: |
letter_spacing | number Spacing between title characters. Default value: |
line_height | int Line spacing of the text. Restriction for the value |
paddings | object Indents around the tab title. The value has the type Default value: |
| Parameters | Description |
|---|---|
active_background_color | string Background color of the active tab title. Valid formats: Default value: |
active_font_weight | string Active tab title style. Possible values: Available platforms: Android, browser. |
active_text_color | string Color of the active tab title text. Valid formats: Default value: |
animation_duration | int Duration of active title change animation. Restriction for the value Default value: |
animation_type | string Active title change animation. Possible values: Default value: Available platforms: Android, iOS. |
corner_radius | int Title corner rounding radius. If the parameter isn't specified, the rounding is maximum (half of the smallest size). Not used if the Restriction for the value Available platforms: Android, browser. |
corners_radius | object Rounding radii of corners of multiple titles. Empty values are replaced by The value has the type Available platforms: Android, browser. |
font_family | string Font family: text — a standard text font;display — a family of fonts with a large font size.Possible values: Default value: |
font_size | int Title font size. Restriction for the value Default value: |
font_size_unit | string Units of title font size measurement. Possible values: Default value: Available platforms: Android. |
font_weight | string Parameter is deprecated. Style. Use Possible values: Default value: |
inactive_background_color | string Background color of the inactive tab title. Valid formats: Available platforms: Android, browser. |
inactive_font_weight | string Inactive tab title style. Possible values: Available platforms: Android, browser. |
inactive_text_color | string Color of the inactive tab title text. Valid formats: Default value: |
item_spacing | int Spacing between neighbouring tab titles. Restriction for the value Default value: |
letter_spacing | number Spacing between title characters. Default value: |
line_height | int Line spacing of the text. Restriction for the value |
paddings | object Indents around the tab title. The value has the type Default value: |
item
| Parameters | Description |
|---|---|
div | object Required parameter. Tab contents. The value has the type |
title | string Required parameter. Tab title. A string must not be empty. |
title_click_action | object Action when clicking on the active tab title. The value has the type |
| Parameters | Description |
|---|---|
div | object Required parameter. Tab contents. The value has the type |
title | string Required parameter. Tab title. A string must not be empty. |
title_click_action | object Action when clicking on the active tab title. The value has the type |