scrollview не может прокручивать, когда фокус textinput реагирует на нативный

Question

У меня есть TextInput внутри ScrollView.

Прокрутка не работает, когда TextInput находится в фокусе. Эта проблема касается только Android.

Answer 1

Установка

<ScrollView keyboardShouldPersistTaps="always"

в сочетании с компонентом textInout ниже (пользовательский компонент, который я создал для ввода текста для решения этой проблемы) решил мою проблему:

<TouchableOpacity
     activeOpacity={1}
     onPress={()=>this.input.focus()}>
     <View pointerEvents="none"
           <TextInput
              ref = {(input) => this.input = input}
           />
     </View>
</TouchableOpacity>

Answer 2

В scrollView используйте keyboardShouldPersistTaps

<ScrollView keyboardShouldPersistTaps="handled">

это решит вашу проблему

проверьте документы здесь https://facebook.github.io/react-native/docs/scrollview.html

Answer 3

Это ожидаемое поведение.

Для получения дополнительной информации Официальная документация TextInput

Возможно, вы захотите попробовать что-то вроде этого: response-native-aware-scroll-view

Answer 4

Я использую простой трюк, и он работает для меня правильно. Следует добавить это prop в TextInput :

      <TextInput
      multiline={true}
      numberOfLines={1}
 />

Answer 5

Это очень хороший пример: http://blog.arjun.io/react-native/mobile/cross-platform/2016/04/01/handling-the-keyboard-in-react-native.html

Для меня было очень важно добавить:

андроид:windowSoftInputMode="adjustResize"

в AndroidManifest.xml, чтобы сфокусировать textInput

Answer 6

Я обрабатываю по-разному для каждой платформы (в iOS фокуса на inputText достаточно, не забудьте поставить this.scrollViewRef ссылка внутри ScrollView которые обертывают inputText и помещают ref index в inputText

if (Platform.OS == 'android') {
    this.inputRefs[field].measure((w, h, px, py, xPage, yPage) => {
        this.scrollViewRef.scrollTo({ x: 0, y: yPage, animated: true })
        this.inputRefs[field].focus()
    })
} 
this.inputRefs[field].focus()