SwiftUI: Animation

In this course, we’re going to get you started animating all sorts of SwiftUI views. Why should you add animation to your apps? Well, animation is a brilliant way to wow your users, and make your app look and feel unique. Practically speaking, animation can grab a user’s attention, and allow them to focus on what’s most important. It can help your users intuitively understand how to navigate your app or alert them to important changes. By Jessy Catterwaul.

5 (2) · 2 Reviews

Download materials
Save for later
Share

Learning path

This is part of the iOS User Interfaces with SwiftUI learning path. View Path.

Who is this for?

This course is part of our iOS User Interfaces with SwiftUI learning path. You’re ready for this course if you’re working through that learning path in order, or you’re someone who has a bit of iOS and Swift experience: enough to know the basics of putting views onscreen in a SwiftUI-based app.

This course isn’t suited for advanced developers. If that’s you, check out our advanced video courses for more ways to level-up your developer skills!

Covered concepts

  • Animation
  • Rotating
  • Spinner View
  • Transition Effects
  • Interactive Animations

Part 1: Beginning with SwiftUI Animation

1
Toggle description

Every animation in SwiftUI is based on a simple principle: an animation is a change in value or state over time.

2
Animation 5:46
Toggle description

Marking properties as State will trigger a new snapshot of your view each time they’re modified. These can be automatically interpolated by SwiftUI!

3
Toggle description

An Animation is a small collection of data that defines the properties of a resulting animated effect. These include duration and timing curve information.

4
Toggle description

Create a tappable thumbnail image which will present a larger version of itself with a neat combination of animations.

5
Toggle description

You’ve animated quite a few properties at the point: including color, position, and scale. Your challenge is to add rotation to the mix.

6
Spinner 7:51
Toggle description

Over the rest of this part, you’ll build by working to build a modern, fluid spinner-view. You’ll lay the foundations for it in this episode.

7
Toggle description

Combine multiple animations into one amazing composition. Utilize transition effects, along with the Animations type you’ve learned about already.

8
Toggle description

At this point, you know plenty about creating animations with SwiftUI. But there is one last topic to cover: creating beautiful animations driven by the user.

9
Conclusion 0:50
Toggle description

Review some key points to keep in mind, as you continue exploring, regarding shapes, State, gestures, and other modifiers.