带有 ScrollView 的 KeyboardAvoidingView [英] KeyboardAvoidingView with ScrollView

问题描述

我是 React Native 的新手，有一个我在 React Native 文档中没有找到的问题.

I am sort of new to react native and have one question that I did not find in react native documentation.

我正在研究这个组件 KeyboardAvoidingView:https://facebook.github.io/react-native/docs/keyboardavoidingview.html

I am looking into this component KeyboardAvoidingView: https://facebook.github.io/react-native/docs/keyboardavoidingview.html

问题很简单 - 有没有人让 KeyboardAvoidingView 与 ScrollView 很好地协同工作?我在一个组件中有许多 TextInputs(TextInputs 高度的总和大于设备高度)，一旦出现键盘，我就会遇到各种问题..
如果我使用 View 而不是 ScrollView 那么一切都很好，但我不能使用它，因为我需要比设备高度更多的空间..我在 KeyboardAvoidingView 文档中找不到关于 Scroll 的任何信息.

Question is simple - has anyone to get KeyboardAvoidingView to work nicely with ScrollView? I have many TextInputs in one component (sum of TextInputs height is bigger then device height), and once the keyboard appears, I have various issues..
If I use View instead of ScrollView then everything is fine, but I can't use it, since I need more space than the device height.. I Couldn't find anything about Scroll in the KeyboardAvoidingView documentation.

谢谢.

推荐答案

这就是我的解决方案，它可以工作并在焦点输入时自动滚动.我在 Expo 上试过这个，希望能帮到你.

This is what my solution would be, it works and scrolls automatically on focus input. I tried this on Expo, hope it helps.

<KeyboardAvoidingView style={{ flex: 1, flexDirection: 'column',justifyContent: 'center',}} behavior="padding" enabled   keyboardVerticalOffset={100}>
    <ScrollView>
        <View style={Styles.row}>
            //your view
        </View>
    </ScrollView>
</KeyboardAvoidingView>

这篇关于带有 ScrollView 的 KeyboardAvoidingView的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！