diff options
| author | Leon Jiang <35908040+leonyjiang@users.noreply.github.com> | 2020-08-05 14:15:06 -0700 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2020-08-05 17:15:06 -0400 |
| commit | 1279249ee9355f88913578f51e3b0bf7d99672f6 (patch) | |
| tree | 4a72890af331ffc818fffc9fb5395a80efe2d7de /src/routes/tabs | |
| parent | f9cf9b5d89d5e25b227814f0fc759257564cea89 (diff) | |
[TMA-122] User Profile Screen UI (#27)
* Fix yarn lint issues
* Add react-native-svg to project
* Create UserType & PostType
* Create temporary Post component
* Fix import cycle warning, update AuthContext
* Update onboarding screen imports
* Update config files
* Add rn-fetch-blob package
* Update types
* Add profile fetching to AuthContext
* Update post component
* Import placeholder images from designs
* Add profile UI components
* Create screen offset constants
* Add new api endpoints
* Create screen layout utils
* Create Profile screen UI
* Remove some unused styling
* Restructure ProfileScreen and fix animations
* Add gradient back to screen
* Update Moment circle styling
Diffstat (limited to 'src/routes/tabs')
| -rw-r--r-- | src/routes/tabs/NavigationBar.tsx | 73 | ||||
| -rw-r--r-- | src/routes/tabs/index.ts | 1 |
2 files changed, 74 insertions, 0 deletions
diff --git a/src/routes/tabs/NavigationBar.tsx b/src/routes/tabs/NavigationBar.tsx new file mode 100644 index 00000000..aca968c2 --- /dev/null +++ b/src/routes/tabs/NavigationBar.tsx @@ -0,0 +1,73 @@ +import React from 'react'; +import {createBottomTabNavigator} from '@react-navigation/bottom-tabs'; +import {NavigationIcon} from '../../components'; +import { + ProfileScreen, + Home, + Notifications, + Search, + Upload, +} from '../../screens'; + +const Tabs = createBottomTabNavigator(); + +const NavigationBar: React.FC = () => { + return ( + <Tabs.Navigator + screenOptions={({route}) => ({ + tabBarIcon: ({focused}) => { + if (route.name === 'Home') { + return focused ? ( + <NavigationIcon tab="Home" disabled={false} /> + ) : ( + <NavigationIcon tab="Home" disabled={true} /> + ); + } else if (route.name === 'Search') { + return focused ? ( + <NavigationIcon tab="Search" disabled={false} /> + ) : ( + <NavigationIcon tab="Search" disabled={true} /> + ); + } else if (route.name === 'Upload') { + return focused ? ( + <NavigationIcon tab="Upload" disabled={false} /> + ) : ( + <NavigationIcon tab="Upload" disabled={true} /> + ); + } else if (route.name === 'Notifications') { + return focused ? ( + <NavigationIcon tab="Notifications" disabled={false} /> + ) : ( + <NavigationIcon tab="Notifications" disabled={true} /> + ); + } else if (route.name === 'Profile') { + return focused ? ( + <NavigationIcon tab="Profile" disabled={false} /> + ) : ( + <NavigationIcon tab="Profile" disabled={true} /> + ); + } + }, + })} + initialRouteName="Profile" + tabBarOptions={{ + showLabel: false, + style: { + backgroundColor: 'transparent', + position: 'absolute', + borderTopWidth: 0, + left: 0, + right: 0, + bottom: 0, + }, + }}> + <Tabs.Screen name="Home" component={Home} /> + <Tabs.Screen name="Search" component={Search} /> + <Tabs.Screen name="Upload" component={Upload} /> + <Tabs.Screen name="Notifications" component={Notifications} /> + <Tabs.Screen name="Profile" component={ProfileScreen} /> + </Tabs.Navigator> + ); +}; + +export default NavigationBar; diff --git a/src/routes/tabs/index.ts b/src/routes/tabs/index.ts new file mode 100644 index 00000000..8ea77e8f --- /dev/null +++ b/src/routes/tabs/index.ts @@ -0,0 +1 @@ +export {default} from './NavigationBar'; |
