I am developing the onboarding part of an app. The user is supposed to slide right, but then on the last item, he should be redirected to the register page.
I tried onEndReached, but it works with timer (after 5seconds he automatically is redirected). How do I do it without the timer? User is the one who should decide if he wants to swipe or not.
Related
I have an app where users can navigate almost endlessly to new screens (I'm using Stack Navigator). There are about 15 different screens, but every screen can be opened with a huge number of different IDs (showing data for different companies, etc). For example in the Company route, the user can open many different Person screens based on employees, and again from Person screens the user can navigate to many different screens, so the navigation is basically endless.
Because React Navigation keeps all screens in memory, after navigating maybe 20-30 different screens, the app becomes very laggy. And because the number of routes is basically endless, it's impossible to keep all screens in memory.
I end up replacing the screen (navigation.replace) instead of pushing it when the user navigates to a new screen. That way there is only one screen in the memory at a time. I also made an array where I push the name and parameters of the new route every time, so when user goes back, I get the previous routes from that array and I replace current screen with the screen from that history array. It works fine, but of course, going back is not as fast as using React Navigation in the standard way.
So the first question: what is the most efficient and CORRECT way of using React Navigation in my case?
Second question: because I have just one screen on React Navigation's history, the swipe back does not work on iOS. Is there an easy way to change swipe back to call my own back function instead of React Navigation's default back?
I am using React Native's FlatList component with pagination. I want to execute a callback with the destination page as a parameter whenever the user releases on scroll.
onScroll fires pre-maturely and switches pages before the users releases the screen.
onScrollDragEnd doesn't correctly give you the destination page unless you drag your finger at least half way across the screen (eg doesn't work if you do a quick swipe).
onMomentScrollEnd doesn't get fired until the display stops moving, which may not get fired if the user is constantly swiping.
Is there some sort of middle ground to achieve this functionality?
I want to check that user is active or not at application level.I have used PanResponder to detect user activity for one screen but I want to check for whole application in one component because I have more than 20 screens in application.
Note: I am using wix-react-native-navigation for navigation so every new screen is in navigation stack.
We built a React Native tablet kiosk app which displays multiple pages of input fields to a user at a front desk. The user has to fill out all the forms and can send them at the end.
Users can just walk away from the kiosk at any time, which would result in their last screen being the "welcome screen" for the next user. To avoid that, the app resets after some time if there was no user interaction (any touch event on the screen).
Right now, we use a countdown and reset it on each input field, button and background touch there is. This results in passing the reset callback to a lot of components. It works, but it is just a lot of redundancy and can lead to errors easily.
Is there any way, we can add an overlay to the very top of the view, which can catch all touch events and call the reset callback, but also pass the touch event to the views below? So when a user clicks on a button, the overlay calls the its callback but also the button is clicked (same for input fields, etc).
We also tried the Gesture Responder System, but could not get the touch event to pass through - it was always consumed by the component with the Gesture Responder System.
You can try adding a pointerEvents attribute to your View.
I recently implemented navigation in my app using NavigatorIOS in React Native. However, I think I've encountered a problem. Say I have 10 nav buttons on my home screen. Correct me if I'm wrong but I'm assuming (since I haven't done the backend yet) that if I use the first button to navigate to the next screen (let's call it Second.js), wrote/saved some data, and then went back and navigated to Second.js with the second button, that data from before would still be there? If so, is there a way for each button to navigate to a different "version" of the same screen? For example, could each button go to its own version of Second.js so that each button has its own local data in its Second screen, or would I have to make Second1.js, Second2.js, Second3.js, etc.? If the former isn't possible, I'd need a fixed number of nav buttons, plus a lot of memory is wasted with all these new classes that are basically replicas of each other. Thank you!