subscribeKeyboardHeight

subscribeKeyboardHeight es una función de utilidad que permite suscribirte a los cambios en la altura del teclado en pantalla.

La función invoca el callback proporcionado siempre que la altura del teclado pueda cambiar, incluso cuando el teclado aparece, desaparece o cambia de tamaño.

Internamente, esta función escucha los eventos resize y scroll del área visible (Visual Viewport):

• resize: ocurre cuando cambia la altura del área visible
• scroll: ocurre cuando cambia el desplazamiento del área visible (importante en iOS, donde el área visible puede desplazarse sin cambiar de tamaño)

Optimizaciones de rendimiento:

• Limita la frecuencia de forma predeterminada (16 ms, ~60 fps) para evitar invocaciones excesivas del callback
• Omite el callback cuando la altura no ha cambiado (deduplicación)

Interfaz

function subscribeKeyboardHeight(
  options: SubscribeKeyboardHeightOptions
): SubscribeKeyboardHeightResult;

Parámetros

• optionsrequired · SubscribeKeyboardHeightOptions
  

  Opciones de configuración

  • options.callbackrequired · (height: number) => void
    

    Una función que recibe la altura actualizada del teclado en píxeles.

  • options.immediateboolean · false
    

    Si es true, la función invoca el callback inmediatamente con la altura actual del teclado.

  • options.throttleMsnumber · 16
    

    Intervalo de limitación de frecuencia en milisegundos.

Valor de retorno

• SubscribeKeyboardHeightResult
  

  Un objeto que contiene la función para cancelar la suscripción.

  • unsubscribe() => void
    

    Cancela la suscripción de todos los receptores de eventos y deja de recibir actualizaciones de la altura del teclado.

Ejemplo

const { unsubscribe } = subscribeKeyboardHeight({
  callback: height => {
    footer.style.paddingBottom = `${height}px`;
  },
  immediate: true,
});

// Más adelante, cuando necesites realizar la limpieza
unsubscribe();