Is this compatible with the new FlatList component?

[Talor-A]

Title ^. and if this isn't compatible, what needs to be done to make it compatible?

[ide]

We haven't tried it at all. My guess is that it won't work, I'm not sure if FlatList supports composing scroll views yet. If it does, it wouldn't be too hard to get this component working with FlatList.

[Talor-A]

@ide since react native will be transitioning to FlatList in the next few months are there plans in the future to expand this library to FlatList as well?

[jpshelley]

I tried it and is somewhat works. I'm testing against Android however and issue #33 is stopping me from testing it fully. Is there any thought as to what is causing 33 to help get it up to speed for the flatlist?

[ide]

No current plans to support FlatList -- it's not something I'm against but also don't have as much of a need compared to other projects.

[jcharbo]

It appears that the children are being passed differently to the create element function for the scrollview in virtualizedlist. You can modify that code to make it work or for now you can make a quick fix in your renderitem function. Just wrap the child in a view with the style {
transform: [
{ scaleY: -1 },
],
}

[itinance]

I've tried it out with the new FlatList-Component and it isn't working well.

1. The rows are drawn upside down (even the text)
2. the Event "onViewableItemsChanged" usually returns exactly those rows, that are currently visible while scrolling. When using InvertableScrollView the FlatList returns ALL rows in this event with the first rendering, regardless whether they are visible or not

Any ideas?

[itinance]

The issue with ListView is that it is already deprecated since 0.43 and also that no pullrequests got merged anymore, even those from Januar 2017, with the argumentation that it is deprecated.

[guysegal]

@jpshelley how did you make it work?

[nickcharles]

For those who are looking for a quick drop in I've thrown together an implementation of this using the new FlatList component, you can find the code here: https://github.com/nickcharles/react-native-invertible-flat-list

[braco]

There are improvements to FlatList in the latest release, does this unblock anything?

https://github.com/facebook/react-native/releases/tag/v0.45.0

[nickcharles]

@braco don't think so, I'm going to continue using what I wrote. I'll update it for 0.45 next week.

[psaia]

Really nice work with react-native-invertible-flat-list, @nickcharles. Works great.

[lorenzsell]

There's also this StackOverflow answer which worked really well for me: https://stackoverflow.com/questions/43399343/inverting-a-flatlist#_=_

[nickcharles]

@lorenzsell that's exactly what my package does =)

[JohnDotOwl]

?????

[guysegal]

FlatList now has an inverted prop

[mattisfrommars]

Given the inverted prop on FlatList, should that be the preferred method of creating inverted scroll lists now?

[ide]

Yeah, I would use the built-in prop if that works well.

[nickcharles]

I would also encourage using that instead of custom libraries.

[lgh06]

Also faced upside down issue.

Update: used FlatList's inverted prop, removed this lib, and modified scrollToXxx methods. works fine now.