KeyboardAccessoryNavigation height проблема - PullRequest
0 голосов
/ 11 февраля 2020

Я разрабатываю форму, в которой TextInputs хранятся внутри ScrollView, а View удерживает кнопку внизу. Затем я включил KeyboardAccessoryNavigation в контейнер для управления следующей и предыдущей кнопкой.

Проблема в том, что всякий раз, когда я использую вид нижней палки высотой 40, KeyboardAccessoryNavigation также принимает дополнительную высоту, как показано на рисунке.

render() {
        const Button = ({title, color, width, onPress }) => {
            return (
              <View style={ {width: width, height: 40} }>
                <TouchableOpacity onPress = { onPress } style= { { 
                    flex: 1,
                    flexDirection: 'row', 
                    alignItems: 'center', 
                    justifyContent: 'center', 
                    backgroundColor: 'lightgray',
                    borderRadius: 5} }>
                    <Text style = { {color: color, fontWeight: 'bold', fontSize: 17 }} > { title } </Text>
                </TouchableOpacity>
              </View>
            );
        };

        return(
            <SafeAreaView style={styles.container}>
                <View style={styles.container}>
                    <ScrollView style={styles.container}>
                        <View style={styles.inputsContainer}>
                            {inputs.map((input, index) =>
                                <TextInput 
                                style={styles.input} 
                                placeholder = {input.placeholder} 
                                ref = {input.ref}
                                autoCapitalize = 'words' 
                                onFocus = {this.handleFocus(index)}
                                keyboardType = 'default'
                                keyboardType = {input.keyboardType}/>
                            )}
                        </View>
                    </ScrollView>
                    <KeyboardAccessoryNavigation 
                        nextDisabled={this.state.nextFocusDisabled} 
                        previousDisabled={this.state.previousFocusDisabled} 
                        onNext={this.handleFocusNext}
                        onPrevious={this.handleFocusPrevious} 
                        tintColor='black'
                        nextButtonStyle = {styles.nextButton}
                        avoidKeyboard = {true}
                        androidAdjustResize = { true }
                    />
                </View>
                <View style={{
                            height: 60, 
                            flexDirection:'row', 
                            alignItems: 'center',
                            justifyContent: 'center',
                            backgroundColor: 'gray',
                            }}>
                            <Button title='Continue' color='black' width='60%' 
                                onPress={this.signUpAction}></Button>
                    </View>
            </SafeAreaView>
        )
    }

Screenshot

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...