search

slorber / react-native-scroll-into-view

Scroll a ReactNative View into the visible screen. Similar to DOMElement.scrollIntoView() browser function.
https://thisweekinreact.com
MIT License
415 stars 13 forks source link

Highlight component scrolledto #10

Open JoaoPedroRodrigues opened 4 years ago

JoaoPedroRodrigues commented 4 years ago

Hey there!

Awesome component, really easy to use!

I just have a small extra feature that I need which I thought others would need too. Is there anyway to highlight the component after the scroll happened?

This need came from the fact that my user is coming from another screen and he has been scrolled to a list of elements, and I want to make it even clearer which item of that list he has been scrolled to!

slorber commented 4 years ago

Hi and thanks :)

Not sure it's possible because the scroll is animated and the scroll animation is native. As far as I know there's no way to know when that animation completes.

One solution could be to add a listener to know when the scrollIntoView behavior triggers, like

<ScrollIntoView
          onTrigger={() => {}}
        >

        </ScrollIntoView>

But I would have to fire the callback early and you would need to use setTimeout if you want the highlight to happen only after end of scroll animation. Also not sure what you mean by "highlighting", at most I can allow you to build your own highlight, this library is not really doing any design for your