Клавиатуры React Native Scrollview должны повторять нажатие клавиш, которые не работают для ios

Question

У меня есть экран входа в систему, где я оборачиваю весь компонент с помощью ScrollView и, как всегда, применяю свойство keyboardshouldpersisttaps. Похоже, что опора отлично работает на android, но не на ios, при нажатии на textInput он скрывается под клавиатурой.

Ниже мой код для экрана входа в систему

  <View>
        <ScrollView
          style={styles.scrollviewStyle}
          keyboardShouldPersistTaps="always">
          <View style={styles.topContainerStyle}>
            <View style={styles.padding}>
              <Text style={styles.skipTextStyle}>SKIP</Text>
              <Image source={BlackLogo} style={styles.logoStyle} />
            </View>
          </View>
          <Image source={PreLoginImage} style={styles.preLoginImageStyle} />
          <View style={styles.padding}>
            <Text style={styles.getStartedTextStyle}>Let's Get started</Text>

              <View style={styles.bottomContainer}>
                <TextInput
                  // onChangeText={mobile => this.onMobileEnter(mobile)}
                  style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
                  value={this.state.mobile}
                  maxLength={10}
                  onCodeChange={this.onCodeChange}
                />

                <TouchableHighlight
                  disabled={!this.state.mobile ? true : false}
                  onPress={() => this.onProceedPress()}
                  style={
                    !this.state.mobile
                      ? styles.disabledContinueButtonStyles
                      : styles.continueButtonStyles
                  }>
                  <Text
                    style={{
                      alignSelf: 'center',
                      fontFamily: 'Roboto-Medium',
                      fontSize: 16,
                      marginTop: 18,
                      color: '#FFFFFF',
                    }}>
                    CONTINUE
                  </Text>
                </TouchableHighlight>
              </View>

            <Text style={styles.termsStyle}>
              By continuing, you agree to Remedico's terms of use and privacy
              Policy.
            </Text>
          </View>
        </ScrollView>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  topContainerStyle: {
    backgroundColor: '#F4EBE4',
    height: deviceHeight * 0.4,
  },
  logoStyle: {
    width: 139,
    height: 45,
    resizeMode: 'contain',
    top: 123,
  },
  padding: {
    padding: 24,
  },
  preLoginImageStyle: {
    width: 178,
    height: 167,
    position: 'absolute',
    top: deviceHeight * 0.2,
    left: deviceWidth * 0.5,
  },
  getStartedTextStyle: {
    paddingTop: 60,
    fontFamily: 'Ubuntu-Medium',
    fontSize: 20,
  },
  skipTextStyle: {
    left: deviceWidth - 80,
    fontFamily: 'Roboto-Medium',
    fontSize: 16,
  },
  bottomContainer: {
    paddingTop: 32,
  },
  continueButtonStyles: {
    marginTop: 84.5,
    borderRadius: 25,
    backgroundColor: '#00ACC1',
    height: 55,
  },
  disabledContinueButtonStyles: {
    marginTop: 84.5,
    borderRadius: 25,
    backgroundColor: '#CCCCCC',
    height: 55,
  },
  termsStyle: {
    fontFamily: 'Roboto-Regular',
    fontSize: 12,
    paddingTop: 32,
    color: '#808080',
  },
  scrollviewStyle: {
    backgroundColor: '#FFF',
    height: deviceHeight,
  },
  // activityIndicatorStyle:{
  //    marginTop: 84.5
  // },
});

Пожалуйста, предложите, почему это так, и как это будет работать на ios, любое предложение будет полезным, заранее спасибо.

Answer 1

Не думаю, что keyboardshouldpersisttaps реквизит из ScrollView решит вашу проблему. Этот реквизит отключает клавиатуру только при нажатии на представление контейнера.

Пожалуйста, проверьте ссылку: https://reactnative.dev/docs/scrollview#keyboardshouldpersisttaps

Я предлагаю вам использовать https://github.com/APSL/react-native-keyboard-aware-scroll-view для вашей проблемы.

Надеюсь, что это поможет. :)