title: how to set react native button to full width
body: <p>I have tried all of the examples out there but I can not figure it out. I am using this <a href="https://github.com/xinthink/react-native-material-kit" rel="nofollow noreferrer">https://github.com/xinthink/react-native-material-kit</a></p>
  
  <p>If I use the dimensions as the width the button width goes off screen. I would like if possible to have the logo at the very top and the form and button at the very button. this is for android only.</p>
  
  <pre><code> const btnStyle = {
  btn: {
      flex: 1,
      flexDirection: "row"
      //resizeMode: 'cover'
  }
  };
  const ColoredRaisedButton = MKButton.coloredButton()
  .withStyle(btnStyle.btn)
  .build();
  
  &lt;ScrollView style={styles.scrollView}&gt;
  &lt;View style={styles.container}&gt;
      {/* Here the magic happens*/}
      &lt;View style={styles.cardStyle}&gt;
          &lt;Image
              source={require("./../img/logo_login.jpg")}
              style={styles.cardImageStyle}
          /&gt;
          &lt;View style={styles.cardContentStyle}&gt;
              &lt;Form
                  ref="form"
                  type={User}
                  onChange={this.onChange.bind(this)}
                  value={this.state.value}
                  options={options}
              /&gt;
          &lt;/View&gt;
          &lt;View style={styles.cardActionStyle}&gt;
              &lt;ColoredRaisedButton&gt;
                  &lt;Text pointerEvents="none" style={styles.buttonText}&gt;
                      BUTTON
                  &lt;/Text&gt;
              &lt;/ColoredRaisedButton&gt;
          &lt;/View&gt;
      &lt;/View&gt;
  &lt;/View&gt;
  &lt;/ScrollView&gt;;
  
  const styles = {
  cardStyle: {
      flex: 1,
      backgroundColor: "#ffffff",
      borderRadius: 2,
      borderColor: "#ffffff",
      borderWidth: 1,
      shadowColor: "rgba(0,0,0,.12)",
      shadowOpacity: 0.8,
      shadowRadius: 2,
      alignItems: "center",
      flexDirection: "column",
      justifyContent: "center",
      shadowOffset: {
          height: 1,
          width: 2
      }
  },
  cardImageStyle: {
      flex: 1,
      height: 170,
      flexDirection: "row",
      resizeMode: "cover"
  },
  cardContentStyle: {
      padding: 15 //,
      // bottom:0,
      // position:'absolute',
      //justifyContent: 'flex-end'
  },
  cardActionStyle: {
      flex: 1,
      borderStyle: "solid",
      borderTopColor: "rgba(0,0,0,.1)",
      borderTopWidth: 1,
      padding: 15,
      alignItems: "center",
      flexDirection: "column",
      justifyContent: "center"
  },
  scrollView: {
      flex: 1
  },
  container: {
      flex: 1,
      alignItems: "stretch",
      backgroundColor: "#eae9e9",
      padding: 20 //,
      //position:'absolute'
  },
  buttonText: {
      fontSize: 14,
      fontWeight: "bold",
      color: "white"
  }
  };
  </code></pre>