useReanimatedFocusedInput
Hook that returns an information about TextInput
that currently has a focus. Returns null
if no input has focus.
Hook will update its value in next cases:
- when keyboard changes its size (appears, disappears, changes size because of different input mode);
- when focus was changed from one
TextInput
to another; - when
layout
of focused input was changed; - when user types a text.
Events order
The value from useReanimatedFocusedInput
will be always updated before keyboard events, so you can safely read values in onStart
handler and be sure they are up-to-date.
Event structure
The input
property from this hook is returned as SharedValue
. The returned data has next structure:
type FocusedInputLayoutChangedEvent = {
target: number; // tag of the focused TextInput
// layout of the focused TextInput
layout: {
x: number; // `x` coordinate inside the parent component
y: number; // `y` coordinate inside the parent component
width: number; // `width` of the TextInput
height: number; // `height` of the TextInput
absoluteX: number; // `x` coordinate on the screen
absoluteY: number; // `y` coordinate on the screen
};
};
Example
const { input } = useReanimatedFocusedInput();
Also have a look on example app for more comprehensive usage.