fix(mobile): fix keyboard hiding text input on Android and iOS

- Set android.softwareKeyboardLayoutMode to "pan" in app.json to prevent
  conflict between system adjustResize and KeyboardAvoidingView
- Use behavior="padding" consistently on both platforms
- Add keyboardVerticalOffset on Android to account for nav header
- Applied fix across all screens with keyboard input

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
suraj-markup 2026-03-03 03:42:44 +05:30
parent fa5fcc9e91
commit fe90d5b4e7
4 changed files with 8 additions and 5 deletions

View File

@ -30,7 +30,8 @@
"foregroundImage": "./assets/adaptive-icon.png",
"backgroundColor": "#0d1117"
},
"package": "com.composio.aomobile"
"package": "com.composio.aomobile",
"softwareKeyboardLayoutMode": "pan"
},
"web": {
"favicon": "./assets/favicon.png"

View File

@ -164,8 +164,8 @@ export default function SessionDetailScreen({ route, navigation }: Props) {
return (
<KeyboardAvoidingView
style={styles.root}
behavior={Platform.OS === "ios" ? "padding" : "height"}
keyboardVerticalOffset={Platform.OS === "ios" ? 88 : 0}
behavior="padding"
keyboardVerticalOffset={Platform.OS === "ios" ? 88 : 80}
>
<ScrollView ref={scrollRef} style={styles.container} contentContainerStyle={styles.content} keyboardShouldPersistTaps="handled">
{/* Header row */}

View File

@ -132,7 +132,8 @@ export default function SettingsScreen({ navigation }: Props) {
return (
<KeyboardAvoidingView
style={styles.root}
behavior={Platform.OS === "ios" ? "padding" : undefined}
behavior="padding"
keyboardVerticalOffset={Platform.OS === "ios" ? 88 : 80}
>
<ScrollView style={styles.container} contentContainerStyle={styles.content}>
<View style={styles.section}>

View File

@ -52,7 +52,8 @@ export default function SpawnSessionScreen({ navigation }: Props) {
return (
<KeyboardAvoidingView
style={styles.root}
behavior={Platform.OS === "ios" ? "padding" : undefined}
behavior="padding"
keyboardVerticalOffset={Platform.OS === "ios" ? 88 : 80}
>
<ScrollView style={styles.container} contentContainerStyle={styles.content}>
<View style={styles.section}>