diff --git a/GiftedListView.js b/GiftedListView.js
index 565eedf..986897f 100644
--- a/GiftedListView.js
+++ b/GiftedListView.js
@@ -10,6 +10,7 @@ var {
Text
} = React;
+
// small helper function which merged two objects into one
function MergeRecursive(obj1, obj2) {
for (var p in obj2) {
@@ -31,39 +32,8 @@ var GiftedSpinner = require('react-native-gifted-spinner');
var GiftedListView = React.createClass({
getDefaultProps() {
- var customStyles = {
- separator: {
- height: 1,
- backgroundColor: '#CCC'
- },
- refreshableView: {
- height: 50,
- backgroundColor: '#DDD',
- justifyContent: 'center',
- alignItems: 'center',
- },
- actionsLabel: {
- fontSize: 20,
- },
- paginationView: {
- height: 44,
- justifyContent: 'center',
- alignItems: 'center',
- backgroundColor: '#FFF',
- },
- defaultView: {
- justifyContent: 'center',
- alignItems: 'center',
- padding: 20,
- },
- defaultViewTitle: {
- fontSize: 16,
- fontWeight: 'bold',
- marginBottom: 15,
- },
- };
-
return {
+ customStyles: {},
initialListSize: 10,
firstLoader: true,
pagination: true,
@@ -74,100 +44,39 @@ var GiftedListView = React.createClass({
withSections: false,
onFetch(page, callback, options) { callback([]); },
- paginationFetchigView() {
- return (
-
-
-
- );
- },
- paginationAllLoadedView() {
- return (
-
-
- ~
-
-
- );
- },
- paginationWaitingView(paginateCallback) {
- return (
-
-
- +
-
-
- );
- },
- refreshableFetchingView() {
- return (
-
-
-
- );
- },
- refreshableWillRefreshView() {
- return (
-
-
- ↻
-
-
- );
- },
- refreshableWaitingView(refreshCallback) {
- if (Platform.OS !== 'android') {
- return (
-
-
- ↓
-
-
- );
- } else {
- return (
-
-
- ↻
-
-
- );
- }
- },
- emptyView(refreshCallback) {
- return (
-
-
- Sorry, there is no content to display
-
-
-
-
- ↻
-
-
-
- );
- },
- renderSeparator() {
- return (
-
- );
- },
+ paginationFetchigView: null,
+ paginationAllLoadedView: null,
+ paginationWaitingView: null,
+ refreshableFetchingView: null,
+ refreshableWillRefreshView: null,
+ refreshableWaitingView: null,
+ emptyView: null,
+ renderSeparator: null,
};
},
+ propTypes: {
+ customStyles: React.PropTypes.object,
+ initialListSize: React.PropTypes.number,
+ firstLoader: React.PropTypes.bool,
+ pagination: React.PropTypes.bool,
+ refreshable: React.PropTypes.bool,
+ refreshableViewHeight: React.PropTypes.number,
+ refreshableDistance: React.PropTypes.number,
+ sectionHeaderView: React.PropTypes.func,
+ withSections: React.PropTypes.bool,
+ onFetch: React.PropTypes.func,
+
+ paginationFetchigView: React.PropTypes.func,
+ paginationAllLoadedView: React.PropTypes.func,
+ paginationWaitingView: React.PropTypes.func,
+ refreshableFetchingView: React.PropTypes.func,
+ refreshableWillRefreshView: React.PropTypes.func,
+ refreshableWaitingView: React.PropTypes.func,
+ emptyView: React.PropTypes.func,
+ renderSeparator: React.PropTypes.func,
+ },
+
_setY(y) { this._y = y; },
_getY(y) { return this._y; },
_setPage(page) { this._page = page; },
@@ -176,6 +85,130 @@ var GiftedListView = React.createClass({
_getRows() { return this._rows; },
+ paginationFetchigView() {
+ if (this.props.paginationFetchigView) {
+ return this.props.paginationFetchigView();
+ }
+
+ return (
+
+
+
+ );
+ },
+ paginationAllLoadedView() {
+ if (this.props.paginationAllLoadedView) {
+ return this.props.paginationAllLoadedView();
+ }
+
+ return (
+
+
+ ~
+
+
+ );
+ },
+ paginationWaitingView(paginateCallback) {
+ if (this.props.paginationWaitingView) {
+ return this.props.paginationWaitingView(paginateCallback);
+ }
+
+ return (
+
+
+ +
+
+
+ );
+ },
+ refreshableFetchingView() {
+ if (this.props.refreshableFetchingView) {
+ return this.props.refreshableFetchingView();
+ }
+
+ return (
+
+
+
+ );
+ },
+ refreshableWillRefreshView() {
+ if (this.props.refreshableWillRefreshView) {
+ return this.props.refreshableWillRefreshView();
+ }
+
+ return (
+
+
+ ↻
+
+
+ );
+ },
+ refreshableWaitingView(refreshCallback) {
+ if (this.props.refreshableWaitingView) {
+ return this.props.refreshableWaitingView(refreshCallback);
+ }
+
+ if (Platform.OS !== 'android') {
+ return (
+
+
+ ↓
+
+
+ );
+ } else {
+ return (
+
+
+ ↻
+
+
+ );
+ }
+ },
+ emptyView(refreshCallback) {
+ if (this.props.emptyView) {
+ return this.props.emptyView(refreshCallback);
+ }
+
+ return (
+
+
+ Sorry, there is no content to display
+
+
+
+
+ ↻
+
+
+
+ );
+ },
+ renderSeparator() {
+ if (this.props.renderSeparator) {
+ return this.props.renderSeparator();
+ }
+
+ return (
+
+ );
+ },
+
getInitialState() {
if (this.props.refreshable === true && Platform.OS !== 'android') {
@@ -306,25 +339,25 @@ var GiftedListView = React.createClass({
_renderRefreshView() {
switch (this.state.refreshStatus) {
case 'fetching':
- return this.props.refreshableFetchingView();
+ return this.refreshableFetchingView();
break;
case 'willRefresh':
- return this.props.refreshableWillRefreshView();
+ return this.refreshableWillRefreshView();
break;
default:
- return this.props.refreshableWaitingView(this._onRefresh);
+ return this.refreshableWaitingView(this._onRefresh);
}
},
_renderPaginationView() {
if ((this.state.paginationStatus === 'fetching' && this.props.pagination === true) || (this.state.paginationStatus === 'firstLoad' && this.props.firstLoader === true)) {
- return this.props.paginationFetchigView();
+ return this.paginationFetchigView();
} else if (this.state.paginationStatus === 'waiting' && this.props.pagination === true && (this.props.withSections === true || this._getRows().length > 0)) {
- return this.props.paginationWaitingView(this._onPaginate);
+ return this.paginationWaitingView(this._onPaginate);
} else if (this.state.paginationStatus === 'allLoaded' && this.props.pagination === true) {
- return this.props.paginationAllLoadedView();
+ return this.paginationAllLoadedView();
} else if (this._getRows().length === 0) {
- return this.props.emptyView(this._onRefresh);
+ return this.emptyView(this._onRefresh);
} else {
return null;
}
@@ -370,10 +403,44 @@ var GiftedListView = React.createClass({
scrollEnabled={true}
canCancelContentTouches={true}
+ renderSeparator={this.renderSeparator}
+
{...this.props}
/>
);
},
+
+ defaultStyles: {
+ separator: {
+ height: 1,
+ backgroundColor: '#CCC'
+ },
+ refreshableView: {
+ height: 50,
+ backgroundColor: '#DDD',
+ justifyContent: 'center',
+ alignItems: 'center',
+ },
+ actionsLabel: {
+ fontSize: 20,
+ },
+ paginationView: {
+ height: 44,
+ justifyContent: 'center',
+ alignItems: 'center',
+ backgroundColor: '#FFF',
+ },
+ defaultView: {
+ justifyContent: 'center',
+ alignItems: 'center',
+ padding: 20,
+ },
+ defaultViewTitle: {
+ fontSize: 16,
+ fontWeight: 'bold',
+ marginBottom: 15,
+ },
+ },
});