react-native-community/discussions-and-proposals

Add a matching sliding control attribute to the pagingEnabled attribute of the ScrollView component and the FlatList component on the Android side

418442040 opened this issue · 0 comments

[First of all, let me explain, I am Chinese, I don't know English, my language is directly translated from Chinese to English, some grammatical mistakes, I hope you can understand, thank you!
The problem I want to say is that I am using react-native to develop a list of swiping videos similar to tiktok. I use the pagingEnabled property of the FlatList component to open the paging sliding page. It performs very well on the ios side, and the sliding is very smooth. It is basically the same as tiktok. The same effect, but the sliding on the android side is not very ideal. It takes a long distance to jump to the next page. I did not find the corresponding attribute to control the sliding distance, so I used the snapToInterval attribute And the snapToAlignment attribute allows each swipe to jump directly to the next page. The sliding effect is ok, but the page is too fast when it jumps, and the fluency is not as good as the ios end. Using the decelerationRate attribute can not control this speed very well !

The following is the effect of directly opening pagingEnabled={true}, and it takes a long distance to jump to the next page

ec0c78c1e004f5e4c03a33f203f5caf1.mp4

The following is the effect of setting the snapToInterval={itemHeight} attribute and snapToAlignment={"start"} attribute, which can achieve the effect of TikTok. However, the video switching speed is too fast and not very smooth, and there may even be some strange problems. Sliding too fast can cause the jump distance to be too long

97148df6d047d7d540af70a947bada97.mp4