react-native-collapsible-tab-view icon indicating copy to clipboard operation
react-native-collapsible-tab-view copied to clipboard

Current scrollY for Header animations

Open hazirmagron opened this issue 2 years ago • 1 comments

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?

hazirmagron avatar Feb 18 '23 10:02 hazirmagron

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.

hazirmagron avatar Feb 18 '23 13:02 hazirmagron