时间戳

首页 > 解决方案 > Android 上的 KeyboardAvoidingView 在键盘上方创建一个灰色框

android - Android 上的 KeyboardAvoidingView 在键盘上方创建一个灰色框

问题描述

我的登录表单有一个 Web 视图，我想在触发键盘时自动向上滚动，而不用Text向上推我的组件。有没有办法让组件忽略键盘，使其保持在键盘下方的底部，同时保留该行为？

以下是我尝试过的代码。它确实将视图向上推，我的文本组件保持在底部，但我在键盘上方留下了一个灰色框。

      <KeyboardAvoidingView
        style={{flex: 1}
        behavior={Platform.OS === 'ios' ? null : 'padding'}
        keyboardVerticalOffset={Platform.OS === 'ios' ? 0 : headerHeight - 10}> // if I do -200 it will remove the grey box but the view does not shift when the keyboard is toggled
        <ScrollView>
          <WebView
            automaticallyAdjustContentInsets={false}
            style={{flex: 1, alignSelf: 'stretch', width: Dimensions.get('window').width, height: Dimensions.get('window').height},}
            source={{ uri }}
          />
          <Text style={{position: 'absolute', left: 0, right: 0, textAlign: 'center', bottom: '5%', backgroundColor: 'white'},}>
            For more information:{' '}
            <Text
              style={{ color: 'blue' }}
              onPress={() =>
                Linking.openURL(redirectURI)
              }>
              Tap here!
            </Text>
          </Text>
        </ScrollView>
      </KeyboardAvoidingView>

我该如何解决？

标签： androidreact-nativereact-native-android

解决方案

您是否测试过将 KeyboardAvoidingView 放在 ScrollView 中？

推荐阅读