mirror of
https://github.com/status-im/react-native.git
synced 2025-01-18 21:40:57 +00:00
f7ce0c1c2f
Summary: Add the possibility to define a progress view top offset to RefreshControl on android. As i comment in #6740, contentInset does the trick on IOS. Looking android documentation seems that exists a possible solution: http://developer.android.com/reference/android/support/v4/widget/SwipeRefreshLayout.html#setProgressViewOffset(boolean, int, int) This pull request implement that but keeping it simple, only a top offset. For example, now we could put navigation bar over the scrollview (or listview) and define a progressViewOffset on RefreshView in order to start behind the navigation. At this point we could make some kind of coordinator layout to hide/show navigation on scroll. To maintain the default behavior, start point is equal to start point minus progress circle diameter in order to create that progress circle before the start point. Closes https://github.com/facebook/react-native/pull/6759 Differential Revision: D3240664 Pulled By: mkonicek fb-gh-sync-id: ccf866272e871811c1c6dcc2a34f5c217967feee fbshipit-source-id: ccf866272e871811c1c6dcc2a34f5c217967feee
108 lines
3.2 KiB
JavaScript
108 lines
3.2 KiB
JavaScript
/**
|
|
* Copyright (c) 2015-present, Facebook, Inc.
|
|
* All rights reserved.
|
|
*
|
|
* This source code is licensed under the BSD-style license found in the
|
|
* LICENSE file in the root directory of this source tree. An additional grant
|
|
* of patent rights can be found in the PATENTS file in the same directory.
|
|
*
|
|
* @providesModule PullToRefreshViewAndroid
|
|
*/
|
|
'use strict';
|
|
|
|
var ColorPropType = require('ColorPropType');
|
|
var React = require('React');
|
|
var RefreshLayoutConsts = require('UIManager').AndroidSwipeRefreshLayout.Constants;
|
|
var View = require('View');
|
|
|
|
var onlyChild = require('onlyChild');
|
|
var requireNativeComponent = require('requireNativeComponent');
|
|
|
|
var NATIVE_REF = 'native_swiperefreshlayout';
|
|
|
|
/**
|
|
* Deprecated. Use `RefreshControl` instead.
|
|
*
|
|
* React view that supports a single scrollable child view (e.g. `ScrollView`). When this child
|
|
* view is at `scrollY: 0`, swiping down triggers an `onRefresh` event.
|
|
*
|
|
* The style `{flex: 1}` might be required to ensure the expected behavior of the child component
|
|
* (e.g. when the child is expected to scroll with `ScrollView` or `ListView`).
|
|
*/
|
|
var PullToRefreshViewAndroid = React.createClass({
|
|
statics: {
|
|
SIZE: RefreshLayoutConsts.SIZE,
|
|
},
|
|
|
|
propTypes: {
|
|
...View.propTypes,
|
|
/**
|
|
* Whether the pull to refresh functionality is enabled
|
|
*/
|
|
enabled: React.PropTypes.bool,
|
|
/**
|
|
* The colors (at least one) that will be used to draw the refresh indicator
|
|
*/
|
|
colors: React.PropTypes.arrayOf(ColorPropType),
|
|
/**
|
|
* The background color of the refresh indicator
|
|
*/
|
|
progressBackgroundColor: ColorPropType,
|
|
/**
|
|
* Progress view top offset
|
|
* @platform android
|
|
*/
|
|
progressViewOffset: React.PropTypes.number,
|
|
/**
|
|
* Whether the view should be indicating an active refresh
|
|
*/
|
|
refreshing: React.PropTypes.bool,
|
|
/**
|
|
* Size of the refresh indicator, see PullToRefreshViewAndroid.SIZE
|
|
*/
|
|
size: React.PropTypes.oneOf(RefreshLayoutConsts.SIZE.DEFAULT, RefreshLayoutConsts.SIZE.LARGE),
|
|
},
|
|
|
|
componentDidMount: function() {
|
|
console.warn('`PullToRefreshViewAndroid` is deprecated. Use `RefreshControl` instead.');
|
|
},
|
|
|
|
getInnerViewNode: function() {
|
|
return this.refs[NATIVE_REF];
|
|
},
|
|
|
|
setNativeProps: function(props) {
|
|
let innerViewNode = this.getInnerViewNode();
|
|
return innerViewNode && innerViewNode.setNativeProps(props);
|
|
},
|
|
|
|
render: function() {
|
|
return (
|
|
<NativePullToRefresh
|
|
colors={this.props.colors}
|
|
enabled={this.props.enabled}
|
|
onRefresh={this._onRefresh}
|
|
progressBackgroundColor={this.props.progressBackgroundColor}
|
|
ref={NATIVE_REF}
|
|
refreshing={this.props.refreshing}
|
|
progressViewOffset={this.props.progressViewOffset}
|
|
size={this.props.size}
|
|
style={this.props.style}>
|
|
{onlyChild(this.props.children)}
|
|
</NativePullToRefresh>
|
|
);
|
|
},
|
|
|
|
_onRefresh: function() {
|
|
this.props.onRefresh && this.props.onRefresh();
|
|
this.setNativeProps({refreshing: !!this.props.refreshing});
|
|
}
|
|
});
|
|
|
|
var NativePullToRefresh = requireNativeComponent(
|
|
'AndroidSwipeRefreshLayout',
|
|
PullToRefreshViewAndroid
|
|
);
|
|
|
|
module.exports = PullToRefreshViewAndroid;
|