KeyboardAvoidingView通过反应原生的过度填充来推高内容

Question

我无法使KeyboardAvoidingView正常工作。对于类似的屏幕，它工作顺利，但另一方面，它将内容推向屏幕上太远的位置，在两者之间增加了过多的空间。任何修复？

代码：

<KeyboardAvoidingView behavior="padding" style={styles.container}>
         {this.props.signNameErr &&
            (<Text style={{color: 'red'}}>{this.props.errMessage}</Text>)
          }
      <View style={styles.formContainer}>
        <TextInput
          style={styles.formInput}
          placeholderTextColor="rgba(255,255,255,0.7)"
          underlineColorAndroid='rgba(0,0,0,0)'
          returnKeyType="next"
          autoCorrect={false}
          onChangeText={(full_name)=> this.setState({full_name})}
          value={this.state.fullname}
          placeholder="Enter Full Name"
          />
          {this.props.signEmailErr &&
            (<Text style={{color: 'red'}}>{this.props.errMessage}</Text>)
          }
        <TextInput
          style={styles.formInput}
          placeholderTextColor="rgba(255,255,255,0.7)"
          underlineColorAndroid='rgba(0,0,0,0)'
          returnKeyType="next"
          keyboardType="email-address"
          autoCapitalize="none"
          autoCorrect={false}
          onChangeText={(email)=> this.setState({email})}
          value={this.state.email}
          placeholder="Enter Email"
          keyboardType="email-address"
          />
           {this.props.signPwErr &&
            (<Text style={{color: 'red'}}>{this.props.errMessage}</Text>)
          }
        <TextInput
          style={styles.formInput}
          placeholderTextColor="rgba(255,255,255,0.7)"
          underlineColorAndroid='rgba(0,0,0,0)'
          returnKeyType="next"
          autoCorrect={false}
          onChangeText={(password)=> this.setState({password})}
          secureTextEntry={this.state.togglePW}
          value={this.state.password}
          placeholder="Create Password (Min. 6 Char)"
          />
        <TouchableOpacity style={styles.buttonContainer} onPress={this.handleSignup}>
          <Text style={styles.buttonText}>SIGN UP</Text>
        </TouchableOpacity>
      </View >
      </KeyboardAvoidingView>

Answer 1

您可以设置填充，甚至可以设置为android和ios

import {KeyboardAvoidingView,Platform,} from 'react-native';

<KeyboardAvoidingView 
  behavior='padding'
  keyboardVerticalOffset={
  Platform.select({
     ios: () => 0,
     android: () => 200
  })()
}>
   ...content...
</KeyboardAvoidingView>

只是一个例子，尝试一下并设定你喜欢的方式。