div-select

List of options with only one to be selected.

Parameters

Parameters Description
options

array

Required parameter.

An array must not be empty.

Available platforms: Android, iOS, web.

type

string

Required parameter.

The value must always be select.

Available platforms: Android, iOS, web.

value_variable

string

Required parameter.

Name of the variable that stores the selected option value (value).

Available platforms: Android, iOS, web.

accessibility

object

Accessibility settings.

The value has the type div-accessibility.

Available platforms: Android, iOS, web.

alignment_horizontal

string

Horizontal alignment of an element inside the parent element.

Possible values: left, center, right, start, end.

Available platforms: Android, iOS, web.

alignment_vertical

string

Vertical alignment of an element inside the parent element.

Possible values: top, center, bottom, baseline.

Available platforms: Android, iOS, web.

alpha

number

Sets transparency of the entire element: 0 — completely transparent, 1 — opaque.

Restriction for the value x: x >= 0.0 && x <= 1.0.

Default value: 1.0.

Available platforms: Android, iOS, web.

animators

array

Declaration of animators that change variable values over time.

Available platforms: Android, iOS.

List of possible values:

  • div-color-animator
  • div-number-animator
  • background

    array

    Element background. It can contain multiple layers.

    Available platforms: Android, iOS, web.

    List of possible values:

  • div-linear-gradient
  • div-radial-gradient
  • div-image-background
  • div-solid-background
  • div-nine-patch-background
  • border

    object

    Element stroke.

    The value has the type div-border.

    Available platforms: Android, iOS, web.

    column_span

    int

    Merges cells in a column of the grid element.

    Restriction for the value x: x >= 0.

    Available platforms: Android, iOS, web.

    disappear_actions

    array

    Actions when an element disappears from the screen.

    Available platforms: Android, iOS, web.

    extensions

    array

    Extensions for additional processing of an element. The list of extensions is given in DivExtension.

    Available platforms: Android, iOS, web.

    focus

    object

    Parameters when focusing on an element or losing focus.

    The value has the type div-focus.

    Available platforms: Android, iOS, web.

    font_family

    string

    Font family:

  • text — a standard text font;
  • display — a family of fonts with a large font size.
  • Available platforms: Android, iOS, web.

    font_size

    int

    Font size.

    Restriction for the value x: x >= 0.

    Default value: 12.

    Available platforms: Android, iOS, web.

    font_size_unit

    string

    Unit of measurement:

  • px — a physical pixel.
  • dp — a logical pixel that doesn't depend on screen density.
  • sp — a logical pixel that depends on the font size on a device. Specify height in sp. Only available on Android.
  • Possible values: dp, sp, px.

    Default value: sp.

    Available platforms: Android, iOS.

    font_weight

    string

    Style.

    Possible values: light, medium, regular, bold.

    Default value: regular.

    Available platforms: Android, iOS, web.

    font_weight_value

    int

    Style. Numeric value.

    Restriction for the value x: x > 0.

    Available platforms: iOS, web, Android.

    functions

    array

    User functions.

    Available platforms: iOS.

    height

    object

    Element height. For Android: if there is text in this or in a child element, specify height in sp to scale the element together with the text. To learn more about units of size measurement, see Layout inside the card.

    The value has the type div-size.

    Default value: {"type": "wrap_content"}.

    Available platforms: Android, iOS, web.

    List of possible values:

  • div-fixed-size
  • div-match-parent-size
  • div-wrap-content-size
  • hint_color

    string

    Hint color.

    Valid formats: #RGB, #ARGB, #RRGGBB, #AARRGGBB.

    Default value: #73000000.

    Available platforms: Android, iOS, web.

    hint_text

    string

    Hint text.

    Available platforms: Android, iOS, web.

    id

    string

    Element ID. It must be unique within the root element. It is used as accessibilityIdentifier on iOS.

    Available platforms: Android, iOS, web.

    layout_provider

    object

    Provides data on the actual size of the element.

    The value has the type div-layout-provider.

    Available platforms: Android, iOS, web.

    letter_spacing

    number

    Spacing between characters.

    Default value: 0.

    Available platforms: Android, iOS, web.

    line_height

    int

    Line spacing of the text. Measured in units set in font_size_unit.

    Restriction for the value x: x >= 0.

    Available platforms: Android, iOS, web.

    margins

    object

    External margins from the element stroke.

    The value has the type div-edge-insets.

    Available platforms: Android, iOS, web.

    paddings

    object

    Internal margins from the element stroke.

    The value has the type div-edge-insets.

    Available platforms: Android, iOS, web.

    reuse_id

    string

    ID for the div object structure. Used to optimize block reuse. See block reuse.

    Available platforms: Android, iOS.

    row_span

    int

    Merges cells in a string of the grid element.

    Restriction for the value x: x >= 0.

    Available platforms: Android, iOS, web.

    selected_actions

    array

    List of actions to be executed when selecting an element in pager.

    Available platforms: Android, iOS, web.

    text_color

    string

    Text color.

    Valid formats: #RGB, #ARGB, #RRGGBB, #AARRGGBB.

    Default value: #FF000000.

    Available platforms: Android, iOS, web.

    tooltips

    array

    Tooltips linked to an element. A tooltip can be shown by div-action://show_tooltip?id=, hidden by div-action://hide_tooltip?id= where id — tooltip id.

    Available platforms: Android, iOS, web.

    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 div-transform.

    Available platforms: Android, iOS, web.

    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 div-change-transition.

    Available platforms: Android, iOS, web.

    List of possible values:

  • div-change-set-transition
  • div-change-bounds-transition
  • 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 div-appearance-transition.

    Available platforms: Android, iOS, web.

    List of possible values:

  • div-appearance-set-transition
  • div-fade-transition
  • div-scale-transition
  • div-slide-transition
  • transition_out

    object

    Disappearance animation. It is played when an element disappears in the new layout.

    The value has the type div-appearance-transition.

    Available platforms: Android, iOS, web.

    List of possible values:

  • div-appearance-set-transition
  • div-fade-transition
  • div-scale-transition
  • div-slide-transition
  • transition_triggers

    array

    Animation starting triggers. Default value: [state_change, visibility_change].

    An array must not be empty.

    Available platforms: Android, iOS, web.

    variable_triggers

    array

    Triggers for changing variables within an element.

    Available platforms: Android, iOS, web.

    variables

    array

    Declaration of variables that can be used within an element. Variables declared in this array can only be used within the element and its child elements.

    Available platforms: iOS, web, Android.

    List of possible values:

  • string_variable
  • number_variable
  • integer_variable
  • boolean_variable
  • color_variable
  • url_variable
  • dict_variable
  • array_variable
  • visibility

    string

    Element visibility.

    Possible values: visible, invisible, gone.

    Default value: visible.

    Available platforms: Android, iOS, web.

    visibility_action

    object

    Tracking visibility of a single element. Not used if the visibility_actions parameter is set.

    The value has the type div-visibility-action.

    Available platforms: Android, iOS, web.

    visibility_actions

    array

    Actions when an element appears on the screen.

    Available platforms: Android, iOS, web.

    width

    object

    Element width.

    The value has the type div-size.

    Default value: {"type": "match_parent"}.

    Available platforms: Android, iOS, web.

    List of possible values:

  • div-fixed-size
  • div-match-parent-size
  • div-wrap-content-size
  • option

    Parameters Description
    value

    string

    Required parameter.

    Value matching the option.

    text

    string

    Text description of the option displayed in the list. If not set, value is used instead.

    JSON
    {
      type*: "select",
      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",
      animators: [ div-animator, ... ],
      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: "number"
        }
      },
      column_span: "int",
      disappear_actions: [
        {
          disappear_duration: "int",
          download_callbacks: {
            on_fail_actions: [
              {
                download_callbacks: div-download-callbacks,
                is_enabled: "bool_int",
                log_id*: "string",
                log_url: "string",
                menu_items: [
                  {
                    action: div-action,
                    actions: [ div-action, ... ],
                    text*: "string"
                  },
                  ...
                ],
                payload: "object",
                referer: "string",
                scope_id: "string",
                target: "string",
                typed: div-action-typed,
                url: "string"
              },
              ...
            ],
            on_success_actions: [
              {
                download_callbacks: div-download-callbacks,
                is_enabled: "bool_int",
                log_id*: "string",
                log_url: "string",
                menu_items: [
                  {
                    action: div-action,
                    actions: [ div-action, ... ],
                    text*: "string"
                  },
                  ...
                ],
                payload: "object",
                referer: "string",
                scope_id: "string",
                target: "string",
                typed: div-action-typed,
                url: "string"
              },
              ...
            ]
          },
          is_enabled: "bool_int",
          log_id*: "string",
          log_limit: "int",
          payload: "object",
          referer: "string",
          scope_id: "string",
          typed: div-action-typed,
          url: "string",
          visibility_percentage: "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: "number"
          }
        },
        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, ... ]
            },
            is_enabled: "bool_int",
            log_id*: "string",
            log_url: "string",
            menu_items: [
              {
                action: div-action,
                actions: [ div-action, ... ],
                text*: "string"
              },
              ...
            ],
            payload: "object",
            referer: "string",
            scope_id: "string",
            target: "string",
            typed: div-action-typed,
            url: "string"
          },
          ...
        ],
        on_focus: [
          {
            download_callbacks: {
              on_fail_actions: [ div-action, ... ],
              on_success_actions: [ div-action, ... ]
            },
            is_enabled: "bool_int",
            log_id*: "string",
            log_url: "string",
            menu_items: [
              {
                action: div-action,
                actions: [ div-action, ... ],
                text*: "string"
              },
              ...
            ],
            payload: "object",
            referer: "string",
            scope_id: "string",
            target: "string",
            typed: div-action-typed,
            url: "string"
          },
          ...
        ]
      },
      font_family: "string",
      font_size: "int",
      font_size_unit: "string",
      font_weight: "string",
      font_weight_value: "int",
      functions: [
        {
          arguments*: [
            {
              name*: "string",
              type*: "string"
            },
            ...
          ],
          body*: "string",
          name*: "string",
          return_type*: "string"
        },
        ...
      ],
      height: div-size,
      hint_color: "string",
      hint_text: "string",
      id: "string",
      layout_provider: {
        height_variable_name: "string",
        width_variable_name: "string"
      },
      letter_spacing: "number",
      line_height: "int",
      margins: {
        bottom: "int",
        end: "int",
        left: "int",
        right: "int",
        start: "int",
        top: "int",
        unit: "string"
      },
      options*: [
        {
          text: "string",
          value*: "string"
        },
        ...
      ],
      paddings: {
        bottom: "int",
        end: "int",
        left: "int",
        right: "int",
        start: "int",
        top: "int",
        unit: "string"
      },
      reuse_id: "string",
      row_span: "int",
      selected_actions: [
        {
          download_callbacks: {
            on_fail_actions: [ div-action, ... ],
            on_success_actions: [ div-action, ... ]
          },
          is_enabled: "bool_int",
          log_id*: "string",
          log_url: "string",
          menu_items: [
            {
              action: div-action,
              actions: [ div-action, ... ],
              text*: "string"
            },
            ...
          ],
          payload: "object",
          referer: "string",
          scope_id: "string",
          target: "string",
          typed: div-action-typed,
          url: "string"
        },
        ...
      ],
      text_color: "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", ... ],
      value_variable*: "string",
      variable_triggers: [
        {
          actions*: [
            {
              download_callbacks: {
                on_fail_actions: [ div-action, ... ],
                on_success_actions: [ div-action, ... ]
              },
              is_enabled: "bool_int",
              log_id*: "string",
              log_url: "string",
              menu_items: [
                {
                  action: div-action,
                  actions: [ div-action, ... ],
                  text*: "string"
                },
                ...
              ],
              payload: "object",
              referer: "string",
              scope_id: "string",
              target: "string",
              typed: div-action-typed,
              url: "string"
            },
            ...
          ],
          condition*: "bool_int",
          mode: "string"
        },
        ...
      ],
      variables: [ div-variable, ... ],
      visibility: "string",
      visibility_action: {
        download_callbacks: {
          on_fail_actions: [
            {
              download_callbacks: div-download-callbacks,
              is_enabled: "bool_int",
              log_id*: "string",
              log_url: "string",
              menu_items: [
                {
                  action: div-action,
                  actions: [ div-action, ... ],
                  text*: "string"
                },
                ...
              ],
              payload: "object",
              referer: "string",
              scope_id: "string",
              target: "string",
              typed: div-action-typed,
              url: "string"
            },
            ...
          ],
          on_success_actions: [
            {
              download_callbacks: div-download-callbacks,
              is_enabled: "bool_int",
              log_id*: "string",
              log_url: "string",
              menu_items: [
                {
                  action: div-action,
                  actions: [ div-action, ... ],
                  text*: "string"
                },
                ...
              ],
              payload: "object",
              referer: "string",
              scope_id: "string",
              target: "string",
              typed: div-action-typed,
              url: "string"
            },
            ...
          ]
        },
        is_enabled: "bool_int",
        log_id*: "string",
        log_limit: "int",
        payload: "object",
        referer: "string",
        scope_id: "string",
        typed: div-action-typed,
        url: "string",
        visibility_duration: "int",
        visibility_percentage: "int"
      },
      visibility_actions: [
        {
          download_callbacks: {
            on_fail_actions: [
              {
                download_callbacks: div-download-callbacks,
                is_enabled: "bool_int",
                log_id*: "string",
                log_url: "string",
                menu_items: [
                  {
                    action: div-action,
                    actions: [ div-action, ... ],
                    text*: "string"
                  },
                  ...
                ],
                payload: "object",
                referer: "string",
                scope_id: "string",
                target: "string",
                typed: div-action-typed,
                url: "string"
              },
              ...
            ],
            on_success_actions: [
              {
                download_callbacks: div-download-callbacks,
                is_enabled: "bool_int",
                log_id*: "string",
                log_url: "string",
                menu_items: [
                  {
                    action: div-action,
                    actions: [ div-action, ... ],
                    text*: "string"
                  },
                  ...
                ],
                payload: "object",
                referer: "string",
                scope_id: "string",
                target: "string",
                typed: div-action-typed,
                url: "string"
              },
              ...
            ]
          },
          is_enabled: "bool_int",
          log_id*: "string",
          log_limit: "int",
          payload: "object",
          referer: "string",
          scope_id: "string",
          typed: div-action-typed,
          url: "string",
          visibility_duration: "int",
          visibility_percentage: "int"
        },
        ...
      ],
      width: div-size
    }
    
    Previous