div-slider

Parameters
- text_style
- range

Slider for selecting a value in the range.

Parameters

Parameters	Description
`thumb_style`	object Required parameter. Style of the first pointer. The value has the type `div-drawable`. List of possible values: div-shape-drawable
`track_active_style`	object Required parameter. Style of the active part of a scale. The value has the type `div-drawable`. List of possible values: div-shape-drawable
`track_inactive_style`	object Required parameter. Style of the inactive part of a scale. The value has the type `div-drawable`. List of possible values: div-shape-drawable
`type`	string Required parameter. The value must always be `slider`.
`accessibility`	object Accessibility settings. The value has the type `div-accessibility`.
`alignment_horizontal`	string Horizontal alignment of an element inside the parent element. Possible values: `left`, `center`, `right`, `start`, `end`.
`alignment_vertical`	string Vertical alignment of an element inside the parent element. Possible values: `top`, `center`, `bottom`, `baseline`.
`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`.
`animators`	array Declaration of animators that change variable values over time. List of possible values: div-color-animator div-number-animator
`background`	array Element background. It can contain multiple layers. 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`.
`column_span`	int Merges cells in a column of the grid element. Restriction for the value `x`: `x >= 0`.
`disappear_actions`	array Actions when an element disappears from the screen.
`extensions`	array Extensions for additional processing of an element. The list of extensions is given in DivExtension.
`focus`	object Parameters when focusing on an element or losing focus. The value has the type `div-focus`.
`functions`	array User functions.
`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"}`. List of possible values: div-fixed-size div-match-parent-size div-wrap-content-size
`id`	string Element ID. It must be unique within the root element. It is used as `accessibilityIdentifier` on iOS.
`is_enabled`	bool_int Enables or disables toggling values by clicking or swiping. Default value: `true`.
`layout_provider`	object Provides data on the actual size of the element. The value has the type `div-layout-provider`.
`margins`	object External margins from the element stroke. The value has the type `div-edge-insets`.
`max_value`	int Maximum value. It must be greater than the minimum value. Default value: `100`.
`min_value`	int Minimum value. Default value: `0`.
`paddings`	object Internal margins from the element stroke. The value has the type `div-edge-insets`.
`press_end_actions`	array Actions performed after clicking/tapping an element.
`press_start_actions`	array Actions performed at the start of a click/tap on an element.
`ranges`	array Section style.
`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`.
`secondary_value_accessibility`	object Accessibility settings for the second pointer. The value has the type `div-accessibility`. Available platforms: web.
`selected_actions`	array List of actions to be executed when selecting an element in pager.
`thumb_secondary_style`	object Style of the second pointer. The value has the type `div-drawable`. List of possible values: div-shape-drawable
`thumb_secondary_text_style`	object Text style in the second pointer. The value has the type `text_style`.
`thumb_secondary_value_variable`	string Name of the variable to store the second pointer's current value.
`thumb_text_style`	object Text style in the first pointer. The value has the type `text_style`.
`thumb_value_variable`	string Name of the variable to store the pointer's current value.
`tick_mark_active_style`	object Style of active serifs. The value has the type `div-drawable`. List of possible values: div-shape-drawable
`tick_mark_inactive_style`	object Style of inactive serifs. The value has the type `div-drawable`. List of possible values: div-shape-drawable
`timers`	array List of timers. Available platforms: 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.
`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`.
`transformations`	array Array of transformations to be applied to the element in sequence. Available platforms: web. List of possible values: div-rotation-transformation div-translation-transformation
`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`. 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`. 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`. 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.
`variable_triggers`	array Triggers for changing variables within an element.
`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. List of possible values: string_variable number_variable integer_variable boolean_variable color_variable url_variable dict_variable array_variable property_variable
`visibility`	string Element visibility. Possible values: `visible`, `invisible`, `gone`. Default value: `visible`.
`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`.
`visibility_actions`	array Actions when an element appears on the screen.
`width`	object Element width. The value has the type `div-size`. Default value: `{"type": "match_parent"}`. List of possible values: div-fixed-size div-match-parent-size div-wrap-content-size

text_style

Parameters	Description
`font_size`	int Required parameter. Font size. Restriction for the value `x`: `x >= 0`. Default value: `12`.
`font_family`	string Font family: `text` — a standard text font; `display` — a family of fonts with a large font size.
`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`.
`font_variation_settings`	dictionary List of TrueType/OpenType font features. The object is constructed from pairs of axis tag and style values. The axis tag must contain four ASCII characters.
`font_weight`	string Style. Possible values: `light`, `medium`, `regular`, `bold`.
`font_weight_value`	int Style. Numeric value. Restriction for the value `x`: `x > 0`.
`letter_spacing`	number Spacing between characters. Default value: `0`.
`offset`	object Shift relative to the center. The value has the type `div-point`.
`text_color`	string Text color. Valid formats: `#RGB`, `#ARGB`, `#RRGGBB`, `#AARRGGBB`. Default value: `#FF000000`.

