---
metadata:
  - name: generator
    content: Diplodoc Platform v5.50.3
alternate:
  - https://divkit.tech/docs/en/concepts/divs/2/div-focus.md
  - https://divkit.tech/docs/ru/concepts/divs/2/div-focus.md
---
> **Documentation Index:** Fetch the complete configuration index at https://divkit.tech/docs/en/llms.txt

# div-focus
Element behavior when focusing or losing focus.

## Parameters
| Parameters | Description |
| --- | --- |
| `background` | <p>**array**</p><p>Background of an element when it is in focus. It can contain multiple layers.</p><p>List of possible values:<li>[div-linear-gradient](div-linear-gradient.md#div-linear-gradient)</li><li>[div-radial-gradient](div-radial-gradient.md#div-radial-gradient)</li><li>[div-image-background](div-image-background.md#div-image-background)</li><li>[div-solid-background](div-solid-background.md#div-solid-background)</li><li>[div-nine-patch-background](div-nine-patch-background.md#div-nine-patch-background)</li></p> |
| `border` | <p>**object**</p><p>Border of an element when it's in focus.</p><p>The value has the type `div-border`.</p> |
| `next_focus_ids` | <p>**object**</p><p>IDs of elements that will be next to get focus.</p><p>The value has the type `next_focus_ids`.</p> |
| `on_blur` | <p>**array**</p><p>Actions when an element loses focus.</p> |
| `on_focus` | <p>**array**</p><p>Actions when an element gets focus.</p> |

### next_focus_ids
| Parameters | Description |
| --- | --- |
| `down` | <p>**string**</p><p>Available platforms: Android.</p> |
| `forward` | <p>**string**</p><p>Available platforms: Android, iOS.</p> |
| `left` | <p>**string**</p><p>Available platforms: Android.</p> |
| `right` | <p>**string**</p><p>Available platforms: Android.</p> |
| `up` | <p>**string**</p><p>Available platforms: Android.</p> |

<details>
<summary>JSON</summary>

```json
{
  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"
    },
    ...
  ]
}
```
</details>