Eugnis/react-native-timeline-flatlist

Timeline in ScrollView

Closed this issue · 3 comments

mburakkalkan commented

I get "VirtualizedLists should never be nested inside plain ScrollViews with the same orientation - use another VirtualizedList-backed container instead" warning when I want to use the timeline in a scrollview.

Eugnis commented

It's not a bug. FlatLists (used in timeline) inside of ScrollViews with the same direction will render all of the items at once and can’t be virtualized. So you can use Timeline with a ScrollView but all the performance benefits of Flatlist will be worthless as they’re not working.

It was like that before SDK 36, but now they added a warning. As long as your list of data isn’t big and you don’t render a lot of items you can hide the warning or just ignore it.

mburakkalkan commented

Ok, I yellowboxed it for now.

Bound3R commented

Hello, I solved it by doing the following:

this step brings the latest version of the repository directly as they have not updated the package for npm.

yarn add https://github.com/Eugnis/react-native-timeline-flatlist

here I add the property isUsingFlatlist that disables the flatlist and this allows to use it inside a scrollview

import Timeline from "react-native-timeline-flatlist";

<Timeline
  data={this.data}
  isUsingFlatlist={false}
/>

With this I can now enjoy using this component within my views without any problems.