react-native-bottom-sheet scroll not working when scrolling bottom to top - react-native

react-native-bottom-sheet is not scrolling bottom to top in the below scenario.
Scroll to the bottom
Close the bottom sheet to the start position
Try to scroll from bottom to top
Please see the video
My code is as follows
<BottomSheet
ref={ref}
index={0}
snapPoints={[200, 500]}>
<BottomSheetScrollView contentContainerStyle={styles.bottomSheetContentContainer}>
// components to render inside the bottom sheet
</BottomSheetScrollView>
</BottomSheet>;

Related

How can I hide tooltip with MapBoxGL.Callout manually in react native (react-native-mapbox-gl)?

I am now showing several markers on the mapview using MapBoxGL.PointAnnotation.
I added MapboxGL.Callout component to show tooltip when the marker is selected.
<MapboxGL.PointAnnotation
key={random.toString()}
id={random.toString() + '_source'}
coordinate={tagCoordinates}>
<Image source={getIconLocal(tagIcon)} />
<MapboxGL.Callout
title={`Tag: Pathogen\n${typeName}\nUser: ${userName}\nDate: ${createDate}`}
style={{minWidth: 200}}
contentStyle={styles.tagContainer}
textStyle={styles.tagText}
tipStyle={styles.tagTip}
/>
</MapboxGL.PointAnnotation>
It's working as I expected.
The problem is that I can't hide tooltip when select the rest area of the mapbox.
When I select another marker, it's working fine (hide current tooltip and show selected marker's tooltip), but tooltip is remained when select the rest area of the mapview except markers.

How to use an horizontal scrollView while using createMaterialTopTabNavigator with swiping enabled, REACT NATIVE

i'm using createMaterialTopTabNavigator with a swipeEnabled set to True to navigate between screens, I have a Screen which contains an horizontal scrollView, the problems is that the scrollView isn't working, since whenever i try to scroll it horizontally the screen just changes to the next one.
I'd like to be able to disable the swipeEnabled when i swipe in the scrollView.
PS: i tried doing it dynamically by passing a variable to the Screen and a method that sets it to false using onTouchStart, but it's slower than the swiping event of the screen so it end up swiping to the next screen before onTouchStart event start.

Applyed animation moves view to the top of screen

To see my humidityImageView I need to scroll down a little bit.
When I apply this animation:
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(humidityImageView, View.Y,40);
objectAnimator.setDuration(2000);
objectAnimator.setRepeatCount(ValueAnimator.INFINITE);
objectAnimator.start();
it starts fromt the top of the screen, but not from the position of the humidityImageView in my ConstraintLayout.
How to make animation starts from the initial view position?
All I needed is replace View.Y to View.TRANSLATION_Y

ScrollView only scrolls when placing finger inside of an input

I'm having a weird behavior here and I can't figure out what's going on. I have a ScrolView with a form and some inputs and labels inside and it seems to only want to scroll when you place your finger (or cursor in the demo) over an input or a switch and it doesn't scroll when placing your finger anywhere else in the ScrollView
I put together an Expo Snack to show the code and if you run in the emulator and attempt to scroll the ScrollView by placing the cursor over one of the labels or on the edges of the ScrollView it won't scroll but if you place the cursor over an input or a switch it scrolls just fine
https://snack.expo.io/#jordanr/weird-scrollview-bahavior
The issue is because Touchable effects in your TouchableWithoutFeedback are blocking the effects of ScrollView, therefore you need to reset your responder by wrapping the Content inside the View
<Content>
<View onStartShouldSetResponder={() => true}>
//... Rest of the code
</View>
</Content>
Also don't use ScrollView since NativeBase uses KeyboardAwareScrollView from the package react-native-keyboard-aware-scroll-view in the <Content/>

anchoring an image at the bottom of the content area of a flatList in react native

For an app i'm working on the designer wants a background image to a scrollview which would be anchored to the bottom of the content area of the scrollview.
So let's say the screen is 500px tall,the scrollview on content is 1000px, the image to display in the background is 200px.
How can i make it so that the background of the flatlist is empty until the user scroll and reveals the bottom 200px of the content of the scrollview.