is there a way to disable the marker focus when it is clicked? Like I want the map view to stay as it is when I click a marker. Right now, if I click any marker the map view automatically adjust focusing on that marker. Is there a way to disable it? Many thanks
As jasongaare states in https://github.com/react-community/react-native-maps/issues/199#issuecomment-330901293, there is a moveOnMarkerPress property for the MapView component.
I guess the only way to make it possible for now is to do the LiteMode
https://github.com/airbnb/react-native-maps/blob/master/example/examples/LiteMapView.js
So far it works just fine, it does not focus anymore to the pressed Map Mark.
Related
Hey I'm just starting out with React Native CLI.
I want to have a button which will add an item in the ScrollView. And the new Item should lead to a new Screen when you press it. But I don't have an idea how to make this nor do I know how to google that xD. Does anyone know how I can make this?
I just have a button which leads to another screen when pressing it.
I hope someone can help me :)
First you have to clear few things and make the logic.
1)Either you want to save that item datathen show it in scroll view, make it Pressable and then u can navigate to a different screen.
Or
You just want to show the data in the scroll view. Once you reload, the data is gone. So that's my bro (In my opinion) is of no use.
For the first step .
You need to store the data in a storage and then fetch it in a scroll view,
make it Pressable and navigate to a different screen.
(hint: If you want to make it Pressable then you can fetch the data into a card component and then call that component in a scroll view).
Now grab your keyboard and start searching on it.
Hey their fellow stack over flowers!
As the question states, is it possible to perform such a feat?
If possible how would you go about doing it?
So the situation we have here is that there is a drawer and on top of it lies the bottom tab bar which annoys the whole view of the screen. That's why we should find a way to hide it. Isn't it?
Here's what you've got:
What's required is, hiding the tab bar when clicking on the hamburger menu and taking it back up when you touch or press down the bottom tab area. Obviously, I went through other quality questions with qualities answers here. But nothing seems to provide a providence a least bit
Do you know any clever way to handle this?
THANKS!!
If you are using custom tabBar, you could use React.Context or some kind of global state to trigger hiding your tabBar when you press a button. I would "hide" my tabBar by rendering the tabBar as a transparent Pressable with a certain height that when you click on it, it will rerender the original tabBar. You could also use setTimeout to rehide it automatically.
I know using Keyboard.dismiss() can make the keyboard disappear, but I specifically want to know if there is a way to add a key on the keyboard (like a minimize key, a downward triangle etc) for dimissing it? It is intended for users to see visually instead of having to try to click a white space (where I implemented Keyboard.dismiss()).
I think if you use the prop keyboardType correctly you're gonna get what you want. Take a look here with more details in what which value that can be putted in this prop does.
I would like to create a carousel that scrolls automatically until the user scrolls / touches the ScrollView itself.
The auto-scrolling itself works fine with using scrollView.scrollTo but how could I detect if the user is interacting with the ScrollView? I took a look at the onScroll event but this does not seem to distinct between a user generated event and an event that was generated by calling scrollTo.
Also I'd like to know if it is possible to get the current scroll position from the ScrollView directly instead of reading it everytime from the onScroll event.
I'm very thankful for any tips and suggestions.
By digging into ScrollView's source code you can notice a few undocumented callbacks that will help you achieve what you're after, namely onTouchStart and onTouchEnd. These two callbacks are triggered only when user interacts with the ScrollView and not when you scroll programmatically.
You will probably want to clear your auto-scroll interval on onTouchStart and restart it after a delay on onTouchEnd.
Regarding your next question, the answer is no. As far as I know, no getter is currently exposed to retrieve the current scroll position. Therefore, you need to rely on the event passed to onScroll, retrieve event.nativeEvent.contentOffset['x' or 'y'], and store it in your component's state.
Note that if you're doing some heavy animations that need to follow scroll position closely (e.g. animated header or parallax image), it would be a good idea to use the native driver for Animated.event. You can learn more about it on React Native's blog.
I'm trying to implement scroll-then-fix using NavigationExperimental. (Medium android app implements this.)
First I need to make NavigationHeader scroll with the content instead of fixed at the top. And the Navigation fixed at the top when scrolling to certain position.
My first attempt is let NavigationHeader listen to the scroll event of the NavigationCard, here's the problem:
How do NavigationHeader/NavigationCard communicate each other? NavigationHeader needs to know the scroll position of the NavigationCard to change the state. But they are two separate components.
Or maybe there's an smarter way doing this? Thanks for your help!