React Native：调整视图高度时键盘块多行textInput

问题描述：

我一直在尝试使用多行增长textinput一段时间，并且现在在键盘在输入时阻止文本的情况下查找我的应用程序文本输入的新行。我已经尝试过从基于KeyboardAwareScrollView的解决方案到ScrollView解决方案的解决方案，但是我试过的东西没有任何工作。React Native：调整视图高度时键盘块多行textInput

我真的很感激，如果有人可以为我提供一个适用于Android和iOS的解决方案。

我现在拥有的是与多一个TextInput视图支撑

<View style={{ height: this.state.height, flex: 1 }}> 
    <TextInput 
    {...otherProps} 
    placeholder="Skriv här" 
    placeholderTextColor="rgba(0,0,0,0.3)" 
    blurOnSubmit={false} 
    multiline 
    onContentSizeChange={this._onContentSizeChange} 
    style={[styles.textInputStyle, { height: this.state.height }]} 
    /> 
</View>

与_onContentSizeChange功能如下：与图片所示

_onContentSizeChange = (event): void => { 
    const height = event.nativeEvent.contentSize.height; 
    this.setState({ height }); 
}

问题： imgur album

答

KeyboardAvoidingView似乎是你的解决方案。您可以设置视图和键盘之间的距离，并根据输入的高度进行计算。在文档中，您可以找到所有属性：https://facebook.github.io/react-native/docs/keyboardavoidingview.html

您也可以尝试使用KeyboardAvoidingScrollView，然后当输入足够高时，您只需向下滚动屏幕即可。

下面是与键盘的很好的例子，一个真棒文章避免：https://medium.freecodecamp.org/how-to-make-your-react-native-app-respond-gracefully-when-the-keyboard-pops-up-7442c1535580

希望它能帮助。

React Native：调整视图高度时键盘块多行textInput

相关推荐