如何在React Native中播放Lottie动画(.json文件)的片段

问题描述 投票:0回答:1

我只想使用Lottie视图在本机反应中播放动画的一部分速度= {1}时,长度约为5秒,我只想播放前3秒,然后转到下一个屏幕代码在下面

LogoScreen.js:

import React from 'react';
import { StyleSheet, View, Image, TextInput, StatusBar, Text } from "react-native";
import Icons from 'react-native-vector-icons/Ionicons';
import LottieView from "lottie-react-native";

export default class ChatScreen extends React.Component {

  onAnimationFinish = () => {
    this.props.navigation.navigate("Login")
  }
  render () {
    return (
      <View style={styles.container}>
        <StatusBar barStyle="light-content" backgroundColor="#161f3d" />
        <View>
          <LottieView
            source={require('../assets/animations/lottie/MotionCorpse-Jrcanest.json')}
            style={{ justifyContent: "center", alignSelf: "center", height: "100%", width: "100%" }}
            autoPlay
            loop={false}
            speed={1}
            onAnimationFinish={this.onAnimationFinish}
          />
        </View>
      </View>
    )
  }
reactjs react-native react-native-android react-native-ios lottie
1个回答
1
投票

好吧,您可以通过多种方式来实现,其中一种方式如下所示。

© www.soinside.com 2019 - 2024. All rights reserved.