diff --git a/Libraries/CustomComponents/ListView/ListView.js b/Libraries/CustomComponents/ListView/ListView.js
index 2cf967e50..f2c6c0627 100644
--- a/Libraries/CustomComponents/ListView/ListView.js
+++ b/Libraries/CustomComponents/ListView/ListView.js
@@ -35,9 +35,9 @@ var ScrollResponder = require('ScrollResponder');
var StaticRenderer = require('StaticRenderer');
var TimerMixin = require('react-timer-mixin');
+var isEmpty = require('isEmpty');
var logError = require('logError');
var merge = require('merge');
-var isEmpty = require('isEmpty');
var PropTypes = React.PropTypes;
@@ -174,6 +174,13 @@ var ListView = React.createClass({
* header.
*/
renderSectionHeader: PropTypes.func,
+ /**
+ * (props) => renderable
+ *
+ * A function that returns the scrollable component in which the list rows
+ * are rendered. Defaults to returning a ScrollView with the given props.
+ */
+ renderScrollComponent: React.PropTypes.func.isRequired,
/**
* How early to start rendering rows before they come on screen, in
* pixels.
@@ -229,6 +236,7 @@ var ListView = React.createClass({
return {
initialListSize: DEFAULT_INITIAL_ROWS,
pageSize: DEFAULT_PAGE_SIZE,
+ renderScrollComponent: props => ,
scrollRenderAheadDistance: DEFAULT_SCROLL_RENDER_AHEAD,
onEndReachedThreshold: DEFAULT_END_REACHED_THRESHOLD,
};
@@ -366,23 +374,24 @@ var ListView = React.createClass({
}
}
- var props = merge(
- this.props, {
- onScroll: this._onScroll,
- stickyHeaderIndices: sectionHeaderIndices,
- }
- );
+ var {
+ renderScrollComponent,
+ ...props,
+ } = this.props;
if (!props.scrollEventThrottle) {
props.scrollEventThrottle = DEFAULT_SCROLL_CALLBACK_THROTTLE;
}
- return (
-
- {header}
- {bodyComponents}
- {footer}
-
- );
+ Object.assign(props, {
+ onScroll: this._onScroll,
+ stickyHeaderIndices: sectionHeaderIndices,
+ children: [header, bodyComponents, footer],
+ });
+
+ // TODO(ide): Use function refs so we can compose with the scroll
+ // component's original ref instead of clobbering it
+ return React.cloneElement(renderScrollComponent(props), {
+ ref: SCROLLVIEW_REF,
+ });
},
/**