import React from 'react';
import { StyleSheet, Text, View, TextInput } from 'react-native';


class SearchInput extends React.Component{

    render(){
        return(
            <View style={this.props.style}>
                <TextInput
                style={[{borderColor:'black'},{borderWidth:1}]}
                placeholder="nome"/>
            </View>
        );
    }
}

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <View style={styles.main}>
            <SearchInput style={styles.SearchInput}/>
        </View>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "yellow",
    flexDirection: "column",
    justifyContent: "flex-start",
    alignItems: "stretch"
  },
  SearchInput:{
    height: 40,
    width: 300,
    borderColor: 'grey',
    borderRadius: 5,
    borderWidth: 0.5,
    alignItems: 'center',
    justifyContent: 'center'
  },
  main:{
    backgroundColor: "white",
    flex: 1,
    justifyContent: "center",
    alignItems: "center"
  }

});