Question

因此，当用户滚动特定的滚动视图时，我试图通过更改视图的高度来为视图添加动画。尽管有一些抖动，但在IOS上看起来还不错，但闪烁在Android上非常明显。这是我的代码。

滚动视图处于滚动状态

 onScroll={(e) => {         
     this.state.profileTabAnimatedValue.setValue(e.nativeEvent.contentOffset.y);
 }}

高度插值对象

const headerHeight = this.state.profileTabAnimatedValue.interpolate({
      inputRange: [0,1],
      outputRange: [1,100]
});

然后我将headerHeight应用于视图以调整其高度

Answer 1

尝试使用Animated事件方法：

onScroll={Animated.event(
  [{nativeEvent: {contentOffset: {y: this.state.profileTabAnimatedValue}}}]
)}

此外，如果您不希望出现诸如负高度之类的怪异行为，请将其添加到插值中：

const headerHeight = this.state.profileTabAnimatedValue.interpolate({
      inputRange: [0,1],
      outputRange: [1,100]
      extrapolate: 'clamp'
});

最后一件事是，您可以使用scrollEventThrottle来限制ScrollView上触发的事件，只需阅读this

滚动ScrollView时的动画高度

1 个答案: