Реагировать на родной текстовый ввод scrollView android
Я пытаюсь написать очень простое приложение, чтобы проверить реакцию родного.
У меня есть несколько компонентов TextInput в большом ScrollView, как формуляр регистра.
Все работает нормально, но когда я нажимаю на TextInput, он не прокручивается.
Я могу прокручивать страницу только когда нажимаю в пустых местах. Есть идеи, как это сделать?
Благодарю.
<ScrollView>
<TextInput onChangeText={email => this.setState({email})} label={ I18n.t("contactEmail") }/>
<TextInput onChangeText={email => this.setState({email})} label={ I18n.t("contactEmail") }/>
<TextInput onChangeText={email => this.setState({email})} label={ I18n.t("contactEmail") }/>
<TextInput onChangeText={email => this.setState({email})} label={ I18n.t("contactEmail") }/>
</ScrollView>
2 ответа
У меня была та же самая проблема, и после поиска некоторое время никакой ответ не помог мне; так что я решил это сам, поставив <TouchableWithoutFeedback />
над каждым <TextInput>
и отправка сенсорного события обратно в <TextInput />
:
<View>
<TextInput ref ={(ref)=>this.textInput = ref}>
<TouchableWithoutFeedback style={{position: 'absolute', top:0, bottom:0, left:0, right:0}}
onPress={()=>this.textInput.focus()}/>
</View>
Вы можете создать пользовательский компонент, который оборачивает TextInput таким образом, и использовать их в своих ScrollViews.
Я решил проблему так:
<TouchableOpacity
activeOpacity={1}
style={{ flex: 1 }}
onPress={() => this.textInput.focus()} >
<View
style={{ flex: 1 }}
pointerEvents="none" >
<TextInput
ref={(ref) => this.textInput = ref}
style={{ fontSize: 14, color: '#666666', textAlign: 'right', flex: 1 }}
placeholder={this.props.placeHolder}
defaultValue={this.props.defaultValue ? this.props.defaultValue + '' : ''}
placeholderTextColor='#aaaaaa'
keyboardType={this.props.keyboardType ? this.props.keyboardType : 'default'}
secureTextEntry={this.props.isSecret}
onChangeText={this._onChangeText.bind(this)} />
</View>
</TouchableOpacity>
Вот так реагируют родные работы. Я приглашаю вас прочитать документацию, пожалуйста, обратитесь к Официальной документации TextInput и Официальной документации ScrollView] 3
Этот пакет предоставляет функции, которые вы ищете для реакции-нативного-осведомленного-прокрутки-просмотра