title: Keyboard aware scroll view takes up screen space
body: <p>I am implementing <a href="https://github.com/APSL/react-native-keyboard-aware-scroll-view" rel="nofollow noreferrer">React Native Scroll View</a> to handle the keyboard in my application layout, it works great but it is adding extra "padding" or whitespace below my components.</p>
  
  <p><a href="https://i.stack.imgur.com/fU7HW.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/fU7HW.png" alt="enter image description here"></a></p>
  
  <p>It is already styled with <code>flex: 1</code> to take all the screen space. Here's the <code>jsx</code> code for <code>App.js</code></p>
  
  <pre class="lang-js prettyprint-override"><code>    &lt;PaperProvider&gt;
        &lt;StatusBar
          barStyle="dark-content"
          hidden={false}
          backgroundColor="#00BCD4"
          translucent={true}
        /&gt;
        &lt;KeyboardAwareScrollView
          style={{ flex: 1 }}
        &gt;
          &lt;View style={styles.container}&gt;
            &lt;UnitCard /&gt;
            &lt;UnitCard /&gt;
            &lt;Converter /&gt;
          &lt;/View&gt;
        &lt;/KeyboardAwareScrollView&gt;
      &lt;/PaperProvider&gt;
    );
  };
  
  const styles = StyleSheet.create({
    container: {
      display: "flex",
      flexDirection: "column",
      justifyContent: "center",
      flex: 1,
      backgroundColor: "#eee",
    },
    cards: {
      flex: 1,
      display: "flex",
      flexDirection: "row",
      alignItems: "center",
      justifyContent: "center",
    },
  });
  
  </code></pre>