Search box and navigation bar (React Native), reactnative
Search box and navigation bar (React Native)
By Wu xueying
'use strict';var React = require('react-native');var { AppRegistry, StyleSheet, View, TextInput,} = React;class SearchBar extends React.Component { render() { return ( <View style={styles.searchRow}> <TextInput autoCapitalize="none" autoCorrect={false} clearButtonMode="always" placeholder="Please input your name..." style={styles.searchTextInput} /> </View> ); }}class SampleApp extends React.Component { render() { return ( <React.NavigatorIOS style={styles.container} initialRoute={{ title: 'My App', component: SearchBar, }}/> ); }}var styles = React.StyleSheet.create({ container: { flex: 1 }, searchRow: { backgroundColor: '#eeeeee', paddingTop: 75, paddingLeft: 10, paddingRight: 10, paddingBottom: 10, }, searchTextInput: { backgroundColor: 'white', borderColor: '#cccccc', borderRadius: 3, borderWidth: 1, height: 30, paddingLeft: 8, },});React.AppRegistry.registerComponent('SampleApp', function() { return SampleApp });