首页 > 解决方案 > React Native 的 KeyboardAvoidingView keyboardVerticalOffset 与 textinput 上的下划线重叠

问题描述

我正在使用 keyboardVerticalOffset 以便在显示键盘时适当地向上移动内容。它运行良好,但是当显示键盘时,下划线被掩盖了。

如果我增加keyboardVerticalOffset 值,它只会在输入下方添加空白,您仍然看不到下划线。

<KeyboardAvoidingView 
  style={{ 
    flex: 1, 
    flexDirection: 'column', 
    justifyContent: 'center', 
    backgroundColor: '#fff'
  }} 
  behavior="padding" 
  keyboardVerticalOffset={90}
  enabled>
   ScrollView 
     style={{backgroundColor: '#fff'}} 
     keyboardShouldPersistTaps='always'>
      <Content style={globalStyles.content} keyboardShouldPersistTaps='always'>
        <Form>
          {this.renderInspectionDetails()}
          {this.renderClientInformation()}
          {this.renderBuyersAgentDetails()}
          {this.renderSellersAgentDetails()}
          {this.renderNotes()}
        </Form>
      </Content>
    </ScrollView>
</KeyboardAvoidingView>

下图显示了一个文本输入焦点。

在此处输入图像描述

标签: androidreact-native

解决方案


推荐阅读