如何在 Lottie 上渲染组件

Question

有什么方法可以在 LottieView 上渲染组件，例如 React Native 中顶部的按钮和后台的 Lottie 动画

   <LottieView
    style={{ width: 400, height: 600 }}
    source={require('../components/user.json')}
    autoPlay
    loop
  >
    <Button
      onPress={onPressLearnMore}
      title='Learn More'
      color='#841584'
      accessibilityLabel='Learn more about this purple button'
    />
  </LottieView>

Answer 1

我通过这种方式在顶部使用按钮和文本，在背景上使用 lottieview 动画：

   return(
        <View style = {{width:'100%', height:'100%', backgroundColor:'white'}}>
            <LottieView source={require('../Animations/74468-rocket.json')} autoPlay loop></LottieView>
            <Text style= {{fontSize:32, fontWeight:'bold', marginTop:400}}>hello i am on top</Text>
            <Button
                title='Learn More'
                color='#841584'
                accessibilityLabel='Learn more about this purple button'
            />
        </View> 
    )

希望对你有所帮助..

如何在 Lottie 上渲染组件

How to render component over Lottie

animation

react-native

lottie