scrollview can't scroll when focus textinput react native

问题

I have a TextInput inside a ScrollView.

The scroll isn't working when the TextInput is on focus. This problem is only affecting Android.

回答1:

setting

<ScrollView keyboardShouldPersistTaps="always"

in combination with the textInout component below (custom component that i created for text inputs to solve this issue) solved my problem:

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

回答2:

In scrollView use keyboardShouldPersistTaps

<ScrollView keyboardShouldPersistTaps="handled">

it solve your problem

check docs here https://facebook.github.io/react-native/docs/scrollview.html#keyboarddismissmode

回答3:

That is the expected behavior.

For more information Official TextInput documentation

You might want to try something like this: react-native-aware-scroll-view

回答4:

This is a very good example: http://blog.arjun.io/react-native/mobile/cross-platform/2016/04/01/handling-the-keyboard-in-react-native.html

The thing that was really important for me was to add:

android:windowSoftInputMode="adjustResize"

in AndroidManifest.xml in order to focus the textInput

回答5:

I handle in different ways to each platform (in Ios focus to inputText is enough, don't forget to put this.scrollViewRef ref inside ScrollView that wrap inputText and put ref index the 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()

来源：https://stackoverflow.com/questions/39745442/scrollview-cant-scroll-when-focus-textinput-react-native