PedroBern / react-native-collapsible-tab-view

A cross-platform Collapsible Tab View component for React Native
MIT License
868 stars 171 forks source link

Current scrollY for Header animations #318

Open hazirmagron opened 1 year ago

hazirmagron commented 1 year ago

Animating Header based on scrollY value

I would like to animate the header based on the scrollY (or height from useHeaderMeasurements) value of the scroll views in the tabs. The useCurrentTabScrollY hook is only accessible within the Tabs, however.

Questions:

hazirmagron commented 1 year ago

Animating Header based on scrollY value

I would like to animate the header based on the scrollY (or height from useHeaderMeasurements) value of the scroll views in the tabs. The useCurrentTabScrollY hook is only accessible within the Tabs, however.

Questions:

  • Is there a way to access the scrollY value from the parent component?
  • Will it cause performance issues?

Found the Animated Header example in the source code which works perfectly fine. The hooks can be used if the Header is broken out into its own components rather than having a render function from the parent. See example here.