search

bamlab / react-native-image-header-scroll-view

ScrollView with an image in header which becomes a navbar
MIT License
990 stars 94 forks source link

Trigger bounce/zoom on drag in header #61

Open eddyjusufi opened 5 years ago

eddyjusufi commented 5 years ago

Is there a way to trigger the bounce/zoom when the user scrolls down by touching the header as well?

Nhacsam commented 5 years ago

It should be if you have no foreground : https://github.com/bamlab/react-native-image-header-scroll-view/issues/6#issuecomment-320517228 Can I see your code ?

eddyjusufi commented 5 years ago

@Nhacsam I do have text as foreground. Is there any way to trigger the header bounce/zoom through it nonetheless? Here is what my code looks like:

<HeaderImageScrollView
       maxHeight={MAX_HEIGHT}
       minHeight={MIN_HEIGHT}
       minOverlayOpacity={0}
       maxOverlayOpacity={0}
       headerImage={require("../../../assets/images/headerImage.jpg")}
       renderForeground={() => (
                    <View style={{ flex: 1, flexDirection: 'row', alignSelf: "flex-end", alignItems: "flex-end" }} >
                      <TouchableOpacity onPress={() => console.log("tap!!")}>
                        <Text style={{ color: "white", backgroundColor: "transparent", alignSelf: "center" }}>Really long text with a link when pressed</Text>
                      </TouchableOpacity>
                    </View>
                  )}
                >
      <View style={{ flex: 1, height: 1000 }}>
            <TriggeringView onHide={() => console.log("text hidden")}>
                   <Text>Scroll Me!</Text>
             </TriggeringView>
       </View>
     </HeaderImageScrollView>
Nhacsam commented 5 years ago

No, you can't right now, The foreground intercept the touch event and don't propagate it to the scrollView behind.