Open bfp4 opened 3 years ago
I created this laoding icon a while back and tried using it in a new project. I for some reason won't work and I can't figure out why.
`
export default function Loading(props){ const flipAnim = { 0: { transform: [{rotate: "0deg"}] }, 0.25: { transform: [{rotate: "180deg"}] }, 0.5: { transform: [{rotate: "180deg"}] }, 0.75: { transform: [{rotate: "360deg"}] }, 1: { transform: [{rotate: "360deg"}] } } const fillAnim = { 0: { height: "0%" }, 0.25: { height: "0%" }, 0.5: { height: "100%" }, 0.75: { height: "100%" }, 1: { height: "0%" } } return ( <View style={{...styles.loadingCon, height: props.size}}> <Animatable.View style={styles.loader} animation={flipAnim} duration={2000} iterationCount="infinite" easing="linear" > <Animatable.View style={styles.loaderInner} animation={fillAnim} duration={2000} iterationCount="infinite" easing="linear" > </Animatable.View> </Animatable.View> </View> ) } const styles = StyleSheet.create({ loadingCon: { justifyContent: "center", alignItems: "center" }, loader: { width: 40, height: 40, borderWidth: 5, borderColor: constansts.colors.blues, borderRadius: 4 }, loaderInner: { width: "100%", backgroundColor: constansts.colors.blues, } })`
I created this laoding icon a while back and tried using it in a new project. I for some reason won't work and I can't figure out why.
`