title: How to set 100% width to TextInput in React Native?
body: <p>I'm making simple To-Do application using React Native, just watching YouTube. The difference video and me is My version is latest RN, and simulating app in Android. </p>
  
  <p>The code looks like same but my <code>TextInput</code> width is not 100%, but very small element as you can see </p>
  
  <p><a href="https://i.stack.imgur.com/s72QX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/s72QX.png" alt="enter image description here"></a></p>
  
  <p>My code is below, How to fix it?</p>
  
  <pre><code>import React, {Component} from 'react';
  import {
      StyleSheet,
      Text,
      View,
      TextInput,
  } from 'react-native';
  
  export default class Main extends Component {
      render() {
          return (
              &lt;View style={styles.wrapper}&gt;
                  &lt;View style={styles.topBar}&gt;
                      &lt;Text style={styles.title}&gt;
                          To-Do List
                      &lt;/Text&gt;
                  &lt;/View&gt;
                  &lt;View style={styles.inputWrapper}&gt;
                      &lt;TextInput
                          style={styles.input}/&gt;
                  &lt;/View&gt;
              &lt;/View&gt;
          );
      }
  }
  
  const styles = StyleSheet.create({
      wrapper: {
          flex: 1,
          justifyContent: 'flex-start',
          alignItems: 'stretch'
      },
      topBar: {
          padding: 16,
          flexDirection: 'row',
          justifyContent: 'center',
          alignItems: 'center',
          backgroundColor: '#2ecc71'
      },
      title: {
          color: 'white',
          fontSize: 20
      },
      inputWrapper: {
          padding: 10,
          flexDirection: 'row',
          alignItems: 'stretch',
          backgroundColor: 'green',
          borderColor: 'red'
      },
      input: {
          height: 26,
          borderRadius: 8,
          backgroundColor: 'white'
      }
  
  
  });
  </code></pre>