BlueWallet/SecondaryBottomTabs.js

114 lines
2.8 KiB
JavaScript
Raw Normal View History

2018-01-30 23:42:38 +01:00
/**
* @flow
*/
import React from 'react'
import { Button, ScrollView } from 'react-native'
import { SafeAreaView, StackNavigator, TabNavigator } from 'react-navigation'
import Ionicons from 'react-native-vector-icons/Ionicons'
import SampleText from './SampleText'
const MyNavScreen = ({ navigation, banner }) => (
<ScrollView>
<SafeAreaView forceInset={{ horizontal: 'always' }}>
<SampleText>{banner}</SampleText>
<Button
onPress={() => navigation.navigate('Profile', { name: 'Jordan' })}
title='Open profile screen'
/>
<Button
onPress={() => navigation.navigate('NotifSettings')}
title='Open notifications screen'
/>
<Button
onPress={() => navigation.navigate('SettingsTab')}
title='Go to settings tab'
/>
<Button onPress={() => navigation.goBack(null)} title='Go back' />
</SafeAreaView>
</ScrollView>
)
const MyHomeScreen = ({ navigation }) => (
<MyNavScreen banner='Home Screen' navigation={navigation} />
)
const MyProfileScreen = ({ navigation }) => (
<MyNavScreen
banner={`${navigation.state.params.name}s Profile`}
navigation={navigation}
/>
)
const MyNotificationsSettingsScreen = ({ navigation }) => (
<MyNavScreen banner='Notifications Screen' navigation={navigation} />
)
const MySettingsScreen = ({ navigation }) => (
<MyNavScreen banner='Settings Screen' navigation={navigation} />
)
var bitcoin = require('bitcoinjs-lib')
var myString = bitcoin.ECPair.makeRandom().toWIF()
const TabNav = TabNavigator(
{
MainTab: {
screen: MyHomeScreen,
path: '/',
navigationOptions: {
title: 'Welcome1 ' + myString,
tabBarLabel: 'Transactions',
tabBarIcon: ({ tintColor, focused }) => (
<Ionicons
name={focused ? 'ios-home' : 'ios-home-outline'}
size={26}
style={{ color: tintColor }}
/>
)
}
},
SettingsTab: {
screen: MySettingsScreen,
path: '/settings',
navigationOptions: {
title: 'Settings',
tabBarIcon: ({ tintColor, focused }) => (
<Ionicons
name={focused ? 'ios-settings' : 'ios-settings-outline'}
size={26}
style={{ color: tintColor }}
/>
)
}
}
},
{
tabBarPosition: 'bottom',
animationEnabled: false,
swipeEnabled: false
}
)
const SecondaryBottomTabs = StackNavigator({
Root: {
screen: TabNav
},
NotifSettings: {
screen: MyNotificationsSettingsScreen,
navigationOptions: {
title: 'Notifications'
}
},
Profile: {
screen: MyProfileScreen,
path: '/people/:name',
navigationOptions: ({ navigation }) => {
title: `${navigation.state.params.name}'s Profile!`
}
}
})
export default SecondaryBottomTabs