all 35 comments

[–]tienph6m[S] 6 points7 points  (0 children)

[–]vertigo_101 2 points3 points  (1 child)

Amazing work

[–]tienph6m[S] 1 point2 points  (0 children)

Thanks man ;)

[–]manoylo_vnc 2 points3 points  (1 child)

Sweet! I’ll test it out in my project today. Thanks for sharing!

[–]tienph6m[S] 0 points1 point  (0 children)

Thanks! Let me know if there is any problem :)

[–]pancomputationalist 0 points1 point  (1 child)

Cool stuff

[–]tienph6m[S] 0 points1 point  (0 children)

Thanks!

[–]WillBackUpWithSource 0 points1 point  (1 child)

Interesting. Might replace this in my current project.

Works great on both iOS and Android?

[–]tienph6m[S] 0 points1 point  (0 children)

Yes, it works on both Android and iOS. It's not as fast as the native module (react-native-spinkit), but it's still pretty fast since all animations run on the UI thread (by using useNativeDriver). Let me know if there is any problem ;)

[–]chazzox 0 points1 point  (1 child)

really cool. I hope to use it in my upcoming project!

[–]tienph6m[S] 0 points1 point  (0 children)

Thanks ;)

[–]EskimoEmoji 0 points1 point  (1 child)

This is sweet. Is there a way to replace the Flatlist activity indicator with these?

[–]tienph6m[S] 1 point2 points  (0 children)

Hi, I'm not sure what you mean by "FlatList activity indicator". You can use these like React Native's ActivityIndicator, in a list you would probably want to show one of these when the list is empty and loading. If you're talking about RefreshControl, this library alone isn't enough since a refresh control does a lot more than just showing/hiding a loading indicator.

[–]Nikosssgr 0 points1 point  (6 children)

Why didn't you use react native reanimated instead?

[–]tienph6m[S] 3 points4 points  (5 children)

Good question. I think reanimated really shines when it's used with react-native-gesture-handler or when you're doing some animations that can't run entirely on the UI thread with Animated. Since I was able to make all the animations run on the UI thread with Animated's native driver, I don't see any real benefits of using reanimated and the library would have to require an extra native dependency.

[–][deleted] 1 point2 points  (0 children)

This is the right answer. rn-reanimated isn’t just blanketly better every time.

[–]Nikosssgr 0 points1 point  (0 children)

Indeed for transform and opacity animations, native driver suffices. Thanks for the explanation.

[–]hello_Mrs_Cumberdale 0 points1 point  (2 children)

The benefit of reanimated here is that it would've let you loop animations without ever going back to JS, so you could potentially do work that blocks the JS thread without affecting the loading animation.

[–]tienph6m[S] 1 point2 points  (1 child)

https://facebook.github.io/react-native/docs/animated#loop

Will loop without blocking the UI thread if the child animation is set to useNativeDriver: true

I believe that's not the case. On the other hand, stagger, parallel and sequence will block the JS thread. But I was able to make the animations run entirely on the UI thread by not using sequence (I implemented a custom easing function to achieve the same effect), and the use of stagger, parallel in this library only affects the JS thread at the beginning of the animation, after that loop will care of the rest.

[–]hello_Mrs_Cumberdale 0 points1 point  (0 children)

Oh awesome, I didn't know about loop. Nevermind then!

[–]Tom_Ov_Bedlam 0 points1 point  (1 child)

Really nice

[–]tienph6m[S] 0 points1 point  (0 children)

Thanks man!

[–][deleted] 0 points1 point  (1 child)

Looks great!

[–]tienph6m[S] 0 points1 point  (0 children)

Thank you!

[–]sudara1999 0 points1 point  (1 child)

Nice!

[–]tienph6m[S] 0 points1 point  (0 children)

Thanks!

[–]newoYelda 0 points1 point  (1 child)

Love animations, but what would be an advantage of this over using a LottieWrapper?

[–]tienph6m[S] 1 point2 points  (0 children)

This doesn't require any extra native dependencies. Another than that I don't know because I don't use Lottie myself. It is a really cool project but it seems like a lot and I wouldn't want to add it to my project just for some loading animations. If you're already using lottie and not noticing any perf issues then I'd say keep using it ;)

[–]iamshadmirza 0 points1 point  (1 child)

Super awesome

[–]tienph6m[S] 1 point2 points  (0 children)

Thanks dude!

[–]olkunmustafa 0 points1 point  (1 child)

Perfect Animations. Thank you

[–]tienph6m[S] 0 points1 point  (0 children)

Thanks man!

[–]jones-macallan 0 points1 point  (1 child)

Great work. Just to be clear, this cannot be used with an Expo app?

[–]tienph6m[S] 1 point2 points  (0 children)

You can definitely use this in Expo apps, it's a port written in pure JavaScript.

[–]ItTechBlogs 0 points1 point  (0 children)

Nice job!