延迟动画播放

时间:2019-06-30 21:32:17

标签: react-native animation react-animated

在ScrollView中,我渲染了一个循环,该循环渲染了我创建的某些组件。我试图通过动画将它们很好地加载到屏幕上。我想根据循环中的索引来增加每个组件的延迟。

结果是所有组件都同时加载。

<Animated.View>
  data.slice().map((section, sectionIndex) => {
    return (
      <Animated.View key={section.key}>
        {this.renderSectionHeader(section)}
        {section.data.map((item, index) => {
          return (
            <Animated.View 
              key={`${item.sort}${index}`}
              animation={'fadeIn'}
              useNativeDriver={true}
              delay={200*index}>
                {this.renderItem(item, index)}
            </Animated.View>
          )
        })}
      </Animated.View>
    )
 })}
</Animated.View>

0 个答案:

没有答案