better-scroll
better-scroll copied to clipboard
ustbhuangyi
IOS设备滑动时，手动按住停止时有抖动现象
Version
undefined
Reproduction link
https://ustbhuangyi.github.io/better-scroll
Steps to reproduce
使用iphone设备，滑动时，手动触摸屏幕让滑动停止，会有抖动现象 测试的设备有iphone7、iphone8、iphonex，系统是ios11
复现的话，用iphone访问https://ustbhuangyi.github.io/better-scroll/#/examples/goods-list/en
What is expected?
不应该出现抖动现象
What is actually happening?
手动停止滑动时出现了抖动现象
这个问题如果使用 CSS3 Transition，基本无解，本质上就是让一个拥有 transition 动画的元素中途停止，解决方案是利用 getComputedStyle 去计算位置，然后动态设置。这个在 iOS 设备上是不准的，至少目前看来，苹果也没有解决这个问题。 有一个办法就是配置 useTransition 为 false，这样的话 better-scroll 的滚动就会基于 raf，变成了 JS 帧动画，好处是不会有抖动问题，也不会有快速滑动的白屏问题，但是缺点是如果是滚动性能没有使用 CSS3 动画流畅，但是如果是 iphoneX 这样的高端机器，JS 动画也很流畅。。
我最近也遇到类似问题，测试下来，useTransition设为false的话，iPhone7运行算流畅的，iPhoneX没有尝试，但是肯定更流畅，但是iPhone6就有明显卡顿，同时我做了一个测试，就是发现可能和iOS系统有关，同样的设置，useTransition为true，iOS11.2以上就有问题，是不是iOS11.2以上某些css属性有兼容问题了？或者是css动画有兼容问题？如果不设置eventPassthrough: "horizontal"是好的，但是我的需求就不满足了...
//这个设置在iOS11.2以上有问题，
//如果useTransition设为false，都正常，但是低版本iPhone，比如iPhone6，就会有卡顿
this.betterScroll = new BScroll(wrapper, {scrollbar: {fade: true}, eventPassthrough: "horizontal", useTransition: true});
大家是怎么解决这个问题的？
配置 useTransition 为 false,6s变为轻微抖动，iphonex不抖，然而也不算流畅。但是一旦把数据加到比较大，例如3000条，那么基本上划不动，安卓ios也划不动。如果配置useTransition为true，3000条也很流畅
无限滚动已经支持了，几万条数据也毫无压力，可以了解一下：https://ustbhuangyi.github.io/better-scroll/doc/zh-hans/options-advanced.html#infinityv1120
这个问题还有解决的可能吗，用手轻轻的滑动，页面会抖动的比较明显，让人会头晕。但是模拟器没有这个问题呢？
请问这个问题你有解决嘛？ @tansj526
在iOS抖动 问题可以保证 translateY(-617.314px) 值取整能极大 缓解。
https://github.com/ustbhuangyi/better-scroll/blob/0ffe17a3dbbd08aacbb8570953fd212e79ea5e05/packages/core/src/translater/index.ts#L52-L58
其实我主要想用上拉加载更多和下拉刷新，中间使用原生滚动，监听scroll位置，如果到了0的时候在注入下来刷新的CSS3 Transition， 滚动到底部的时候在触发上拉加载的css3d动画，这样是不是能解决一部分问题，或者能让我设置使用原生滚动,
期待解决这个难题
无限滚动已经支持了，几万条数据也毫无压力，可以了解一下：https://ustbhuangyi.github.io/better-scroll/doc/zh-hans/options-advanced.html#infinityv1120
链接失效了，有最新链接吗？
