1
xiaoshan5733 284 天前
现成的确实没有,可能需要使用基础库自己去实现 https://github.com/software-mansion/react-native-reanimated
|
2
mouyase OP @xiaoshan5733 自己实现过了,现在的问题是如果在 onScroll 的时候移动 Tab 的位置/扩大 Tab 的尺寸,会导致 ScrollView 的坐标产生改变,就会出现用户向上划了 1 像素,然后 View 跟着向上移动了 1 像素,因为 View 向上了 1 像素,所以 onScroll 事件相当于又向下了 1 像素。结果就会出现缓慢滑动的时候,整个 View 都在上下抖(因为相当于 onScroll 同时触发了上下两个坐标,导致循环渲染)
|
3
mouyase OP |
5
for4die 284 天前
有个技巧就是改变缩放的中心点,别的都没什么难的
|
6
mouyase OP @for4die 感谢,不过如果仅仅是 View+SrcollView 的组合,本身我已经可以实现了。问题在于一个在 Scroll 外部的 View ,并且还要支持 tab ,这两点加起来我就搞不定了
|
7
9i5NngJHI4P7dm42 284 天前
跟我遇到了同样的问题😂所以我后来选择了 flutter
|
8
AvilCore 284 天前 via Android
rn 库方面,优先考虑用 expo 和他的组件,比如 fastimage 已经被抛弃,expo image 是他的上位替换
另外比如瀑布流,搜索 infinite scroll 会有很多 rn 实现的结果,而国内生态大多偏向 flutter 找不到也正常 |
10
codehz 283 天前
其实可以换一个思路,用 bottom sheet 去实现这个
@gorhom/bottom-sheet 这个库的 bottom sheet 支持 tab 和多个 scrollview (需要用它包里的或者用它提供的 hooks ,当然也不是非常完美,但我觉得很大程度上能用了) 然后虽然名字是 bottom sheet 但它可以常开,backdrop 也能放 header (和动画),可以说一次解决了可收缩 header 和 tab 的需求 |
11
iliaoliao 283 天前
前几个月也有在打算在 v2fun 实现这个功能,琢磨了挺久也没整明白😂。
|
12
jinliming2 283 天前 via iPhone 1
|
13
iliaoliao 282 天前
@jinliming2 不是的,你可以看看 twitter 效果
|
14
jinliming2 282 天前
@iliaoliao emmmmm ,楼主第一个链接里贴的视频不就是 B 站 App 的效果么,我照着 B 站 App 实现的。。。
没太明白 twitter 效果是指?手机 App 上貌似没有看到 header 相关的效果? |
15
iliaoliao 282 天前
@jinliming2 没看到视频,我想的是 twitter 首页 header 的收缩效果呢😂。
@mouyase 楼主也可以参考 v2fun 用户详情里的实现,效果和视频里的差不多。 源码地址: https://github.com/liaoliao666/v2ex/blob/main/screens/MemberDetailScreen.tsx |
16
jinliming2 282 天前 via iPhone
@iliaoliao 是 twitter 的手机端吗? iOS App 的 header 很简单啊,下拉就就跟着下来,上滑就上去,react 官方文档的 Animated 里都有那个的示例的啊?最多就是加个阈值延迟
|
17
iliaoliao 282 天前
@jinliming2 官网上示例我找不到,是多个 scrollView 的吗。
其实如果你能实现的话可以考虑整个开源项目,我直接用你的。不整的话等我我闲下来估计也会做个这种开源,应该会有不少 star😂。 |
19
mouyase OP @jinliming2 大佬是真的牛!这个应该就是想要实现出来的效果了,正在看源码学习中。
|
20
Cookmilk 78 天前 via iPhone
|