SwiftUI Tutorial – How to create a Loading/Activity Animations in Xcode 12 Part 4

Welcome to a new SwiftUI tutorial. Over the last few weeks we have created three dope loading animations! It is now time for our fourth animation.

Let’s get started 💯

We know by now we are working in the same Xcode project. Let’s open that up and get started.

We are going to be creating three circles for this animation. So let’s create a new sections and also add in HStack.

Now we are going to create our Circles, the Circles are going to have a fill and a frame.

Awesome, now we have done that we are going for a fade in and out sequence of animation with this so we need to set and scaleEffect to the shapes.

We are going to add an animation of easeInOut and have different delays of the shapes to create a fade in and out sequence.

All’s that is left now is adding some padding the the animation to bring it up form the bottom of the View!

Conclusion 👏

WOW!, we have now finished this tutorial on how to create a simple activity animation Part 4 using Xcode 12. We have learnt how to use a Section, .onAppear and much more. With this knowledge you should be able to create some awesome animations.

Here is the link to Part 1

Here is the link to Part 2

Here is the link to Part 3

If you would like the whole source code of this tutorial GitHub

I hope you have enjoyed this tutorial! If you want to learn more about SwiftUI and Neumorphism Design, check out my YouTube channel for other dope SwiftUI tutorials. Also make sure to keep yourself up to date with our upcoming tutorials on Instagram

Thanks you for reading this content.