Accessibility support

We aim to simplify accessibility support as much as possible. Depending on the platform, DivKit automatically assigns the correct types to text, input, select, slider, tabs, and similar objects. However, we can't automatically provide the user with additional information, set a correct description, or perform other actions requiring the developer's input. Because of this, image and separator objects are excluded from accessibility by default.

If an element supports single- or double-tap actions, it's automatically announced by the accessibility services.

To configure accessibility, you can use the accessibility object. Example:

"accessibility": {
       "type": "button",
       "hint": "Tap on the button to play music.",
       "description": "Play music",
       "state_description": "Clicked",
       "is_checked": true,
       "mode": "merge"
 }
  • type: Element role. It is used for correct identification of an element by an accessibility service.
  • hint: Tooltip describing what will happen if the user interacts with an element. It's voiced after the description field.
  • description: Element's main description.
  • state_description: Description of an element's current state. For example, for a switch, the state can be either on or off.
  • is_checked: Shows the current status of checkboxes, toggles, and similar interactive elements. Set to true when the element is selected/checked, false when it isn't. This helps accessibility services properly announce the state to users.
  • mode: How the accessibility tree is structured. There are three modes available:
    • default: Process the element and its entire subtree separately.
    • merge: Treat the element and its entire subtree as a single entity.
    • exclude: Make the element and its entire subtree unavailable for the accessibility object.

Accessibility for UI automation on Android

In UI automation builds, use forceAccessibilityEnable(true) to make DivKit bind accessibility metadata, including checked and checkable, while touch exploration is disabled. The option is disabled by default and is intended for test builds.

Pass the application's image loader as the required DivConfiguration.Builder argument:

val configuration = DivConfiguration.Builder(imageLoader)
    .forceAccessibilityEnable(true)
    .build()

Here, imageLoader is a configured DivImageLoader; see the Android integration guide. The option forces metadata binding in DivKit but does not enable system touch exploration.

Element roles

  • none: Undefined element role.
  • button: Button type. If an element has active actions for single or long taps, this is also announced to the user.
  • image: Image type. We can't provide details about your images, so we recommend specifying a description for this type.
  • text: Text type.
  • edit_text: Text input type.
  • header: Header type.
  • list: List type. The elements inside are voiced one after another.
  • select: Drop-down list type.
  • tab_bar: Tab bar type.
  • checkbox: Checkbox type.
  • radio: Radio button type.
  • auto: Automatic type assignment. This is the default type.

Learn more

You can discuss topics of interest in the DivKit user community in Telegram: https://t.me/divkit_community_en.

DivKit Repository

Previous
Slider
Next
Templates