keyboard.watch
Calls listener with each event: willShow, didShow, willHide,
didHide, willChangeFrame or didChangeFrame. Both platforms send every
one, Will events included (Android through WindowInsetsAnimation). In a
component it stops when the component unmounts; elsewhere the returned
subscription stops it.
Utilisation
Dismiss and observe the keyboard
import { Box, Button, Text, VStack, keyboard } from 'kuito';
export default function KeyboardState() {
keyboard.frame.value; // { screenX, screenY, width, height } or null
// In a component, until it unmounts; elsewhere, until remove().
keyboard.watch('didShow', (event) => console.log(event.frame.height, event.duration));
return (
<VStack>
<Text>{keyboard.visible.value ? 'typing' : ''}</Text>
{/* Rides on the keyboard. */}
<Box translateY={keyboard.height.map((height) => -height)} />
<Button onPress={() => keyboard.dismiss()}>Done</Button>
</VStack>
);
}Signatures
(event: KeyboardEventName, listener: (event: KeyboardFrameEvent) => void): EventSubscriptionParamètres
| Nom | Type | Requis | Description |
|---|---|---|---|
event | KeyboardEventName | Oui | — |
listener | (event: KeyboardFrameEvent) => void | Oui | — |
Retourne
Généré depuis les déclarations TypeScript publiques : signatures, props et valeurs par défaut viennent de la source vérifiée, les descriptions de sa JSDoc. Aucune valeur par défaut n'est inventée.