Commit Graph

5 Commits

Author SHA1 Message Date
Spencer Ahrens 7cfbb79617 Propagate onScroll
Reviewed By: yungsters

Differential Revision: D4557672

fbshipit-source-id: a265231dbc992a84449e5ae051530f63f7b8efd4
2017-02-14 18:30:02 -08:00
Spencer Ahrens 91bda43e56 Fix `getItemLayout` flow type to include `index`
Summary:
The index is used to make sure the layout corresponds to the correct index, which can get
out of sync if cell layout is cached and then cells are re-ordered.

Reviewed By: bvaughn

Differential Revision: D4554721

fbshipit-source-id: 9acb37f390a6e40ad89f813b78f81b399ec11e9a
2017-02-13 18:15:43 -08:00
Spencer Ahrens 0a86c1cb15 debug overlay
Reviewed By: yungsters

Differential Revision: D4534822

fbshipit-source-id: ceef5bc5c0dc8cdc0d3927e198273b4411045bde
2017-02-13 13:03:30 -08:00
Spencer Ahrens 12b228c5d9 Improve scroll to top performance
Reviewed By: yungsters, bvaughn

Differential Revision: D4533070

fbshipit-source-id: 9458801aa679b830642f43be93f43bc08ef841cd
2017-02-13 13:03:30 -08:00
Spencer Ahrens a3457486e3 Better ListView - FlatList
Summary:
We really need a better list view - so here it is!

Main changes from existing `ListView`:

* Items are "virtualized" to limit memory - that is, items outside of the render window are unmounted and their memory is reclaimed. This means that instance state is not preserved when items scroll out of the render window.
* No `DataSource` - just a simple `data` prop of shape `Array<any>`. By default, they are expected to be of the shape `{key: string}` but a custom `rowExtractor` function can be provided for different shapes, e.g. graphql data where you want to map `id` to `key`. Note the underlying `VirtualizedList` is much more flexible.
* Fancy `scrollTo` functionality: `scrollToEnd`, `scrollToIndex`, and `scrollToItem` in addition to the normal `scrollToOffset`.
* Built-in pull to refresh support - set set the `onRefresh` and `refreshing` props.
* Rendering additional rows is usually done with low priority, after any interactions/animations complete, unless we're about to run out of rendered content. This should help apps feel more responsive.
* Component props replace render functions, e.g. `ItemComponent: ReactClass<{item: Item, index: number}>` replaces `renderRow: (...) => React.Element<*>`
* Supports dynamic items automatically by using `onLayout`, or `getItemLayout` can be provided for a perf boost and smoother `scrollToIndex` and scroll bar behavior.
* Visibility callback replaced with more powerful viewability callback and works in vertical and horizontal mode on at least Android and iOS, but probably other platforms as well. Extra power comes from the `viewablePercentThreshold` that lets the client decide when an item should be considered viewable.

Demo:

https://www.facebook.com/groups/576288835853049/permalink/753923058089625/

Reviewed By: yungsters

Differential Revision: D4412469

fbshipit-source-id: e2d891490bf76fe14df49294ecddf78a58adcf23
2017-02-04 10:28:47 -08:00