React Native安卓端文本输入框与键盘出现异常间距问题求助

1. 优先检查安卓原生配置 #

打开android/app/src/main/AndroidManifest.xml，找到主Activity配置，修改windowSoftInputMode为以下值：

<activity
  android:name=".MainActivity"
  android:windowSoftInputMode="adjustResize"
  <!-- 其他原有配置保持不变 -->
>

• 注意：如果项目开启了沉浸式状态栏/全屏模式，需要额外适配系统窗口inset，避免系统计算键盘高度时包含状态栏/导航栏高度导致偏差。如果是Expo项目不需要修改原生配置，只需在app.json中配置android:softwareKeyboardLayoutMode为resize即可。

2. 修正KeyboardAvoidingView配置 #

你当前代码在安卓端也使用了padding行为，同时设置了负数的keyboardVerticalOffset，属于重复适配：安卓在adjustResize模式下系统已经自动调整窗口高度，再加KeyboardAvoidingView的padding行为会导致布局被两次顶起产生空白，修改配置如下：

<KeyboardAvoidingView
  style={{
    flex: 1,
    backgroundColor: theme.bodyColor,
  }}
  // 安卓端不设置behavior属性，仅iOS用padding模式
  behavior={Platform.OS === 'ios' ? 'padding' : undefined}
  // 安卓端不需要额外offset
  keyboardVerticalOffset={Platform.OS === 'ios' ? 120 : 0}
>

3. 备选方案：手动监听键盘事件适配 #

如果上述方案仍无法解决，可以放弃KeyboardAvoidingView，直接通过Keyboard模块监听键盘状态手动控制偏移，可控性更高：

import { Keyboard } from 'react-native';

// 组件内声明状态
const [keyboardHeight, setKeyboardHeight] = useState(0);

useEffect(() => {
  const showListener = Keyboard.addListener('keyboardDidShow', (e) => {
    setKeyboardHeight(e.endCoordinates.height);
  });
  const hideListener = Keyboard.addListener('keyboardDidHide', () => {
    setKeyboardHeight(0);
  });
  return () => {
    showListener.remove();
    hideListener.remove();
  };
}, []);

// 给包裹输入框的外层View添加对应底部padding即可
<View style={{
  flex: 1,
  flexShrink: 1,
  backgroundColor: theme.bodyColor,
  width: width,
  borderTopWidth: 1,
  borderTopColor: theme.footerBorderColor,
  paddingBottom: keyboardHeight
}}>

内容的提问来源于stack exchange，提问作者Maja Maja