React Native) 로딩화면 페인드인 구현

앞에 로딩화면 구현한 것에

로딩페이지에서 이 코드를 더해야 한다

 

import React from "react";
import { StyleSheet, Text, View, Image, Animated } from "react-native";

export default class LoadingScreen extends React.Component {
state = {
animation: new Animated.Value(1),
};
componentDidMount() {
setTimeout(() => {
this.setState(
Animated.timing(this.state.animation, {
toValue: 0,
duration: 2000,
}).start()
);
}, 1000);
}

render() {
const animationStyles = {
opacity: this.state.animation,
return (
  <View style={styles.container}>
    <Animated.View style={[animationStyles]}>
      <Image
        style={styles.logo}
        source={require("./components/Icons/logo/logo1.png")}
      />
    </Animated.View>
  </View>
);
};

}
}