rilyu / teaset

A UI library for react native, provides 20+ pure JS(ES6) components, focusing on content display and action control.
MIT License
2.94k stars 481 forks source link

SegmentedView,Carousel模式嵌套FlatList会有问题 #210

Open jiasongs opened 6 years ago

jiasongs commented 6 years ago

SegmentedView,Carousel模式嵌套FlatList,在使用下拉刷新时,iOS表现没问题,安卓会左右滑动,导致刷新的动画卡顿。查看源码发现左右滑动的翻页是使用scrollTo改变x来实现的,这样的方案,在安卓上onScroll的回调不正确,下拉刷新时,有时x变化,有时x,y一起变化。在iOS上下拉刷新只是x变化。 建议:iOS原生ScrollView自带一个pagingEnabled属性,设置为true时就是翻页的效果,完全不用实现scrollTo来翻页。代码量和维护量会减少很多。 安卓上原生ScrollView没有pagingEnabled效果,但是RN有一个组件ViewPagerAndroid,专门针对横向滚动翻页的ScrollView。 故建议作者Carousel可以用上述方式实现,避免出现的bug(在issues里看到了相关的Bug)。

Covenanter commented 6 years ago

目前我也碰到这种情况,SegmentedView包裹flatList的时候,ios是正常的,在android真机上下拉刷新时,有时会出现下拉图标卡顿,有时跳转到第二个或者第三个tab页面。

fastalks commented 6 years ago

SegmentedView 左右切换的时候,特别卡

Covenanter commented 6 years ago

@wangfaguo 我直接使用ScrollableTabView 代替SegmentedView,特流畅

fastalks commented 6 years ago

@Covenanter ScrollableTabView tabbar的高度怎么设置?

Covenanter commented 6 years ago

@wangfaguo 重写bar组件

fastalks commented 6 years ago

<ScrollableTabView initialPage={0} renderTabBar={() => <ScrollableTabBar tabStyle={{height:44}} style={{height:44}} tabsContainerStyle={{height: 44}}/>} .....

刚弄好,这样就搞定了@ Covenanter