KeyboardAvoidingView 不适用于 "padding" 或“高度

Question

我正在包装一个 View，其中包含一个 TextInput 和 Text 组件。我的目标是在键盘可见时更改视图的高度。

对于我的应用程序，我需要 Header、TabBars 和发送组件 transparent 和 absolute，这意味着文本输入位于下方他们没有 marginTop 或将文本输入的位置也设置为绝对。

我已经尝试根据可见的键盘有条件地更改视图的高度，但移动并不流畅。我想使用 KeyboardAvoidingView，但唯一能做任何事情的行为是 position，我不想将其向上推。

正如你从照片中看到的那样，无论我做什么都没有调整。

如有任何帮助，我们将不胜感激！

已编辑下面是对我有用的解决方案

 <View style={tw.style(`h-full bg-white`, {})}>
  <StatusBar barStyle={"light-content"} />
   <KeyboardAvoidingView behavior="padding" keyboardVerticalOffset={-160}>
    <View
      style={tw.style(`w-full bg-white`, {
        marginTop: 177,
        marginBottom: 225,
      })}
    >
      <TextInput
        style={tw.style(`h-full w-full text-black text-base p-4 bg-white`, {
          textAlignVertical: "top",
        })}
        defaultValue={defaultMessage}
        onChangeText={(messageText) => setMessageText(messageText)}
        maxLength={500 + defaultMessage.length}
        keyboardType="default"
        multiline={true}
      />
      <View style={tw.style(`w-full h-8 items-end pr-4 py-2`, {})}>
        <Text>{charRemain} characters remaining</Text>
      </View>
    </View>
  </KeyboardAvoidingView>
</View>

Answer 1

尝试添加keyboardVerticalOffset

<KeyboardAvoidingView style={tw.style(`h-full flex flex-col bg-white`, {})} behavior="height" keyboardVerticalOffset={200}>

请用一些正负偏移值做一些命中和试验。

KeyboardAvoidingView 不适用于 "padding" 或“高度

KeyboardAvoidingView not working with "padding" or "height

javascript

css

keyboard

react-native