bluejoyq

add bottom tab nav bar

...@@ -2,8 +2,8 @@ ...@@ -2,8 +2,8 @@
2 "devToolsPort": 19002, 2 "devToolsPort": 19002,
3 "expoServerPort": 19000, 3 "expoServerPort": 19000,
4 "packagerPort": 19001, 4 "packagerPort": 19001,
5 - "packagerPid": 7268, 5 + "packagerPid": 18628,
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": 29132 8 + "ngrokPid": 25796
9 } 9 }
......
1 import React from 'react'; 1 import React from 'react';
2 import { View, Text} from 'react-native'; 2 import { View, Text} from 'react-native';
3 import Home from './components/Home/Home'; 3 import Home from './components/Home/Home';
4 +import AppContainer from './components/AppContainer/AppContainer';
5 +
4 6
5 export default class App extends React.Component { 7 export default class App extends React.Component {
6 constructor(props){ 8 constructor(props){
7 super(props); 9 super(props);
8 this.state = { 10 this.state = {
9 - 11 +
10 }; 12 };
11 } 13 }
12 render(){ 14 render(){
13 return ( 15 return (
14 - <Home> 16 + <AppContainer ></AppContainer>
15 - <Text></Text>
16 - </Home>
17 ) 17 )
18 } 18 }
19 } 19 }
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -2,5 +2,10 @@ module.exports = function(api) { ...@@ -2,5 +2,10 @@ module.exports = function(api) {
2 api.cache(true); 2 api.cache(true);
3 return { 3 return {
4 presets: ['babel-preset-expo'], 4 presets: ['babel-preset-expo'],
5 + env: {
6 + production: {
7 + plugins: ['react-native-paper/babel'],
8 + },
9 + },
5 }; 10 };
6 }; 11 };
......
1 +import React from 'react';
2 +import { BottomNavigation, Text } from 'react-native-paper';
3 +import { StatusBar } from 'react-native';
4 +import Home from '../Home/Home';
5 +import Rate from '../Rate/Rate';
6 +
7 +const HomeScreen = () => <Home />;
8 +const RateScreen = () => <Rate />;
9 +
10 +export default class AppContainer extends React.Component {
11 + constructor(props){
12 + super(props);
13 + this.state = {
14 + index: 0,
15 + routes: [
16 + { key: 'home', title: '검색', icon: 'magnify' },
17 + { key: 'rate', title: '평가', icon: 'chart-line' },
18 + ],
19 + };
20 + }
21 +
22 +
23 + _handleIndexChange = index => this.setState({ index });
24 +
25 + _renderScene = BottomNavigation.SceneMap({
26 + home: HomeScreen,
27 + rate: RateScreen,
28 + });
29 +
30 + render() {
31 + return (
32 + <BottomNavigation style={{marginTop : StatusBar.currentHeight }}
33 + navigationState={this.state}
34 + onIndexChange={this._handleIndexChange}
35 + renderScene={this._renderScene}
36 + />
37 + );
38 + }
39 +}
...\ No newline at end of file ...\ No newline at end of file
...@@ -12,7 +12,7 @@ export default class Home extends React.Component { ...@@ -12,7 +12,7 @@ export default class Home extends React.Component {
12 render() { 12 render() {
13 return( 13 return(
14 <View> 14 <View>
15 - <Text>hi</Text> 15 + <Text>검색</Text>
16 </View> 16 </View>
17 ) 17 )
18 } 18 }
......
1 +import React from 'react';
2 +import { View, Text} from 'react-native';
3 +
4 +export default class Rate extends React.Component {
5 + constructor(props) {
6 + super(props);
7 + this.state = {
8 +
9 + }
10 + }
11 +
12 + render() {
13 + return(
14 + <View>
15 + <Text>평가</Text>
16 + </View>
17 + )
18 + }
19 +
20 +}
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -946,6 +946,15 @@ ...@@ -946,6 +946,15 @@
946 "to-fast-properties": "^2.0.0" 946 "to-fast-properties": "^2.0.0"
947 } 947 }
948 }, 948 },
949 + "@callstack/react-theme-provider": {
950 + "version": "3.0.5",
951 + "resolved": "https://registry.npmjs.org/@callstack/react-theme-provider/-/react-theme-provider-3.0.5.tgz",
952 + "integrity": "sha512-Iec+ybWN0FvNj87sD3oWo/49edGUP0UOSdMnzCJEFJIDYr992ECIuOV89burAAh2/ibPCxgLiK6dmgv2mO/8Tg==",
953 + "requires": {
954 + "deepmerge": "^3.2.0",
955 + "hoist-non-react-statics": "^3.3.0"
956 + }
957 + },
949 "@expo/vector-icons": { 958 "@expo/vector-icons": {
950 "version": "10.0.6", 959 "version": "10.0.6",
951 "resolved": "https://registry.npmjs.org/@expo/vector-icons/-/vector-icons-10.0.6.tgz", 960 "resolved": "https://registry.npmjs.org/@expo/vector-icons/-/vector-icons-10.0.6.tgz",
...@@ -1964,6 +1973,15 @@ ...@@ -1964,6 +1973,15 @@
1964 "object-visit": "^1.0.0" 1973 "object-visit": "^1.0.0"
1965 } 1974 }
1966 }, 1975 },
1976 + "color": {
1977 + "version": "3.1.2",
1978 + "resolved": "https://registry.npmjs.org/color/-/color-3.1.2.tgz",
1979 + "integrity": "sha512-vXTJhHebByxZn3lDvDJYw4lR5+uB3vuoHsuYA5AKuxRVn5wzzIfQKGLBmgdVRHKTJYeK5rvJcHnrd0Li49CFpg==",
1980 + "requires": {
1981 + "color-convert": "^1.9.1",
1982 + "color-string": "^1.5.2"
1983 + }
1984 + },
1967 "color-convert": { 1985 "color-convert": {
1968 "version": "1.9.3", 1986 "version": "1.9.3",
1969 "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz", 1987 "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
...@@ -1977,6 +1995,15 @@ ...@@ -1977,6 +1995,15 @@
1977 "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz", 1995 "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
1978 "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=" 1996 "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
1979 }, 1997 },
1998 + "color-string": {
1999 + "version": "1.5.3",
2000 + "resolved": "https://registry.npmjs.org/color-string/-/color-string-1.5.3.tgz",
2001 + "integrity": "sha512-dC2C5qeWoYkxki5UAXapdjqO672AM4vZuPGRQfO8b5HKuKGBbKWpITyDYN7TOFKvRW7kOgAn3746clDBMDJyQw==",
2002 + "requires": {
2003 + "color-name": "^1.0.0",
2004 + "simple-swizzle": "^0.2.2"
2005 + }
2006 + },
1980 "color-support": { 2007 "color-support": {
1981 "version": "1.1.3", 2008 "version": "1.1.3",
1982 "resolved": "https://registry.npmjs.org/color-support/-/color-support-1.1.3.tgz", 2009 "resolved": "https://registry.npmjs.org/color-support/-/color-support-1.1.3.tgz",
...@@ -2200,6 +2227,11 @@ ...@@ -2200,6 +2227,11 @@
2200 "is-obj": "^1.0.0" 2227 "is-obj": "^1.0.0"
2201 } 2228 }
2202 }, 2229 },
2230 + "deepmerge": {
2231 + "version": "3.3.0",
2232 + "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-3.3.0.tgz",
2233 + "integrity": "sha512-GRQOafGHwMHpjPx9iCvTgpu9NojZ49q794EEL94JVEw6VaeA8XTUyBKvAkOOjBX9oJNiV6G3P+T+tihFjo2TqA=="
2234 + },
2203 "define-properties": { 2235 "define-properties": {
2204 "version": "1.1.3", 2236 "version": "1.1.3",
2205 "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.3.tgz", 2237 "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.3.tgz",
...@@ -3365,6 +3397,11 @@ ...@@ -3365,6 +3397,11 @@
3365 "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz", 3397 "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
3366 "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE=" 3398 "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE="
3367 }, 3399 },
3400 + "hammerjs": {
3401 + "version": "2.0.8",
3402 + "resolved": "https://registry.npmjs.org/hammerjs/-/hammerjs-2.0.8.tgz",
3403 + "integrity": "sha1-BO93hiz/K7edMPdpIJWTAiK/YPE="
3404 + },
3368 "has-ansi": { 3405 "has-ansi": {
3369 "version": "2.0.0", 3406 "version": "2.0.0",
3370 "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz", 3407 "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
...@@ -3449,6 +3486,14 @@ ...@@ -3449,6 +3486,14 @@
3449 } 3486 }
3450 } 3487 }
3451 }, 3488 },
3489 + "hoist-non-react-statics": {
3490 + "version": "3.3.0",
3491 + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.0.tgz",
3492 + "integrity": "sha512-0XsbTXxgiaCDYDIWFcwkmerZPSwywfUqYmwT4jzewKTQSWoE6FCMoUVOeBJWK3E/CrWbxRG3m5GzY4lnIwGRBA==",
3493 + "requires": {
3494 + "react-is": "^16.7.0"
3495 + }
3496 + },
3452 "hosted-git-info": { 3497 "hosted-git-info": {
3453 "version": "2.8.5", 3498 "version": "2.8.5",
3454 "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.5.tgz", 3499 "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.5.tgz",
...@@ -5256,6 +5301,11 @@ ...@@ -5256,6 +5301,11 @@
5256 "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.11.0.tgz", 5301 "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.11.0.tgz",
5257 "integrity": "sha512-gbBVYR2p8mnriqAwWx9LbuUrShnAuSCNnuPGyc7GJrMVQtPDAh8iLpv7FRuMPFb56KkaVZIYSz1PrjI9q0QPCw==" 5302 "integrity": "sha512-gbBVYR2p8mnriqAwWx9LbuUrShnAuSCNnuPGyc7GJrMVQtPDAh8iLpv7FRuMPFb56KkaVZIYSz1PrjI9q0QPCw=="
5258 }, 5303 },
5304 + "react-lifecycles-compat": {
5305 + "version": "2.0.0",
5306 + "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-2.0.0.tgz",
5307 + "integrity": "sha512-txfpPCQYiazVdcbMRhatqWKcAxJweUu2wDXvts5/7Wyp6+Y9cHojqXHsLPEckzutfHlxZhG8Oiundbmp8Fd6eQ=="
5308 + },
5259 "react-native": { 5309 "react-native": {
5260 "version": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz", 5310 "version": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz",
5261 "integrity": "sha512-KBH8PlT3K3yTYW/u2E1KKTAaVq2WjYAqZTOgXyosSLwg/TVpG6JbHyTG4a24f5tI2GEqarRLufsggF4CkB7KUw==", 5311 "integrity": "sha512-KBH8PlT3K3yTYW/u2E1KKTAaVq2WjYAqZTOgXyosSLwg/TVpG6JbHyTG4a24f5tI2GEqarRLufsggF4CkB7KUw==",
...@@ -5376,6 +5426,61 @@ ...@@ -5376,6 +5426,61 @@
5376 "resolved": "https://registry.npmjs.org/react-native-branch/-/react-native-branch-3.0.1.tgz", 5426 "resolved": "https://registry.npmjs.org/react-native-branch/-/react-native-branch-3.0.1.tgz",
5377 "integrity": "sha512-vbcYxPZlpF5f39GAEUF8kuGQqCNeD3E6zEdvtOq8oCGZunHXlWlKgAS6dgBKCvsHvXgHuMtpvs39VgOp8DaKig==" 5427 "integrity": "sha512-vbcYxPZlpF5f39GAEUF8kuGQqCNeD3E6zEdvtOq8oCGZunHXlWlKgAS6dgBKCvsHvXgHuMtpvs39VgOp8DaKig=="
5378 }, 5428 },
5429 + "react-native-gesture-handler": {
5430 + "version": "1.5.0",
5431 + "resolved": "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-1.5.0.tgz",
5432 + "integrity": "sha512-YUOXHsGLajK1cFReQ4Xh0H9GUTxDW9cUZEVu1q+dVqur2urSKi63KklAFB2l8Neob9nl1E/w0c5hGcBP9FMCIA==",
5433 + "requires": {
5434 + "hammerjs": "^2.0.8",
5435 + "hoist-non-react-statics": "^2.3.1",
5436 + "invariant": "^2.2.4",
5437 + "prop-types": "^15.7.2"
5438 + },
5439 + "dependencies": {
5440 + "hoist-non-react-statics": {
5441 + "version": "2.5.5",
5442 + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
5443 + "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
5444 + }
5445 + }
5446 + },
5447 + "react-native-navigation": {
5448 + "version": "3.6.0",
5449 + "resolved": "https://registry.npmjs.org/react-native-navigation/-/react-native-navigation-3.6.0.tgz",
5450 + "integrity": "sha512-ZVlN86gTrCFKIvnnN5/+eBT3DNrmPo0mUdzWvXHLbLixhpAbrhkybpfiC72KUrsitQBIeiqP/R2XYYAt4L6NuA==",
5451 + "requires": {
5452 + "hoist-non-react-statics": "3.x.x",
5453 + "lodash": "4.17.x",
5454 + "prop-types": "15.x.x",
5455 + "react-lifecycles-compat": "2.0.0",
5456 + "tslib": "1.9.3"
5457 + }
5458 + },
5459 + "react-native-paper": {
5460 + "version": "3.2.1",
5461 + "resolved": "https://registry.npmjs.org/react-native-paper/-/react-native-paper-3.2.1.tgz",
5462 + "integrity": "sha512-PpdKW/NQd/dLeeo17+uC82sF2g236dp4ksJ6L11fUXikGaOQaIiIojHxpWxHHVrXya6ZwXXbHGuyOHY3+XNzfw==",
5463 + "requires": {
5464 + "@callstack/react-theme-provider": "^3.0.5",
5465 + "color": "^3.1.2",
5466 + "react-native-safe-area-view": "^0.12.0"
5467 + }
5468 + },
5469 + "react-native-safe-area-view": {
5470 + "version": "0.12.0",
5471 + "resolved": "https://registry.npmjs.org/react-native-safe-area-view/-/react-native-safe-area-view-0.12.0.tgz",
5472 + "integrity": "sha512-UrAXmBC4KNR5K2eczIDZgqceWyKsgG9gmWFerHCvoyApfei8ceBB9u/c//PWCpS5Gt8MRLTmX5jPtzdXo2yNqg==",
5473 + "requires": {
5474 + "hoist-non-react-statics": "^2.3.1"
5475 + },
5476 + "dependencies": {
5477 + "hoist-non-react-statics": {
5478 + "version": "2.5.5",
5479 + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
5480 + "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
5481 + }
5482 + }
5483 + },
5379 "react-native-view-shot": { 5484 "react-native-view-shot": {
5380 "version": "2.6.0", 5485 "version": "2.6.0",
5381 "resolved": "https://registry.npmjs.org/react-native-view-shot/-/react-native-view-shot-2.6.0.tgz", 5486 "resolved": "https://registry.npmjs.org/react-native-view-shot/-/react-native-view-shot-2.6.0.tgz",
...@@ -5420,6 +5525,11 @@ ...@@ -5420,6 +5525,11 @@
5420 } 5525 }
5421 } 5526 }
5422 }, 5527 },
5528 + "react-navigation-material-bottom-tabs": {
5529 + "version": "2.1.5",
5530 + "resolved": "https://registry.npmjs.org/react-navigation-material-bottom-tabs/-/react-navigation-material-bottom-tabs-2.1.5.tgz",
5531 + "integrity": "sha512-MGoVI63ekaU6MxL2FLF9q7n0R9dSGaMzp5PGE4PQCHB3XgN9zAL+gPOWNQFivhqSXHx45sL0oPuxnNOGt9IU3Q=="
5532 + },
5423 "react-proxy": { 5533 "react-proxy": {
5424 "version": "1.1.8", 5534 "version": "1.1.8",
5425 "resolved": "https://registry.npmjs.org/react-proxy/-/react-proxy-1.1.8.tgz", 5535 "resolved": "https://registry.npmjs.org/react-proxy/-/react-proxy-1.1.8.tgz",
...@@ -6108,6 +6218,21 @@ ...@@ -6108,6 +6218,21 @@
6108 "plist": "^3.0.1" 6218 "plist": "^3.0.1"
6109 } 6219 }
6110 }, 6220 },
6221 + "simple-swizzle": {
6222 + "version": "0.2.2",
6223 + "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz",
6224 + "integrity": "sha1-pNprY1/8zMoz9w0Xy5JZLeleVXo=",
6225 + "requires": {
6226 + "is-arrayish": "^0.3.1"
6227 + },
6228 + "dependencies": {
6229 + "is-arrayish": {
6230 + "version": "0.3.2",
6231 + "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz",
6232 + "integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ=="
6233 + }
6234 + }
6235 + },
6111 "slash": { 6236 "slash": {
6112 "version": "2.0.0", 6237 "version": "2.0.0",
6113 "resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz", 6238 "resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz",
...@@ -6507,6 +6632,11 @@ ...@@ -6507,6 +6632,11 @@
6507 "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz", 6632 "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz",
6508 "integrity": "sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==" 6633 "integrity": "sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw=="
6509 }, 6634 },
6635 + "tslib": {
6636 + "version": "1.9.3",
6637 + "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.9.3.tgz",
6638 + "integrity": "sha512-4krF8scpejhaOgqzBEcGM7yDIEfi0/8+8zDRZhNZZ2kjmHJ4hv3zCbQWxoJGz1iw5U0Jl0nma13xzHXcncMavQ=="
6639 + },
6510 "typedarray": { 6640 "typedarray": {
6511 "version": "0.0.6", 6641 "version": "0.0.6",
6512 "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz", 6642 "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
......
...@@ -12,7 +12,11 @@ ...@@ -12,7 +12,11 @@
12 "react": "16.8.3", 12 "react": "16.8.3",
13 "react-dom": "16.8.3", 13 "react-dom": "16.8.3",
14 "react-native": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz", 14 "react-native": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz",
15 - "react-native-web": "^0.11.7" 15 + "react-native-gesture-handler": "^1.5.0",
16 + "react-native-navigation": "^3.6.0",
17 + "react-native-paper": "^3.2.1",
18 + "react-native-web": "^0.11.7",
19 + "react-navigation-material-bottom-tabs": "^2.1.5"
16 }, 20 },
17 "devDependencies": { 21 "devDependencies": {
18 "babel-preset-expo": "^7.1.0" 22 "babel-preset-expo": "^7.1.0"
......