Touchables and horizontal scroll at the header

[tiagocorreiaalmeida]

Feature request

The idea is to allow the header to contain Touchable elements and horizontal views that don't affect the vertical scroll behavior of the tab view, this means we don't have to manually add pointerEvents to all views that are not target of the touch events, it also means we can have both the behaviors, having the element being target of a touch event as press and still be able to scroll vertically on the same element

Current behavior

At first sight it works pretty well, but if you play around with it some tabs will not sync properly, this is easier to reproduce on the examples that have snap or reveal header on scroll. With that said, I believe I need some help on this topic since I'm not yet familiar with all the project internals, either way I will keep playing around with it and see If I can figure it out myself.

Screenshots (if applicable)

https://github.com/PedroBern/react-native-collapsible-tab-view/compare/main...tiagocorreiaalmeida:feat/header-touchables-and-horizontal-scroll?expand=1

https://user-images.githubusercontent.com/17684951/165991489-8ba14919-6564-437d-bfab-6a2d4ebd186d.mp4

[tiagocorreiaalmeida]

After some updates I believe most of it works properly, there's so minor improvements that need to be made:

• Changing tab when the header is scrolling is not perfect yet
• Further test reveal header on scroll and snapping
• Improve snapping, at the moment the snap only happens at the end of the decay which takes a bit too long in terms of UX, haven't tested it yet, but I believe one solution could be handling the snap logic on the onScrollEnd end event

@andreialecu @PedroBern can you give a look into this one and see if the approach is correct and also see if I missed any of the project internals?

[andreialecu]

Would suggest opening a PR, a bit hard to go over it like this.