shoutem - 在 s3 图像上使用来自 @shoutem/animation 的淡入动画

Question

我正在显示来自 S3 的图像。我希望它们在加载时淡入。这似乎应该是一个简单的请求。如果可能的话，有人可以给我一些指导吗？

谢谢！

Answer 1

您可以只使用 aTimingDriver为组件设置动画。

import React from 'react';
import { View, Easing } from 'react-native';
import { TimingDriver, FadeIn } from '@shoutem/animation';

class Screen extends React.Component {
  render() {
    driver = new TimingDriver({
      duration: 400 // 250 by default,
      easing: Easing.inOut // Easing.cubic is passed by default
      delay: 0 // 0 by default
    });

    return (
      <View>
        <FadeIn driver={driver}>
          {/* Some components to fade in with time passing */}
        </FadeIn>
      </View>
    )
  }
}

您可以在此处找到有关该工具包的动画部分的更多信息。