add custom drawer content to navigate to the topmost item in nested stacks
This commit is contained in:
parent
8b3a0d22be
commit
c892b51ff8
5 changed files with 48 additions and 1 deletions
|
@ -2,6 +2,7 @@ import React from 'react';
|
|||
import AboutPage from 'page/about';
|
||||
import DiscoverPage from 'page/discover';
|
||||
import DownloadsPage from 'page/downloads';
|
||||
import DrawerContent from 'component/drawerContent';
|
||||
import FilePage from 'page/file';
|
||||
import FirstRunScreen from 'page/firstRun';
|
||||
import RewardsPage from 'page/rewards';
|
||||
|
@ -13,7 +14,6 @@ import SubscriptionsPage from 'page/subscriptions';
|
|||
import TransactionHistoryPage from 'page/transactionHistory';
|
||||
import VerificationScreen from 'page/verification';
|
||||
import WalletPage from 'page/wallet';
|
||||
import SearchInput from 'component/searchInput';
|
||||
import {
|
||||
createDrawerNavigator,
|
||||
createStackNavigator,
|
||||
|
@ -150,6 +150,7 @@ const drawer = createDrawerNavigator({
|
|||
}, {
|
||||
drawerWidth: 300,
|
||||
headerMode: 'none',
|
||||
contentComponent: DrawerContent,
|
||||
contentOptions: {
|
||||
activeTintColor: Colors.LbryGreen,
|
||||
labelStyle: discoverStyle.menuText
|
||||
|
|
4
app/src/component/drawerContent/index.js
Normal file
4
app/src/component/drawerContent/index.js
Normal file
|
@ -0,0 +1,4 @@
|
|||
import { connect } from 'react-redux';
|
||||
import DrawerContent from './view';
|
||||
|
||||
export default connect()(DrawerContent);
|
38
app/src/component/drawerContent/view.js
Normal file
38
app/src/component/drawerContent/view.js
Normal file
|
@ -0,0 +1,38 @@
|
|||
import React from 'react';
|
||||
import { DrawerItems, SafeAreaView } from 'react-navigation';
|
||||
import { ScrollView } from 'react-native';
|
||||
import Constants from 'constants';
|
||||
import discoverStyle from 'styles/discover';
|
||||
|
||||
class DrawerContent extends React.PureComponent {
|
||||
render() {
|
||||
const props = this.props;
|
||||
const { navigation, onItemPress } = props;
|
||||
|
||||
return (
|
||||
<ScrollView>
|
||||
<SafeAreaView style={discoverStyle.drawerContentContainer} forceInset={{ top: 'always', horizontal: 'never' }}>
|
||||
<DrawerItems
|
||||
{...props}
|
||||
onItemPress={(route) => {
|
||||
const { routeName } = route.route;
|
||||
if (Constants.FULL_ROUTE_NAME_DISCOVER === routeName) {
|
||||
navigation.navigate({ routeName: Constants.DRAWER_ROUTE_DISCOVER });
|
||||
return;
|
||||
}
|
||||
|
||||
if (Constants.FULL_ROUTE_NAME_WALLET === routeName) {
|
||||
navigation.navigate({ routeName: Constants.DRAWER_ROUTE_WALLET });
|
||||
return;
|
||||
}
|
||||
|
||||
onItemPress(route);
|
||||
}}
|
||||
/>
|
||||
</SafeAreaView>
|
||||
</ScrollView>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default DrawerContent;
|
|
@ -1,5 +1,6 @@
|
|||
import React from 'react';
|
||||
import { View, ScrollView, Text } from 'react-native';
|
||||
import Constants from 'constants';
|
||||
import TransactionList from 'component/transactionList';
|
||||
import UriBar from 'component/uriBar';
|
||||
import walletStyle from 'styles/wallet';
|
||||
|
|
|
@ -20,6 +20,9 @@ const discoverStyle = StyleSheet.create({
|
|||
flex: 1,
|
||||
backgroundColor: Colors.PageBackground
|
||||
},
|
||||
drawerContentContainer: {
|
||||
flex: 1
|
||||
},
|
||||
scrollContainer: {
|
||||
flex: 1,
|
||||
paddingTop: 12,
|
||||
|
|
Loading…
Reference in a new issue