Questions tagged [stack-navigator]

0

votes
0

answer
6

Views

Logging out to a specific view in react native

I'm a beginner to react native development. At the moment I'm trying to set my navigation for the login logout process. This is my app flow right now Home -> SignIn -> Dashboard. Now when the user clicks the logout button in the dashboard it should go back to Home screen. This works well for the fir...
Gamerlegend
2

votes
3

answer
2.3k

Views

How to hide header of createStackNavigator on React Native?

I want to hide header because I already have styled Toolbar in code: import {createStackNavigator} from 'react-navigation' const AppStackNavigator = createStackNavigator ({ Home: HomePage, Friend: AddFriend, Bill: AddBill, }) class App extends Component { render() { return ( ` ); } } export default...
Just Ahead
2

votes
5

answer
780

Views

getting undefined is not a function (evaluating '(0,_reactNavigation.stacknavigator)') in drawer navigation

In my application I need drawer navigation, for that I am using sample code from this. I have integrated everything in my application, but getting the following error undefined is not a function (evaluating '(0,_reactNavigation.stacknavigator)') And installed this one too. npm install react-navigati...
rams
2

votes
3

answer
492

Views

How to change screen and setState at the same time on first click in React Native

I have a function that changes the screen and sets the state at the same time that works given below (initial state of weapon is null): var { navigate } = this.props.navigation; clickM16 = () => { this.setState({ weapon: "M16" }); navigate("Second", {weapon: this.state.weapon}); } And I am calling t...
user9069254
1

votes
1

answer
451

Views

Custom View as background for StackNavigator

I need use one image below stack navigator or something like this. Into StackNavigator I can set backgroundColor, opacity (view style) etc. But no possibility to set one background image or custom view component. Also if set to each screen its not good for screen translation. I was try to wrap l...
Leonid Veremchuk
3

votes
2

answer
2.1k

Views

React Native - Change background color in tabnavigator dynamically

i want to change my tab navigator background color dynamically in based on my API response so below is my code _TabNavigator.js const MyTabnav = TabNavigator({ ScreenOne: { screen: ({ navigation, screenProps }) => , navigationOptions: { tabBarLabel: 'ScreenOne', tabBarIcon: ({ tintColor }) => ( Scre...
Harshal Kalavadiya
2

votes
3

answer
3.8k

Views

How to change back button route in react navigation

i am using react-navigation (stack-navigation). i want to change my header back button icon route. Home BookTicket MyBookings these are the screens i have in my project.Now when i click header back button in MyBookings screen it should route to Home Screen.
Sathish Sundharam
2

votes
3

answer
3.9k

Views

React native clear Stack Navigator stack

I have few screens which I navigate through one by one. Screen1->screen2-screen3->screen4-Home What I want is when I go to home then the previous history of navigation should be cleared and back pressing back button should not go to last navigated screen which is screen 4. Currently When I press bac...
Paras Watts
6

votes
1

answer
547

Views

React Navigation Header change with screen

I have a StackNavigation and want a default Header (component Header) and want that "deep pages" shows up with the default header generated for the React Navigation. In my index page **Index**, just wanted the Header component(first header)...but shows up another blank header: In my "deep page" **Te...
Igor Martins
3

votes
3

answer
3.9k

Views

React Native - Passing Data Across Screens

I'm having some trouble with a react-native app. I can't figure out how to pass data across screens. I realize that there are other similar questions that are answered on SO, however the solutions did not work for me. I'm using the StackNavigator. Here's my setup in my App.js file. export default Si...
Lars Peterson
1

votes
1

answer
322

Views

Cannot access props from inside navigationOptions

I am using the StackNavigator library but cannot figure out how to access the props from within navigationOptions. In my calling class I have: navigate("TestView", { mdata: mdataObject }) In my TestView class I have the following: static navigationOptions = { title: this.props.navigation.state.param...
kojow7
2

votes
2

answer
1.6k

Views

Passing navigation props from parent to child component

I am developing an application which starts from App.js. If user is using app, first time then LoginScreen rendered and if user is logged in already then HomeScreen rendered. Here's my App.js, export default class App extends Component{ state = { isFirstTime: true, } renderIf(condition, content) { i...
HeisenBrg
1

votes
1

answer
129

Views

React Native: Transparent Stack Navigator in iOS doesn't work

I use a Stack Navigator from React Navigation and want to make it transparent with the following code: const MyStackNavigator = new StackNavigator({ ScreenOne: { screen: ScreenOne }, },{ cardStyle: { backgroundColor: "transparent", } }); (see also: https://snack.expo.io/@pob/stacknavigator-problem)...
Paul
2

votes
1

answer
434

Views

Route to parent navigator - React Native

I have a stackNavigator nested in another stackNavigator: Parent Navigator: Index.js Login.js Signup.js Home.js My child navigator is on the signup.js component. Where i have Children Navigator: Name.js Email.js When the userRegistration is successful on Email.js Screen I want to navigate to the Hom...
Ryne
2

votes
2

answer
81

Views

Two routes instantiate when “Registration” is triggered

I have an app with a registration and a login flow. And I'm having bit of an issue with nested stack navigators when used with Redux. React-Navigation structure RootNavigator (Stack navigator) Registration (Stack navigator) Login (Stack navigator) App setup react: 16.0.0-alpha.6, react-native: 0.44....
hdsenevi
2

votes
1

answer
419

Views

Getting AsyncStorage data on back navigation in react native

I have a home screen which pulls some data from AsyncStorage in componentDidMount(). I'm using StackNavigator to move from my home screen to another screen to add some data to AsyncStorage which should also be shown on the home screen. Thanks to StackNavigator I have a back arrow on that second scre...
Alex
2

votes
1

answer
959

Views

How to change screen after fetch in React Native? [Using Stack Navigator]

I want to: (I am using stack navigator) Execute a fetch (HTTP post to an API), Evaluate the response and take appropriate action (whether its showing the user an error message, in case of failure or letting them progress by showing the next screen, if successful). I am stuck on step 2, I am not ab...
Mark20
2

votes
1

answer
2k

Views

What properties does navigationOptions take in react-native?

There's mention of the property navigationOptions in this page here: https://facebook.github.io/react-native/docs/navigation.html I can't seem to find the full list of properties that navigationOptions is supposed to take? Where do I get this information?
John
4

votes
1

answer
984

Views

In React Native why is the const type used for in for example: const { navigate } = this.props.navigation;?

I am working on a project for school and using react native. Admittedly I am on the novice side with regards to JavaScript. I do not understand why in the React Navigation tutorial they use the const type. class HomeScreen extends React.Component { static navigationOptions = { title: 'Welcome', }; r...
Christopher Reyes
2

votes
1

answer
232

Views

React Native Changing a StackNavigator Header Color

I'm making an application in React Native, and I'm trying to implement a feature that will change the color of the header and then immediately see the change. I am setting the color of the header to equal the value in a global stylesheet. When I change the color variable in the stylesheet, the menu...
Prem P.
2

votes
2

answer
1.8k

Views

How to use both custom TabNavigator and StackNavigator in react-navigation

I'm having some issue with react-navigation. My navigation routes : StackNavigator: main app navigation -- WelcomeScreen -- GuideScreen -- TabNavigator: this is CustomTabs + MyHomeScreen + MyNotificationsScreen + MySettingsScreen -- OtherScreen. I use createNavigator, createNavigationContainer to...
LaLa
3

votes
1

answer
1.7k

Views

How to Set background image of DrawerNavigator in React-Native?

I integrate DrawerNavigator in my project. its working fine, but there are no any property to set background image. How can I will add background image in DrawerNavigator. DrawerNavigator Code of DrawerNavigation import { AppRegistry , Dimensions} from 'react-native'; import Library from './ViewCo...
Kirit Modi
2

votes
2

answer
633

Views

Refresh a screen after state change [Drawer navigator react-native]

I have a DrawerNavigator in StackNavigator. I have implemented the structure to achieve Hamburger menu function. I have a listing home page with a hamburger menu icon. On clicking the icon, I open a menu just like how it is in Amazon, flipkart apps. The menu list is dynamic, I need to refresh the li...
Manju Basha
2

votes
1

answer
28

Views

Why my stacknavigator works with one screen and not with another one?

I want to navigate accross screens from a Camera screen to a summary screen but it doesn't work: // Camera screen if (data.data){ const data = {date,name,place} Alert.alert( 'Info', 'Show', [{text: 'More', onPress: () => this.props.navigation.navigate('Summary')}], ) })} I already defined...
benda
0

votes
1

answer
176

Views

How can I navigate to other screen using HeaderRight component in stack navigtaor?

I want to navigate to other screen onPress of profile-image on HeaderRight component of stacknavigator? I've used tabnavigator inside my routersnavigator(tabscreen). Screen Image attached with it.onpress of profile icon in header should navigate to other screen]1 import React, { Component } from 'r...
Kamlesh Tilwani