Keyboardavoidingview только перемещает последнего ребенка

Мне действительно тяжело заставить KeyboardAvoidingView работать должным образом.

Я хочу обернуть его вокруг FlatList комментариев и TextInput, чтобы добавить новый комментарий. Когда клавиатура активна, оба элемента должны быть перемещены вверх. Если вы используете Instagram, именно так, как их комментарии на экране.

Однако, что бы я ни пытался, это только TextInput, который перемещается вверх, по комментариям.

      <View style={{ flex: 1 }}>
        <KeyboardAvoidingView behavior="padding" keyboardVerticalOffset={65} style={{ flex: 1 }}>
          <FlatList
            style={{ flex: 1 }}
            data={comments}
            keyboardDismissMode="on-drag"
            keyboardShouldPersistTaps="always"
            ref={commentList => {
              this.commentList = commentList;
            }}
            keyExtractor={item => item.id}
            renderItem={({ item }) => <CommentItem {...item} />}
          />
          <CommentForm updateId={updateId} userId={userId} />
        </KeyboardAvoidingView>
      </View>

Любая помощь будет приветствоваться.

Я уже попробовал комбинацию Views и добавление TextInput в качестве нижнего колонтитула, что не сработало.

1 ответ

У меня был гораздо лучший успех, используя react-native-keyboard-spacer, Может быть, попробовать?

Другие вопросы по тегам