김서영 / searchGuide

Go to a project
Toggle navigation Toggle navigation pinning
bluejoyq
def035d1 1 parent f09fbde5

add bottom tab nav bar

Inline Side-by-side
Showing 8 changed files with 206 additions and 8 deletions
......@@ -2,8 +2,8 @@
"devToolsPort": 19002,
"expoServerPort": 19000,
"packagerPort": 19001,
"packagerPid": 7268,
"packagerPid": 18628,
"expoServerNgrokUrl": "https://ep-ukj.anonymous.searchguide.exp.direct",
"packagerNgrokUrl": "https://packager.ep-ukj.anonymous.searchguide.exp.direct",
"ngrokPid": 29132
"ngrokPid": 25796
}
......
import React from 'react';
import { View, Text} from 'react-native';
import Home from './components/Home/Home';
import AppContainer from './components/AppContainer/AppContainer';
export default class App extends React.Component {
constructor(props){
super(props);
this.state = {
};
}
render(){
return (
<Home>
<Text></Text>
</Home>
<AppContainer ></AppContainer>
)
}
}
\ No newline at end of file
......
......@@ -2,5 +2,10 @@ module.exports = function(api) {
api.cache(true);
return {
presets: ['babel-preset-expo'],
env: {
production: {
plugins: ['react-native-paper/babel'],
},
},
};
};
......
import React from 'react';
import { BottomNavigation, Text } from 'react-native-paper';
import { StatusBar } from 'react-native';
import Home from '../Home/Home';
import Rate from '../Rate/Rate';
const HomeScreen = () => <Home />;
const RateScreen = () => <Rate />;
export default class AppContainer extends React.Component {
constructor(props){
super(props);
this.state = {
index: 0,
routes: [
{ key: 'home', title: '검색', icon: 'magnify' },
{ key: 'rate', title: '평가', icon: 'chart-line' },
],
};
}
_handleIndexChange = index => this.setState({ index });
_renderScene = BottomNavigation.SceneMap({
home: HomeScreen,
rate: RateScreen,
});
render() {
return (
<BottomNavigation style={{marginTop : StatusBar.currentHeight }}
navigationState={this.state}
onIndexChange={this._handleIndexChange}
renderScene={this._renderScene}
/>
);
}
}
\ No newline at end of file
......@@ -12,7 +12,7 @@ export default class Home extends React.Component {
render() {
return(
<View>
<Text>hi</Text>
<Text>검색</Text>
</View>
)
}
......
import React from 'react';
import { View, Text} from 'react-native';
export default class Rate extends React.Component {
constructor(props) {
super(props);
this.state = {
}
}
render() {
return(
<View>
<Text>평가</Text>
</View>
)
}
}
\ No newline at end of file
......
......@@ -946,6 +946,15 @@
"to-fast-properties": "^2.0.0"
}
},
"@callstack/react-theme-provider": {
"version": "3.0.5",
"resolved": "https://registry.npmjs.org/@callstack/react-theme-provider/-/react-theme-provider-3.0.5.tgz",
"integrity": "sha512-Iec+ybWN0FvNj87sD3oWo/49edGUP0UOSdMnzCJEFJIDYr992ECIuOV89burAAh2/ibPCxgLiK6dmgv2mO/8Tg==",
"requires": {
"deepmerge": "^3.2.0",
"hoist-non-react-statics": "^3.3.0"
}
},
"@expo/vector-icons": {
"version": "10.0.6",
"resolved": "https://registry.npmjs.org/@expo/vector-icons/-/vector-icons-10.0.6.tgz",
......@@ -1964,6 +1973,15 @@
"object-visit": "^1.0.0"
}
},
"color": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/color/-/color-3.1.2.tgz",
"integrity": "sha512-vXTJhHebByxZn3lDvDJYw4lR5+uB3vuoHsuYA5AKuxRVn5wzzIfQKGLBmgdVRHKTJYeK5rvJcHnrd0Li49CFpg==",
"requires": {
"color-convert": "^1.9.1",
"color-string": "^1.5.2"
}
},
"color-convert": {
"version": "1.9.3",
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
......@@ -1977,6 +1995,15 @@
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
"integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
},
"color-string": {
"version": "1.5.3",
"resolved": "https://registry.npmjs.org/color-string/-/color-string-1.5.3.tgz",
"integrity": "sha512-dC2C5qeWoYkxki5UAXapdjqO672AM4vZuPGRQfO8b5HKuKGBbKWpITyDYN7TOFKvRW7kOgAn3746clDBMDJyQw==",
"requires": {
"color-name": "^1.0.0",
"simple-swizzle": "^0.2.2"
}
},
"color-support": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/color-support/-/color-support-1.1.3.tgz",
......@@ -2200,6 +2227,11 @@
"is-obj": "^1.0.0"
}
},
"deepmerge": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-3.3.0.tgz",
"integrity": "sha512-GRQOafGHwMHpjPx9iCvTgpu9NojZ49q794EEL94JVEw6VaeA8XTUyBKvAkOOjBX9oJNiV6G3P+T+tihFjo2TqA=="
},
"define-properties": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.3.tgz",
......@@ -3365,6 +3397,11 @@
"resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
"integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE="
},
"hammerjs": {
"version": "2.0.8",
"resolved": "https://registry.npmjs.org/hammerjs/-/hammerjs-2.0.8.tgz",
"integrity": "sha1-BO93hiz/K7edMPdpIJWTAiK/YPE="
},
"has-ansi": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
......@@ -3449,6 +3486,14 @@
}
}
},
"hoist-non-react-statics": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.0.tgz",
"integrity": "sha512-0XsbTXxgiaCDYDIWFcwkmerZPSwywfUqYmwT4jzewKTQSWoE6FCMoUVOeBJWK3E/CrWbxRG3m5GzY4lnIwGRBA==",
"requires": {
"react-is": "^16.7.0"
}
},
"hosted-git-info": {
"version": "2.8.5",
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.5.tgz",
......@@ -5256,6 +5301,11 @@
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.11.0.tgz",
"integrity": "sha512-gbBVYR2p8mnriqAwWx9LbuUrShnAuSCNnuPGyc7GJrMVQtPDAh8iLpv7FRuMPFb56KkaVZIYSz1PrjI9q0QPCw=="
},
"react-lifecycles-compat": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-2.0.0.tgz",
"integrity": "sha512-txfpPCQYiazVdcbMRhatqWKcAxJweUu2wDXvts5/7Wyp6+Y9cHojqXHsLPEckzutfHlxZhG8Oiundbmp8Fd6eQ=="
},
"react-native": {
"version": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz",
"integrity": "sha512-KBH8PlT3K3yTYW/u2E1KKTAaVq2WjYAqZTOgXyosSLwg/TVpG6JbHyTG4a24f5tI2GEqarRLufsggF4CkB7KUw==",
......@@ -5376,6 +5426,61 @@
"resolved": "https://registry.npmjs.org/react-native-branch/-/react-native-branch-3.0.1.tgz",
"integrity": "sha512-vbcYxPZlpF5f39GAEUF8kuGQqCNeD3E6zEdvtOq8oCGZunHXlWlKgAS6dgBKCvsHvXgHuMtpvs39VgOp8DaKig=="
},
"react-native-gesture-handler": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-1.5.0.tgz",
"integrity": "sha512-YUOXHsGLajK1cFReQ4Xh0H9GUTxDW9cUZEVu1q+dVqur2urSKi63KklAFB2l8Neob9nl1E/w0c5hGcBP9FMCIA==",
"requires": {
"hammerjs": "^2.0.8",
"hoist-non-react-statics": "^2.3.1",
"invariant": "^2.2.4",
"prop-types": "^15.7.2"
},
"dependencies": {
"hoist-non-react-statics": {
"version": "2.5.5",
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
"integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
}
}
},
"react-native-navigation": {
"version": "3.6.0",
"resolved": "https://registry.npmjs.org/react-native-navigation/-/react-native-navigation-3.6.0.tgz",
"integrity": "sha512-ZVlN86gTrCFKIvnnN5/+eBT3DNrmPo0mUdzWvXHLbLixhpAbrhkybpfiC72KUrsitQBIeiqP/R2XYYAt4L6NuA==",
"requires": {
"hoist-non-react-statics": "3.x.x",
"lodash": "4.17.x",
"prop-types": "15.x.x",
"react-lifecycles-compat": "2.0.0",
"tslib": "1.9.3"
}
},
"react-native-paper": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/react-native-paper/-/react-native-paper-3.2.1.tgz",
"integrity": "sha512-PpdKW/NQd/dLeeo17+uC82sF2g236dp4ksJ6L11fUXikGaOQaIiIojHxpWxHHVrXya6ZwXXbHGuyOHY3+XNzfw==",
"requires": {
"@callstack/react-theme-provider": "^3.0.5",
"color": "^3.1.2",
"react-native-safe-area-view": "^0.12.0"
}
},
"react-native-safe-area-view": {
"version": "0.12.0",
"resolved": "https://registry.npmjs.org/react-native-safe-area-view/-/react-native-safe-area-view-0.12.0.tgz",
"integrity": "sha512-UrAXmBC4KNR5K2eczIDZgqceWyKsgG9gmWFerHCvoyApfei8ceBB9u/c//PWCpS5Gt8MRLTmX5jPtzdXo2yNqg==",
"requires": {
"hoist-non-react-statics": "^2.3.1"
},
"dependencies": {
"hoist-non-react-statics": {
"version": "2.5.5",
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
"integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
}
}
},
"react-native-view-shot": {
"version": "2.6.0",
"resolved": "https://registry.npmjs.org/react-native-view-shot/-/react-native-view-shot-2.6.0.tgz",
......@@ -5420,6 +5525,11 @@
}
}
},
"react-navigation-material-bottom-tabs": {
"version": "2.1.5",
"resolved": "https://registry.npmjs.org/react-navigation-material-bottom-tabs/-/react-navigation-material-bottom-tabs-2.1.5.tgz",
"integrity": "sha512-MGoVI63ekaU6MxL2FLF9q7n0R9dSGaMzp5PGE4PQCHB3XgN9zAL+gPOWNQFivhqSXHx45sL0oPuxnNOGt9IU3Q=="
},
"react-proxy": {
"version": "1.1.8",
"resolved": "https://registry.npmjs.org/react-proxy/-/react-proxy-1.1.8.tgz",
......@@ -6108,6 +6218,21 @@
"plist": "^3.0.1"
}
},
"simple-swizzle": {
"version": "0.2.2",
"resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz",
"integrity": "sha1-pNprY1/8zMoz9w0Xy5JZLeleVXo=",
"requires": {
"is-arrayish": "^0.3.1"
},
"dependencies": {
"is-arrayish": {
"version": "0.3.2",
"resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz",
"integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ=="
}
}
},
"slash": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz",
......@@ -6507,6 +6632,11 @@
"resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz",
"integrity": "sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw=="
},
"tslib": {
"version": "1.9.3",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.9.3.tgz",
"integrity": "sha512-4krF8scpejhaOgqzBEcGM7yDIEfi0/8+8zDRZhNZZ2kjmHJ4hv3zCbQWxoJGz1iw5U0Jl0nma13xzHXcncMavQ=="
},
"typedarray": {
"version": "0.0.6",
"resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
......
......@@ -12,7 +12,11 @@
"react": "16.8.3",
"react-dom": "16.8.3",
"react-native": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz",
"react-native-web": "^0.11.7"
"react-native-gesture-handler": "^1.5.0",
"react-native-navigation": "^3.6.0",
"react-native-paper": "^3.2.1",
"react-native-web": "^0.11.7",
"react-navigation-material-bottom-tabs": "^2.1.5"
},
"devDependencies": {
"babel-preset-expo": "^7.1.0"
......