title: How to auto scroll the screen up when virtual keyboard appears in react native (on android)
body: <p>The virtual keyboard covers the text inputs and I cannot see what I'm typing. How to avoid this ?
  ( I tried using KeyboardAwareScrollView but it still covers the text inputs). 
  Another issue that I got was an error regarding my styles.container attributes -> justifyContent and alignItems - it said put those inside the ScrollView property - I'm not sure how to do that - I'm new to React native.</p>
  
  <pre><code>  render() {
      return (
        &lt;KeyboardAwareScrollView&gt;
        &lt;View style={styles.container} &gt;
           &lt;TextInput
            style={styles.input}
            underlineColorAndroid="transparent"
            placeholder="username"
            placeholderTextColor="#00bcd4"
            autoCapitalize="none"
            secureTextEntry={true}
            onChangeText={username =&gt; this.setState({ username })}  
  
            /&gt;
            &lt;View style={styles.btnContainer}&gt;     
           &lt;TouchableOpacity style={styles.userBtn}  onPress={() =&gt; this.Login(this.state.email, this.state.password)}&gt;
                     &lt;Text style={styles.btnTxt}&gt;Login&lt;/Text&gt;
           &lt;/TouchableOpacity&gt;
  
          &lt;/View&gt;
        &lt;/View&gt;
        &lt;/KeyboardAwareScrollView&gt;
  </code></pre>
  
  <p>with KeyboardAvoidingView also, the same thing:</p>
  
  <pre><code>  render() {
      return (
        // &lt;View style={styles.container} &gt;
           &lt;KeyboardAvoidingView behavior="padding" style={styles.container}&gt;
           &lt;Text style={styles.heading} &gt;Welcome to SelfCare !&lt;/Text&gt;
            &lt;Image
            style={{width: 200, height: 200, marginBottom: 40}}
            source={require('./src/images/icon.png')}
            /&gt;
           &lt;TextInput
            style={styles.input}
            underlineColorAndroid="transparent"
            placeholder="Email"
            placeholderTextColor="#00bcd4"
            autoCapitalize="none"
            onChangeText={email =&gt; this.setState({ email })}  
               /&gt;
           &lt;TextInput
            style={styles.input}
            underlineColorAndroid="transparent"
            placeholder="Password"
            placeholderTextColor="#00bcd4"
            autoCapitalize="none"
            secureTextEntry={true}
            onChangeText={password =&gt; this.setState({ password })}  
  
            /&gt;
            &lt;View style={styles.btnContainer}&gt;     
           &lt;TouchableOpacity style={styles.userBtn}  onPress={() =&gt; this.Login(this.state.email, this.state.password)}&gt;
                     &lt;Text style={styles.btnTxt}&gt;Login&lt;/Text&gt;
           &lt;/TouchableOpacity&gt;
           &lt;TouchableOpacity style={styles.userBtn}  onPress={() =&gt; this.SignUp(this.state.email, this.state.password)}&gt;
                     &lt;Text style={styles.btnTxt}&gt;Sign Up&lt;/Text&gt;
           &lt;/TouchableOpacity&gt;         
          &lt;/View&gt;
          &lt;/KeyboardAvoidingView&gt;
        // &lt;/View&gt;
      );
    }
  }
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/qIocf.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/qIocf.png" alt="keyboard covers textinput"></a></p>