iOS Views and Animations: Learning by Stealing
In this course we'll deconstruct a complex button from a popular iOS VPN app, and figure out how to rebuild it. Covering Core Animation, UIView and Swift. By Sam Davies.
Why should you steal UI from other apps? How should you start? Discover answers to these questions, and see the topics you'll cover in this course.
Start small by creating just the circle at the center of the ExpressVPN button. See how to use CAShapeLayer and how subtle shadows add punch.
Discover why using lazy properties in Swift can improve readability, before finishing off the central button with an addional circular shape layer.
Time for a second layer type—you'll discover how you can use a gradient layer to add subtle variation to your design, as you start to create the outer shield.
See how to use layer masking together with bezier paths to turn the background gradient layer into the large shield shape that sits behind the button.
Discover how you can combine a gradient layer, some simple masking with shape layers, and basic animation to create the cool spinner effect.
Analyze how the on/off animation appears to behave, before breaking it down and recreating it with shape layers, and core animation.
Recap what you've learned throughout this course, and reflect on why stealing UI from other apps is a good idea. See how to apply the same techniques yourself.