bluejoyq

add searchBar

1 { 1 {
2 "devToolsPort": 19002, 2 "devToolsPort": 19002,
3 "expoServerPort": 19000, 3 "expoServerPort": 19000,
4 - "packagerPort": 19001, 4 + "packagerPort": null,
5 - "packagerPid": 25640, 5 + "packagerPid": null,
6 "expoServerNgrokUrl": "https://ep-ukj.anonymous.searchguide.exp.direct", 6 "expoServerNgrokUrl": "https://ep-ukj.anonymous.searchguide.exp.direct",
7 "packagerNgrokUrl": "https://packager.ep-ukj.anonymous.searchguide.exp.direct", 7 "packagerNgrokUrl": "https://packager.ep-ukj.anonymous.searchguide.exp.direct",
8 - "ngrokPid": 23544 8 + "ngrokPid": 28468
9 } 9 }
......
1 import React from 'react'; 1 import React from 'react';
2 import AppContainer from './components/AppContainer/AppContainer'; 2 import AppContainer from './components/AppContainer/AppContainer';
3 - 3 +import SafeAreaView from 'react-native-safe-area-view';
4 +import SearchBar from './components/SearchBar/SearchBar';
4 5
5 export default class App extends React.Component { 6 export default class App extends React.Component {
6 constructor(props){ 7 constructor(props){
...@@ -11,7 +12,12 @@ export default class App extends React.Component { ...@@ -11,7 +12,12 @@ export default class App extends React.Component {
11 } 12 }
12 render(){ 13 render(){
13 return ( 14 return (
14 - <AppContainer ></AppContainer> 15 + <>
16 + <SearchBar />
17 + <SafeAreaView style={{flex: 1, backgroundColor:'#eee'}}>
18 + <AppContainer />
19 + </SafeAreaView>
20 + </>
15 ) 21 )
16 } 22 }
17 } 23 }
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -4,6 +4,9 @@ ...@@ -4,6 +4,9 @@
4 "slug": "searchGuide", 4 "slug": "searchGuide",
5 "privacy": "public", 5 "privacy": "public",
6 "sdkVersion": "35.0.0", 6 "sdkVersion": "35.0.0",
7 + "androidStatusBar": {
8 + "backgroundColor": "#226557"
9 + },
7 "platforms": [ 10 "platforms": [
8 "ios", 11 "ios",
9 "android", 12 "android",
......
1 import React from 'react'; 1 import React from 'react';
2 import {createAppContainer} from 'react-navigation'; 2 import {createAppContainer} from 'react-navigation';
3 import {createMaterialTopTabNavigator} from 'react-navigation-tabs'; 3 import {createMaterialTopTabNavigator} from 'react-navigation-tabs';
4 -import { StatusBar } from 'react-native';
5 import Home from '../Home/Home'; 4 import Home from '../Home/Home';
6 import Rate from '../Rate/Rate'; 5 import Rate from '../Rate/Rate';
7 6
......
...@@ -12,7 +12,7 @@ class Rate extends React.Component { ...@@ -12,7 +12,7 @@ class Rate extends React.Component {
12 12
13 static navigationOptions={ 13 static navigationOptions={
14 title:'평가', 14 title:'평가',
15 - tabBarIcon: ({tintColor})=> (<Icon name="bar-chart-o" color={tintColor} style={{marginLeft:1}} size={20} />), 15 + tabBarIcon: ({tintColor})=> (<Icon name="bar-chart-o" color={tintColor} style={{marginLeft:0.5}} size={20} />),
16 } 16 }
17 17
18 render() { 18 render() {
......
1 +import React from 'react';
2 +import {View} from 'react-native';
3 +import { Searchbar } from 'react-native-paper';
4 +import Icon from 'react-native-vector-icons/FontAwesome';
5 +
6 +export default class SearchBar extends React.Component {
7 + state = {
8 + firstQuery: '',
9 + };
10 +
11 + render(){
12 + return(
13 + <View style={{flexDirection: 'row'}}>
14 + <Searchbar style={{flex: 0.9}}
15 + placeholder="검색할 질문을 입력하세요."
16 + onChangeText={query => { this.setState({ firstQuery: query }); }}
17 + value={this.state.firstQuery}
18 + />
19 + <View style={{flex:0.15,flexDirection: 'column', justifycontent:'center', alignItems:'center' }} >
20 + <Icon name="bar-chart-o" size={30} />
21 + </View>
22 + </View>
23 + )
24 + }
25 +}
...\ No newline at end of file ...\ No newline at end of file
...@@ -5566,6 +5566,11 @@ ...@@ -5566,6 +5566,11 @@
5566 "resolved": "https://registry.npmjs.org/react-native-view-shot/-/react-native-view-shot-2.6.0.tgz", 5566 "resolved": "https://registry.npmjs.org/react-native-view-shot/-/react-native-view-shot-2.6.0.tgz",
5567 "integrity": "sha512-yO9vWi/11m2hEJl8FrW1SMeVzFfPtMKh20MUInGqlsL0H8Ya2JGGlFfrBzx1KiFR2hFb5OdsTLYNtcVZtJ6pLQ==" 5567 "integrity": "sha512-yO9vWi/11m2hEJl8FrW1SMeVzFfPtMKh20MUInGqlsL0H8Ya2JGGlFfrBzx1KiFR2hFb5OdsTLYNtcVZtJ6pLQ=="
5568 }, 5568 },
5569 + "react-native-voice": {
5570 + "version": "0.3.0",
5571 + "resolved": "https://registry.npmjs.org/react-native-voice/-/react-native-voice-0.3.0.tgz",
5572 + "integrity": "sha512-puSrXCNn1MM03UZkY8q+GW931OqBCEBCiupNK4vD8i49esGqRDDmzv8sRYyEgXj5ScVDKe6lnlKCmJSn5Wo2UA=="
5573 + },
5569 "react-native-web": { 5574 "react-native-web": {
5570 "version": "0.11.7", 5575 "version": "0.11.7",
5571 "resolved": "https://registry.npmjs.org/react-native-web/-/react-native-web-0.11.7.tgz", 5576 "resolved": "https://registry.npmjs.org/react-native-web/-/react-native-web-0.11.7.tgz",
......
...@@ -17,6 +17,7 @@ ...@@ -17,6 +17,7 @@
17 "react-native-navigation": "^3.6.0", 17 "react-native-navigation": "^3.6.0",
18 "react-native-paper": "^3.2.1", 18 "react-native-paper": "^3.2.1",
19 "react-native-reanimated": "^1.4.0", 19 "react-native-reanimated": "^1.4.0",
20 + "react-native-voice": "^0.3.0",
20 "react-native-web": "^0.11.7", 21 "react-native-web": "^0.11.7",
21 "react-navigation": "^4.0.10", 22 "react-navigation": "^4.0.10",
22 "react-navigation-material-bottom-tabs": "^2.1.5", 23 "react-navigation-material-bottom-tabs": "^2.1.5",
......