add title text input field to new request form

src/components/button.js

@@ -0,0 +1,31 @@
+import React, { Component } from 'react';
+import { Text, StyleSheet, TouchableHighlight } from 'react-native';
+
+export default class Button extends Component {
+  render() {
+    return (
+      <TouchableHighlight style={styles.button} onPress={this.props.onPress}>
+        <Text style={styles.buttonText}>
+          {this.props.text}
+        </Text>
+      </TouchableHighlight>
+    );
+  }
+};
+
+const styles = StyleSheet.create({
+  button: {
+    justifyContent: 'center',
+    alignItems: 'center',
+    borderWidth: 1,
+    borderRadius: 5,
+    padding: 5,
+    borderColor: 'black',
+    marginTop: 10
+  },
+  buttonText: {
+    flex: 1,
+    alignSelf: 'center',
+    fontSize: 20
+  }
+});

src/components/new_request.js

@@ -1,13 +1,29 @@
 import React, { Component } from 'react';
-import { View, Text, StyleSheet } from 'react-native';
+import { View, Text, TextInput, StyleSheet } from 'react-native';
+import Button from './button';
 
 export default class NewRequest extends Component {
+  getInitialState() {
+    return {
+      title: '',
+      location: '',
+      pizzas: 0
+    }
+  }
   render() {
     return (
       <View style={styles.container}>
         <Text>
           New Request Form
         </Text>
+
+        <Text style={styles.label}>
+          Title:
+        </Text>
+        <TextInput
+          style={styles.input}
+          />
+
       </View>
     );
   }
@@ -18,16 +34,19 @@ const styles = StyleSheet.create({
     flex: 1,
     justifyContent: 'center',
     alignItems: 'center',
-    backgroundColor: '#F5FCFF',
-  },
-  welcome: {
-    fontSize: 20,
-    textAlign: 'center',
-    margin: 10,
+    backgroundColor: 'white',
   },
-  instructions: {
-    textAlign: 'center',
-    color: '#333333',
-    marginBottom: 5,
+  label: {
+    fontSize: 18
   },
+  input: {
+    padding: 4,
+    height: 40,
+    borderColor: 'gray',
+    borderWidth: 1,
+    borderRadius: 5,
+    margin: 5,
+    width: 200,
+    alignSelf: 'center'
+  }
 });

src/components/requests.js

@@ -1,5 +1,6 @@
 import React, { Component } from 'react';
 import { View, Text, StyleSheet } from 'react-native';
+import Button from './button';
 
 export default class Requests extends Component {
   render() {
@@ -8,9 +9,13 @@ export default class Requests extends Component {
         <Text>
           Requests Page
         </Text>
+        <Button text={'Create Request'} onPress={this.onNewRequestPress} />
       </View>
     );
   }
+  onNewRequestPress() {
+    // this.props.navigator.push({name: 'new_request'});
+  }
 };
 
 const styles = StyleSheet.create({