Getting Started

Installation


npm -i react-native-animated-ptr --save

Usage


import 'AnimatedPTR' from 'react-native-animated-ptr';

The structure is such that you start with the AnimatedPTR component, then nest inside it animations that either are included with the component, or a custom animation component that you can create. The component will render any component fed into it. The refresh state works in the same way the native React Native RefreshControl works: A isRefreshing boolean along with a callback is assigned to the component. When a threshold amount (minPullDistance) is hit and touch is released, the componet will call the onRefresh function, which you write that toggles isRefreshing state to true while logic is being run. To stop the refresh, set isRefreshing back to false.

Props

isRefreshing React.PropTypes.bool.isRequired
Refresh state set by parent to trigger refresh.

minPullDistance React.PropTypes.number
Sets pull distance for how far the Y axis needs to be pulled before a refresh event is triggered

onRefresh React.PropTypes.number
Callback for when the refreshing state occurs

contentComponent React.PropTypes.object.isRequired
The content view which should be passed in as a scrollable type (i.e ScrollView or ListView)

contentBackgroundColor React.PropTypes.object.isRequired
The content view's background color, not to be mistaken with the content component's background color

PTRbackgroundColor React.PropTypes.string
The pull to refresh background color.