title: How to put a TextInput at the bottom of the screen in React Native?
body: <p>I make a chat app and I want to put the TextInput at the bottom of the page, but I can't manage to do it . If  I try with position: 'absolute' + bottom: 0 the display is empty. I think I have a problem with a flex in my style , I'm not sure. </p>
  
  <p>Here's my code for MessageScreen:</p>
  
  <pre><code>render() {
      return (
        &lt;Wallpaper&gt;
          &lt;KeyboardAvoidingView behavior='padding'&gt;
            &lt;View&gt;
            &lt;TextInput
              style={styles.input}
              onChangeText={text =&gt; this.setState({ message: text })}
             // value={this.state.email}
              placeholderTextColor='white'
              underlineColorAndroid='transparent'
            /&gt;
              &lt;Button onPress={this.send} title='SEND' /&gt;
                &lt;/View&gt;
                 &lt;/KeyboardAvoidingView&gt;
        &lt;/Wallpaper&gt;
      );
    }
  }
  
  const styles = StyleSheet.create({
    text: {
      color: 'white',
      fontWeight: 'bold',
      backgroundColor: 'transparent',
      paddingLeft: 25
    },
    input: {
      backgroundColor: 'rgba(255, 255, 255, 0.4)',
      width: DEVICE_WIDTH ,
      height: 40,
      color: '#ffffff'
    },
   image: {
      width: 40,
      height: 40
    }
  });
  </code></pre>
  
  <p>Here's the Wallpaper:</p>
  
  <pre><code>render() {
      return (
        &lt;Image style={styles.picture} source={require('src/components/images/wallpaper.png')}&gt;
          {this.props.children}
        &lt;/Image&gt;
      );
    }
  }
  
  const styles = StyleSheet.create({
    picture: {
      flex: 1,
      width: undefined,
      height: undefined,
      resizeMode: 'cover'
    }
  });
  </code></pre>