Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Go-to #51

Open
nicencina opened this issue Aug 10, 2021 · 4 comments
Open

Go-to #51

nicencina opened this issue Aug 10, 2021 · 4 comments

Comments

@nicencina
Copy link

Great component!!

Is there a way of navigating directly to a section of the timeline? Let's say that I want to display a full timeline but would like to start the user at "Today", which may be anywhere along the flatlist. Or if from somewhere in the app I want to link/navigate directly to a section of the timeline. I couldn't find documentation

Thank you

@Eugnis
Copy link
Owner

Eugnis commented Aug 10, 2021

Hi. That is possible for Flatlist using https://reactnative.dev/docs/flatlist#initialscrollindex or https://reactnative.dev/docs/flatlist#scrolltoindex

For that firstly you should somehow in your code identify index of item (of data you passed) to navigate, and then pass to Timeline custom options.

For example to start from item index 3 you can pass options={{ initialScrollIndex: 3 }}.
And if you want to navigate with some external button when Timeline already rendered you should get ref from inner Flatlist like that options={{ ref: (ref) => { this.flatListRef = ref; } }}. Then you can use in your code this.flatListRef.scrollToIndex({animated: true, index: 3});

As this component based on Flatlist, you can pass custom props to it with options object like that

<Timeline 
... 
options={{ }}
/>

@nicencina
Copy link
Author

Awesome -- will definitely give it a try. Thank you, Eugnis!

@nicencina
Copy link
Author

initialScrollIndex requires getItemLayout to be implemented in order to work. However, after reviewing the source code for Timeline I noticed that it extends PureComponent (not FlatList), and PureComponent does not include a getItemLayout method, which means that I cannot override this method in order to support the requirement for initialScrollIndex (or, at least, I don't know how to).

In your render() { return () } section you implement a FlatList but I only see a way of passing options in, not getItemLayout method. I'll continue to search for documentation in case I'm missing something obvious, but I'm not sure how to get initialScrollIndex to work without what I describe above.

@nicencina
Copy link
Author

Nevermind -- I figured it out! ;P Just pass the getItemLayout function as an option along with the initialScrollIndex. Thanks again!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants