react-navigation#StackActions JavaScript Examples
The following examples show how to use
react-navigation#StackActions.
You can vote up the ones you like or vote down the ones you don't like,
and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
| Source File: TransferScreen.js From hugin-mobile with GNU Affero General Public License v3.0 | 6 votes |
|
render() {
return(
<HeaderButtons HeaderButtonComponent={CrossIcon}>
<Item
title=''
iconName='close'
onPress={() => {
this.props.navigation.dispatch(StackActions.popToTop());
this.props.navigation.navigate('Main');
}}
buttonWrapperStyle={{ marginRight: 10 }}
/>
</HeaderButtons>
);
}
Example #2
| Source File: Utilities.js From hugin-mobile with GNU Affero General Public License v3.0 | 6 votes |
|
/* Navigate to a route, resetting the stack, so the user cannot go back.
We want to do this so when we go from the splash screen to the menu screen,
the user can't return, and get stuck there. */
export function navigateWithDisabledBack(route, routeParams) {
return StackActions.reset({
index: 0,
actions: [
NavigationActions.navigate({
routeName: route,
params: routeParams,
}),
]
});
}
Example #3
| Source File: NavigationService.js From gDoctor with MIT License | 6 votes |
|
function replace(routeName, params) {
const navigation = _navigator.currentNavProp
_navigator.props.dispatch(
StackActions.replace({
routeName,
params
})
)
}
Example #4
| Source File: NavigationService.js From iitj-canteen with GNU General Public License v3.0 | 6 votes |
|
/**
* Call this function when you want to navigate to a specific route AND reset the navigation history.
*
* That means the user cannot go back. This is useful for example to redirect from a splashscreen to
* the main screen: the user should not be able to go back to the splashscreen.
*
* @param routeName The name of the route to navigate to. Routes are defined in RootScreen using createStackNavigator()
* @param params Route parameters.
*/
function navigateAndReset(routeName, params) {
navigator.dispatch(
StackActions.reset({
index: 0,
key: null,
actions: [
NavigationActions.navigate({
routeName,
params
})
]
})
);
}
Example #5
| Source File: NavigationServices.js From Alfredo-Mobile with MIT License | 5 votes |
|
function goBack() {
_navigator.currentNavProp.dispatch(StackActions.pop({
n: 1
}))
}
Example #6
| Source File: NavigationServices.js From Alfredo-Mobile with MIT License | 5 votes |
|
function pop(n) {
_navigator.currentNavProp.dispatch(StackActions.pop({
n
}))
}
Example #7
| Source File: navigation.js From rakning-c19-app with MIT License | 5 votes |
|
export function resetStack(navitagion, routeName, params = {}) {
const resetActions = StackActions.reset({
index: 0,
actions: [StackActions.push({ routeName, params })],
});
navitagion.dispatch(resetActions);
}
Example #8
| Source File: routes.js From haven with MIT License | 4 votes |
|
MainTab = createBottomTabNavigator(
{
Shop: {
screen: ShopTab,
navigationOptions: {
tabBarOnPress: ({ defaultHandler }) => {
eventTracker.trackEvent('MainNavigationTap-Discover');
defaultHandler();
},
tabBarIcon: ({ focused }) => (
<Feather name="shopping-cart" size={23} color={focused ? '#00bf65' : '#969696'} />
),
},
},
Feed: {
screen: FeedTab,
navigationOptions: {
tabBarOnPress: ({ defaultHandler }) => {
eventTracker.trackEvent('MainNavigationTap-Social');
defaultHandler();
},
tabBarIcon: ({ focused }) => (
<Feather name="users" size={23} color={focused ? '#00bf65' : '#969696'} />
),
},
},
Plus: {
screen: () => null,
navigationOptions: {
tabBarOnPress: ({ defaultHandler }) => {
eventTracker.trackEvent('MainNavigationTap-Create');
defaultHandler();
},
tabBarIcon: () => <PlusButton />,
},
},
Chat: {
screen: ChatsTab,
navigationOptions: {
tabBarOnPress: ({ defaultHandler }) => {
eventTracker.trackEvent('MainNavigationTap-Chat');
defaultHandler();
},
tabBarIcon: ({ focused }) => <ChatNavIcon focused={focused} />,
},
},
Me: {
screen: MeTab,
navigationOptions: {
tabBarOnPress: ({ defaultHandler }) => {
eventTracker.trackEvent('MainNavigationTap-Me');
defaultHandler();
},
tabBarIcon: ({ focused }) => <ProfilePicture focused={focused} />,
},
},
},
{
tabBarPosition: 'bottom',
swipeEnabled: false,
lazy: false,
tabBarComponent: props => (
<BottomTabBar
{...props}
onTabPress={(tabInfo) => {
if (tabInfo.route.routeName === 'Me') {
const resetTabAction = NavigationActions.navigate({
routeName: 'Me',
action: StackActions.reset({
index: 0,
actions: [NavigationActions.navigate({ routeName: 'WalletMain' })],
}),
});
props.navigation.dispatch(resetTabAction);
} else {
props.onTabPress(tabInfo);
}
}}
/>
),
animationEnabled: false,
removeClippedSubviews: true,
tabBarOptions: {
showLabel: false,
activeTintColor: '#000000',
tabStyle: {
justifyContent: 'center',
alignItems: 'center',
},
},
},
)
Example #9
| Source File: TransferScreen.js From hugin-mobile with GNU Affero General Public License v3.0 | 4 votes |
|
render() {
const { t } = this.props;
return(
<View style={{
backgroundColor: this.props.screenProps.theme.backgroundColour,
flex: 1,
}}>
<View style={{
alignItems: 'center',
justifyContent: 'flex-start',
flex: 1,
marginTop: 60,
}}>
<Text style={{ fontFamily: "Montserrat-SemiBold", color: this.props.screenProps.theme.primaryColour, fontSize: 25, marginBottom: 40, marginLeft: 30 }}>
{t('newContact')}
</Text>
<Image
style={{width: 50, height: 50}}
source={{uri: get_avatar(this.state.address)}}
/>
<Input
containerStyle={{
width: '90%',
marginLeft: 20,
marginBottom: 30,
fontFamily: 'Montserrat-Regular',
}}
inputContainerStyle={{
borderWidth: 0,
borderRadius: 15,
backgroundColor: "rgba(0,0,0,0.2)",
borderColor: 'transparent'
}}
labelStyle={{
fontFamily: 'Montserrat-Regular',
marginBottom: 5,
marginRight: 2,
color: this.props.screenProps.theme.slightlyMoreVisibleColour,
}}
inputStyle={{
color: this.props.screenProps.theme.primaryColour,
fontSize: 14,
marginLeft: 5,
fontFamily: 'Montserrat-SemiBold',
}}
label={t('name')}
value={this.state.nickname}
onChangeText={(text) => {
this.setState({
nickname: text,
}, () => this.checkErrors());
}}
errorMessage={this.state.nicknameError}
/>
<Input
containerStyle={{
width: '90%',
marginLeft: 20,
marginBottom: 30,
fontFamily: 'Montserrat-Regular',
}}
inputContainerStyle={{
borderWidth: 0,
borderRadius: 15,
backgroundColor: "rgba(0,0,0,0.2)",
borderColor: 'transparent'
}}
labelStyle={{
fontFamily: 'Montserrat-Regular',
marginBottom: 5,
marginRight: 2,
color: this.props.screenProps.theme.slightlyMoreVisibleColour,
}}
inputStyle={{
color: this.props.screenProps.theme.primaryColour,
fontSize: 14,
marginLeft: 5,
fontFamily: 'Montserrat-SemiBold',
}}
maxLength={Config.integratedAddressLength}
label={t('paymentAddress')}
value={this.state.address}
onChangeText={(text) => {
this.setState({
address: text,
}, () => this.checkErrors());
}}
errorMessage={this.state.addressError}
/>
<Input
containerStyle={{
width: '90%',
marginLeft: 20,
marginBottom: 30,
fontFamily: 'Montserrat-Regular',
}}
inputContainerStyle={{
borderWidth: 0,
borderRadius: 15,
backgroundColor: "rgba(0,0,0,0.2)",
borderColor: 'transparent'
}}
labelStyle={{
fontFamily: 'Montserrat-Regular',
marginBottom: 5,
marginRight: 2,
color: this.props.screenProps.theme.slightlyMoreVisibleColour,
}}
inputStyle={{
color: this.props.screenProps.theme.primaryColour,
fontSize: 14,
marginLeft: 5,
fontFamily: 'Montserrat-SemiBold',
}}
maxLength={64}
label={t('messageKey')}
value={this.state.paymentID}
onChangeText={(text) => {
this.setState({
paymentID: text
}, () => this.checkErrors());
}}
editable={this.state.paymentIDEnabled}
errorMessage={this.state.paymentIDError}
/>
<View style={{ alignItems: 'center', marginTop: 8, borderRadius: 3, paddingTop: 0,
borderColor: this.props.screenProps.theme.borderColour,
borderWidth: 1,}}>
<Button
title={t('scanQR')}
onPress={() => {
const func = (data) => {
if (data.startsWith(Config.uriPrefix)) {
handleURI(data, this.props.navigation);
} else {
this.setState({
address: data,
// paymentID: data.substring(99),
}, () => this.checkErrors());
}
};
this.props.navigation.navigate('QrScanner', {
setAddress: func
});
}}
titleStyle={{
color: this.props.screenProps.theme.primaryColour,
fontFamily: 'Montserrat-SemiBold'
}}
type="clear"
/>
</View>
<BottomButton
title={t('continue')}
onPress={() => {
const payee = {
nickname: this.state.nickname,
address: this.state.address,
paymentID: this.state.paymentID,
};
/* Add payee to global payee store */
Globals.addPayee(payee);
const finishFunction = Globals.fromChat; // = this.props.navigation.getParam('finishFunction', undefined);
if (finishFunction) {
Globals.fromChat = false;
this.props.navigation.dispatch(StackActions.popToTop());
this.props.navigation.navigate(
'ChatScreen', {
payee: payee,
});
return;
} else {
const amount = this.props.navigation.getParam('amount', undefined);
/* Already have an amount, don't need to go to transfer screen */
if (amount) {
this.props.navigation.navigate(
'Confirm', {
payee,
amount,
}
);
} else {
this.props.navigation.navigate(
'Transfer', {
payee,
}
);
}
}
}}
disabled={!this.state.continueEnabled}
{...this.props}
/>
</View>
</View>
);
}
