Question - Collapsable Header

[AAAstorga]

Is this a bug report, a feature request, or a question?

Question

I am interested in making a collapsable header while using a Carousel in vertical orientation. I have an animated value listening to the onScroll event on the Carousel. As the user scrolls from the first item down, I make the height of the header smaller. This causes the Carousel to jump around and get really glitchy before going back to the first item. Is there a way to achieve a collapsable header without the Carousel spazzing out?

Thanks!

Example:

const headerHeightInterpolation = scrollOffsetY.current.interpolate({
        inputRange: [0, HEADER_SCROLL_DISTANCE],
        outputRange: [EXPANDED_HEADER_HEIGHT, COLLAPSED_HEADER_HEIGHT],
        extrapolate: 'clamp',
});

...

<View>
    <Animated.View style={{flex: 1, height: headerHeightInterpolation, marginBottom: 8}}>
        <Carousel vertical={true} ...restOfProps />
    </Animated.View>
</View>

[dohooo]

Sorry, please allow me to advertise for my open source library! ~ I think this library react-native-reanimated-carousel will solve your problem. It is a high performance and very simple component, complete with React-Native reanimated 2