Using the react native's official Modal component
Is there any way to prevent the behavior when the modal is open, if i press the menu button of the mobile (built-in one) the modal flickers and closes temporary exposing the background view. Please see the attached url of the GIF for clarification . I am also not sure whether its a default behavior in react native or not.
https://imgur.com/LeTtNj5
Thanks in advance
This isn't so much a solution as much as it's guidance. You haven't really given enough detail to help you out properly. Best if you can share the code or setup a reduced test case at https://snack.expo.io that we can fiddle with.
That said, I'm not totally sure. This is an interesting problem, and I'm curious if you'll find a possible solution and it may depend on your implementation details. For instance, is the modal part of the navigation stack (react-navigation?) or is it an imported component? Either way, I would begin by playing with componentWillUnmount. Does it get called? If so, perhaps you can insert some black magic there to minimize the effect, but you'd first need to isolate what specifically is going on before you can hope to solve it.
Related
I am trying to use pull to refresh from FlatList. Is it possible to move the spinner to where the data actually starts rendering instead of the top of the screen? I found the progressViewOffset that works on Android but I am trying to find how I can implement this behaviour on iOS too. I feel like my solution is to watch scroll interactions and go on from there.
Any idea is appreciated. Thanks in advance.
I've recently upgraded to react-navigation v6 for various functionality upgrades but seem to be having some difficulty understanding the recently added presentation prop available on stack navigators.
I'm working exclusively for IOS and what I basically want to achieve is the same drag-to-close behaviour presentation="modal" gives by default but without the asthetic look of the new screen being stacked on top of the previous screen.
I've made a basic example to highlight what it is I mean which will hopefully make more sense than my words.
If you set presentation to modal inside the Routes.js (line 56), on button click the modal will render and the user is able to drag down on the screen to close it. If however I use presention="transparentModal", you lose the dragging functionality.
Is it possible to get this dragging functionality when using this presentation type?
EDIT
Link to minimal example: https://snack.expo.dev/BpTJ1Cu9m
The goal is a simple and clean implementation to build a pop-up window similar to the search-filters from the YouTube-App, see picture. Tapping on the half-transparent border should close the pop-up. The same pop-up is supposed to be called from several screens (within nested navigation-structures) and just give back the choices to the respective screen.
I did quite some search and documentation reading, so I seem to have the following four options:
Use an Alert window and heavily modifying the alert message, but this option does not allow me to cancel by clicking on the transparent area.
Using some promising-looking component which is very beta like react-native-popupwindow is not really an option either.
Use a modal component which claims to be a simple way to present content above an enclosing view. According to How to dim a background in react native modal? and Tap outside of modal to close modal (react-native-modal)" this seems to be a possible option.
However, some people say that you should rather use Overlay and use Modal only as a last resort.
Please advice which of the solutions you tested in real life. What do you suggest? Maybe there is even an easier solution?
Related question(s) here on StackOverflow:
Transparent overlay in React Native
Modal is totally your way to go.
My personal choice would be https://github.com/react-native-community/react-native-modal which has the best performances and flexibility overall.
I'm working on a RN application which has share and comment features. In Facebook, modals are used to display the comment and share screen contents. In my application I have used seperate screens hence it is bit slower. What is be the better approach to use here?
Always try to use SCREEN with navigator. Think about your form modal screen in overall. May be it more similar on 'screen' then you thought before))
I'm following this guide to create some animations to my app and thought about writing a very light not distracting animation to my tab bar. I've searched apple guidelines but didn't saw anything against it, yet, I don't think I've ever seen an app doing something similar. Is that because it's not allowed or is there another reason I'm missing?
Any one knows an app that does something similar?
I'm using a simple slide in/out effect for the tab bar in my App.
No problems in the review.
The code I'm using is at https://stackoverflow.com/a/5272497/725594