4 Commits

Author SHA1 Message Date
Angela Hess
9e2d3c5d0d Add row style for multi-column lists
Reviewed By: sahrens

Differential Revision: D4545238

fbshipit-source-id: e85cd598b6776e104bdcaf1e74dd46218785f536
2017-02-11 14:22:29 -08:00
Spencer Ahrens
906e579dd7 numColumns default
Reviewed By: blairvanderhoof

Differential Revision: D4545192

fbshipit-source-id: 75a1e9eb27f0d3cab0c78b44d842847b64849dba
2017-02-10 18:15:23 -08:00
Spencer Ahrens
4388783a21 Add multi column support
Reviewed By: angelahess

Differential Revision: D4540706

fbshipit-source-id: d8f84d13484d50692405c4a461c8d6c0e49f2cc9
2017-02-10 10:06:31 -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