react-native-pull遇到的坑……未解决

这周要做一个页面,大概样式就是上半部分固定,下半部分可以滚动的,可滚动的部分需要添加一个下拉刷新功能,并且下拉刷新需要自定义(下拉后出现动画效果)

好了,本以为对于我来说这个功能很简单,用RN自带的RefreshControl组件就可以实现…………


但是……大家应该猜到了,这该死的RefreshControl不支持自定义样式啊…………我太高估RN现在的官方组件了,但是转念一想,这么常用的东西,第三方应该很多吧,于是乎,兴高采烈的去百度……没错,大家没看错,是去百度,本人一般习惯先百度,但就是这个习惯让我浪费了好多时间,原因……在下边

百度了许久,发现根本就没有第三方组件(坑坑爹啊),难道大家写RN都用的官方这个菊花刷新样式?不应该啊……啊……最后,再折腾了很久以后,我决定谷歌一下,结果,搜到了react-native-pull这个第三方,大概看了一下文档,发现满足我的要求,主要是可以自定义下拉样式。


顺利引入到工程中,然后参照demo,利用lottie将动画所用的json导入,实现了效果:


react-native-pull遇到的坑……未解决_第1张图片
自定义下拉

本以为效果实现了就大功告成了,但是,这东西引发了另一个问题,那就是我的页面(ScrollView)不能上拉了……经过查看这个第三方组件发现,作者压根就没有实现这个功能,难道RN程序员都是自己写上下拉组件的吗?最后的最后,我在作者源码中添加了一行代码,虽说还是感觉很别扭,但是起码可以拉动了……


react-native-pull遇到的坑……未解决_第2张图片
添加一行

如上图,就是复制了一行代码而已,具体的逻辑我也有些不想看了。

总而言之,这个下拉刷新组件,还不完善,希望以后自己写一个,真的是一个很常用的组件话说。但是所有的问题感觉都是因为手势冲突造成的,看来还得研究一下了。哎………未完待续!

你可能感兴趣的:(react-native-pull遇到的坑……未解决)