时间戳

首页 > 解决方案 > React Native 中显示键盘时如何不移动视图？

react-native - React Native 中显示键盘时如何不移动视图？

问题描述

我在屏幕上有两个元素。第一个是带有 flex 的 Scrollview，另一个是固定高度的 View。当键盘出现时，视图元素上升。

如何实现元素不上去？

好的，代码如下：

<View style={{flex: 1}}>
    <Scrollview style={{flex: 1}}>
        <TextInput />
    </Scrollview>
    <View style={{height: 24}}>
         Two buttons here...
    </View>
</View>

这是屏幕截图： 在此处输入图像描述

只是希望在显示键盘时两个页脚按钮不会上升。

标签： react-nativeflexboxscrollview

解决方案

您可以尝试以下代码。它可能会解决您的问题

<KeyboardAvoidingView
    behavior={Platform.OS == "ios" ? "padding" : "height"}
    keyboardVerticalOffset={Platform.OS == "ios" ? 0 : 20}
    enabled={Platform.OS === "ios" ? true : false}>

  <Text>Hello</Text>
  <Text>World</Text>

</KeyboardAvoidingView>

推荐阅读