---
name: "onKeyboardHeightChange"
mode: "kit"
versionRequirements:
  - { name: "BaseKit", version: "3.6.1" }
platform:
  - "iOS"
  - "Android"
async: true
title: "onKeyboardHeightChange - onKeyboardHeightChange Send keyboard event to JS"
---

## onKeyboardHeightChange

> [VERSION] BaseKit >= 3.6.1

> [PLATFORM] iOS, Android

> ⚡ **Supports Promise** — Returns a Promise when success / fail / complete callbacks are omitted.

### Description

onKeyboardHeightChange sends keyboard events to JS

### Parameters

`(listener: Function)`

| Parameter | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `listener` | `(params: KeyboardBeanRes) => void` | Yes | - | Event listener callback function |

### Referenced Types

##### `interface` KeyboardBeanRes

| Property | Type | Since | Description |
| --- | --- | --- | --- |
| `height` | `number` | `3.6.1` | Keyboard height |
| `keyBoardArea` | `KeyBoardArea` | `3.32.6` | Keyboard pop-up position |

##### `interface` KeyBoardArea

| Property | Type | Since | Description |
| --- | --- | --- | --- |
| `top` | `number` | `3.32.6` | Keyboard pop-up top position |
| `bottom` | `number` | `3.32.6` | Keyboard pop-up bottom position |
| `left` | `number` | `3.32.6` | Keyboard left position |
| `right` | `number` | `3.32.6` | Keyboard right position |


### Examples

```tsx
// Register the keyboard height change event + use scanCode's keyboard input mode to bring up the system keyboard.
// When scanCode is called with isShowKeyboard: true, the scan page provides a "Keyboard input" entry; after entering, the input field auto-focuses to show the system keyboard, and onKeyboardHeightChange is triggered when the keyboard height changes.
ty.onKeyboardHeightChange(e => {
  console.log("[onKeyboardHeightChange]", e);
});

ty.scanCode({
  onlyFromCamera: false,
  isShowKeyboard: true,
  keyboardBean: { title: "Keyboard input" },
  success: data => {
    console.log(data);
  },
  fail: error => {
    console.error(error);
  },
});
```