Реагировать на родной текстовый ввод 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

Этот пакет предоставляет функции, которые вы ищете для реакции-нативного-осведомленного-прокрутки-просмотра

Другие вопросы по тегам