1.同pull View一样,有下拉刷新效果,只不过pullView是基于ScrollView来实现的下拉,而Pull List则是基于List View来实现的。
2.引入pull List
import {PullList} from 'react-native-pull';
3.如下图:初始化List,并注册所需要的事件,这些事件分别是:
onPulling: 处于pulling状态时执行的方法
onPullOk: 处于pullok状态时执行的方法
onPullRelease: 处于pullrelease状态时执行的方法,接受一个参数:resolve,最后执行完操作后应该调用resolve()。
onPushing: 当从下往上推时执行的方法,接受一个参数:gesturePosition。gesturePosition是json格式{x, y}对象,当从上往下拉时gesturePosition.y > 0,当从下往上推时gesturePosition.y < 0。
topIndicatorRender: 顶部刷新指示组件的渲染方法, 接受4个参数: ispulling, ispullok, ispullrelease,gesturePosition,你可以使用gesturePosition定义动画头部。
图一
onPullRelease定义下拉的事件,topIndicator里面定义三个下来状态,可以自定义这三种状态的样式,
图二
renderFooter,用来渲染底部加载更多时的样式,loadmore用来定义加载更多的动作,pressRow用来响应,点击列表某行时,会触发的动作。
图三
4.界面组件的渲染
图四