range

Parameters	Description
`end`	int End of section.
`margins`	object Section margins. Only uses horizontal margins. The value has the type `div-edge-insets`.
`start`	int Start of section.
`track_active_style`	object Style of the active part of a scale. The value has the type `div-drawable`. List of possible values: div-shape-drawable
`track_inactive_style`	object Style of the inactive part of a scale. The value has the type `div-drawable`. List of possible values: div-shape-drawable

JSON

{
  type*: "slider",
  accessibility: {
    description: "string",
    hint: "string",
    is_checked: "bool_int",
    menu: [
      {
        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"
          },
          ...
        ],
        label*: "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",
      style: div-stroke-style,
      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",
      is_enabled: "bool_int",
      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",
        style: div-stroke-style,
        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"
      },
      ...
    ]
  },
  functions: [
    {
      arguments*: [
        {
          name*: "string",
          type*: "string"
        },
        ...
      ],
      body*: "string",
      name*: "string",
      return_type*: "string"
    },
    ...
  ],
  height: div-size,
  id: "string",
  is_enabled: "bool_int",
  layout_provider: {
    height_variable_name: "string",
    width_variable_name: "string"
  },
  margins: {
    bottom: "int",
    end: "int",
    left: "int",
    right: "int",
    start: "int",
    top: "int",
    unit: "string"
  },
  max_value: "int",
  min_value: "int",
  paddings: {
    bottom: "int",
    end: "int",
    left: "int",
    right: "int",
    start: "int",
    top: "int",
    unit: "string"
  },
  press_end_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"
    },
    ...
  ],
  press_start_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"
    },
    ...
  ],
  ranges: [
    {
      end: "int",
      margins: {
        bottom: "int",
        end: "int",
        left: "int",
        right: "int",
        start: "int",
        top: "int",
        unit: "string"
      },
      start: "int",
      track_active_style: div-drawable,
      track_inactive_style: div-drawable
    },
    ...
  ],
  reuse_id: "string",
  row_span: "int",
  secondary_value_accessibility: {
    description: "string",
    hint: "string",
    is_checked: "bool_int",
    menu: [
      {
        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"
          },
          ...
        ],
        label*: "string"
      },
      ...
    ],
    mode: "string",
    mute_after_action: "bool_int",
    state_description: "string",
    type: "string"
  },
  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"
    },
    ...
  ],
  thumb_secondary_style: div-drawable,
  thumb_secondary_text_style: {
    font_family: "string",
    font_size*: "int",
    font_size_unit: "string",
    font_variation_settings: "dictionary",
    font_weight: "string",
    font_weight_value: "int",
    letter_spacing: "number",
    offset: {
      x*: {
        unit: "string",
        value*: "number"
      },
      y*: {
        unit: "string",
        value*: "number"
      }
    },
    text_color: "string"
  },
  thumb_secondary_value_variable: "string",
  thumb_style*: div-drawable,
  thumb_text_style: {
    font_family: "string",
    font_size*: "int",
    font_size_unit: "string",
    font_variation_settings: "dictionary",
    font_weight: "string",
    font_weight_value: "int",
    letter_spacing: "number",
    offset: {
      x*: {
        unit: "string",
        value*: "number"
      },
      y*: {
        unit: "string",
        value*: "number"
      }
    },
    text_color: "string"
  },
  thumb_value_variable: "string",
  tick_mark_active_style: div-drawable,
  tick_mark_inactive_style: div-drawable,
  timers: [
    {
      duration: "int",
      end_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"
        },
        ...
      ],
      id*: "string",
      tick_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"
        },
        ...
      ],
      tick_interval: "int",
      value_variable: "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"
      },
      background_accessibility_description: "string",
      bring_to_top_id: "string",
      close_by_tap_outside: "bool",
      div*: div,
      duration: "int",
      id*: "string",
      mode: div-tooltip-mode,
      offset: {
        x*: {
          unit: "string",
          value*: "number"
        },
        y*: {
          unit: "string",
          value*: "number"
        }
      },
      position*: "string",
      substrate_div: div,
      tap_outside_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"
        },
        ...
      ]
    },
    ...
  ],
  track_active_style*: div-drawable,
  track_inactive_style*: div-drawable,
  transform: {
    pivot_x: div-pivot,
    pivot_y: div-pivot,
    rotation: "number"
  },
  transformations: [ div-transformation, ... ],
  transition_change: div-change-transition,
  transition_in: div-appearance-transition,
  transition_out: div-appearance-transition,
  transition_triggers: [ "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
}

Was the article helpful?

div-separator

div-state