Expo Android：为什么出现键盘时视图会向上移动？

Question

我已将softwareKeyboardLayoutMode字段设置为在 app.json 中pan ，如下所示：

"android": {
  "softwareKeyboardLayoutMode": "pan"
}, 

这有效地防止了当键盘出现时视图被其他组件扭曲。 但是，这会导致一种奇怪的行为，即视图（包括堆栈屏幕标题）被键盘向上推，以获取<TextInput />出现在键盘区域范围内的组件。

删除app.json中的softwareKeyboardLayoutMode字段（允许它默认为resize ）可以防止这种行为，但会导致其他组件在键盘渲染时出现扭曲的视图。 想知道是否有人以前遇到过这个问题，并找到了有效的解决方法/解决方案？ 真的很感谢你的时间！

以下是一个最小示例的代码：

<View style={{ flex: 1, backgroundColor: "white" }}>
  <View
    style={{
      position: "absolute",
      bottom: 0,
      left: 0,
      right: 0,
      height: 50,
      backgroundColor: "silver",
    }}
  >
    <TextInput />
  </View>
</View>

Answer 1

你在使用 React Native 吗？ 您的应用程序中的代码是否与您的示例相似？ 鉴于提供的信息/上下文，我认为您可能希望首先尝试添加 SafeAreaView 并将您的 View 内容包装在其中。 下面的代码示例使用您上面的示例：

import { SafeAreaView } from "react-native";

//all other code here to render screen

<SafeAreaView>
  <View style={{ flex: 1, backgroundColor: "white" }}>
    <View
      style={{
        position: "absolute",
        bottom: 0,
        left: 0,
        right: 0,
        height: 50,
        backgroundColor: "silver",
      }}
    >
      <TextInput />
    </View>
  </View>
</SafeAreaView>