Keyboard automatically dismisses when appropriate
Why it matters
A keyboard that lingers after form submit covers half the destination screen — users reach the home feed and see only the top row, then tap elsewhere to dismiss before they can scroll. On slow networks, this creates the impression that nothing happened after submit. Leaving the keyboard open during navigation transitions also makes screen-transition animations stutter on low-end Android because the keyboard reposition competes with the transition on the UI thread.
Severity rationale
Low because users can dismiss the keyboard manually, but the lingering state degrades perceived submit success.
Remediation
Call Keyboard.dismiss() at the top of every submit handler and on navigation transitions via React Navigation's beforeRemove listener:
import { Keyboard } from 'react-native';
const handleSubmit = async () => { Keyboard.dismiss(); await submitForm(); };
useEffect(() => navigation.addListener('beforeRemove', () => Keyboard.dismiss()), [navigation]);
Set keyboardShouldPersistTaps="handled" on any wrapping ScrollView so a tap outside the input also dismisses.
DetectionPro
The detection method for this pattern is part of AuditBuffet Pro.
The full method (what to look for, pass and fail conditions, and how results get reported) ships inside the Mobile UX Patterns Audit. The pattern definition, severity rationale, and remediation remain openly licensed under CC-BY-4.0.
Taxons
History
- 2026-04-18·v1.0.0·Initial import from mobile-ux-patterns·automated