Commit Graph

4 Commits

Author SHA1 Message Date
Spencer Ahrens dc30203734 minViewTime and waitForScroll viewability config support
Summary:
It's pretty common to want to wait until the user scrolls a view to consider any items
viewable, so `waitForScroll` enables that behavior.

It's also pretty common to want to ignore items that are quickly scrolled out of view, so we add
`minViewTime` to handle that case.

Reviewed By: bvaughn

Differential Revision: D4595659

fbshipit-source-id: 07bc8e89db63cb68d75bdd9bedde3183c38a3034
2017-02-28 02:17:23 -08:00
Espen Hovlandsdal 9217ff3203 Fix typo in ViewabilityHelper (`itemVisiblePercentThreshold` mistyped)
Summary:
The new `ViewabilityConfig` API has a typo:
`itemVisiblePercentThreashold` should be `itemVisiblePercentThreshold`.

Thought it would be good to fix this before people start depending on a property containing a typo :-)

Updated tests to match.
Closes https://github.com/facebook/react-native/pull/12593

Differential Revision: D4619798

Pulled By: ericvicenti

fbshipit-source-id: 0aa8b6cf9ae7e5638607195759e4bd51140667fe
2017-02-27 14:04:57 -08:00
Spencer Ahrens f2687bf4b6 configurable Viewability
Reviewed By: yungsters

Differential Revision: D4577395

fbshipit-source-id: 9b9099f5bd5f8fe20b5c24eab7e43f298ba665d9
2017-02-21 17:14:59 -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