Swift: Animating a mask for a UIView

Swift: Animating a mask for a UIView

Animated Image

I recently stumbled upon a really excellent article online entitled “UIDynamics, UIKit or OpenGL? 3 Types of iOS Animations For the Star Wars.” A lot of great discussion about performance of interesting techniques in a iOS user interface. I read through it and without going to the Github repository to check out any code I decided to try to replicate that mask animation.

I am not a huge fan of Google’s Android Material Design, but the animated mask aspect of a user interaction is interesting, attention grabbing without being too heavy-handed, and playful. And it was a bit of a challenge as I have never tried masking anything at all in an iOS application.

By the way, I have a handy extension that you might love for use in Swift applications. It allows me to provide hex values to provide UIColor attributes to things.

Anyway, here is the full view controller class. The method close and showUnderView is where the masking action takes place. Make careful consideration of the order in which you add subviews. Here is an example of what I have going on.

 

Leave a Reply

Your email address will not be published. Required fields are marked *

Time limit is exhausted. Please reload CAPTCHA.