I am trying to use the react-native-keyboard-aware-scroll-view so the keyboard doesn't cover my inputs.
For some reason it always thinks there is a keyboard active I guess because it always compresses everything.
Attached is a picture of what is happening as well as the code. Any chance anyone has any idea whats happening here? I've been playing around with it for awhile and have had no luck. I'm running react-native v 0.33 and react-native-keyboard-aware-scroll-view v 0.2.1.
https://www.npmjs.com/package/react-native-keyboard-aware-scroll-view
import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';class LoginIOS extends Component{ constructor(props) { super(props); this.login = this.login.bind(this); this.renderScene = this.renderScene.bind(this); this.state={ username: '', password: '' }; } render() { return (<Navigator renderScene={this.renderScene} navigator={this.props.navigator} navigationBar={<Navigator.NavigationBar style={{backgroundColor: 'transparent'}} routeMapper={NavigationBarRouteMapper} /> } /> ); } renderScene() { return (<KeyboardAwareScrollView><View style={styles.container}><Spinner visible={this.state.visible} /><StatusBar barStyle="light-content" hidden={true}/><View style={styles.topContainer}><View style={styles.bannerContainer}><View style={{flexDirection: 'column', flex: 1, justifyContent: 'center', alignItems: 'center'}}><Image style={styles.mark} source={require('***')} /></View></View><View style={styles.credentialContainer}><View style={styles.inputContainer}><Icon style={styles.inputPassword} name="person" size={28} color="#FFCD00" /><View style={{flexDirection: 'row', flex: 1, marginLeft: 2, marginRight: 2, borderBottomColor: '#e0e0e0', borderBottomWidth: 2}}><TextInput style={styles.input} placeholder="Username" autoCorrect={false} autoCapitalize="none" returnKeyType="next" placeholderTextColor="#e0e0e0" onChangeText={(text) => this.setState({username: text})} value={this.state.username}></TextInput></View></View><View style={styles.inputContainer}><Icon style={styles.inputPassword} name="lock" size={28} color="#FFCD00" /><View style={{flexDirection: 'row', flex: 1, marginLeft: 2, marginRight: 2, borderBottomColor: '#e0e0e0', borderBottomWidth: 2}}><TextInput style={styles.input} placeholder="Password" returnKeyType="done" autoCorrect={false} secureTextEntry={true} placeholderTextColor="#e0e0e0" onChangeText={(text) => this.setState({password: text})} value={this.state.password} onSubmitEditing={(event)=> { this.login(); }}></TextInput></View></View><TouchableOpacity style={styles.forgotContainer}></TouchableOpacity></View></View><TouchableHighlight underlayColor="#D6AB00" onPress={this.login} style={styles.signInButtonContainer}><Text style={styles.signInText}>Sign In</Text></TouchableHighlight></View></KeyboardAwareScrollView> ); }