This section provides hands-on walkthroughs for how to build the user interface of popular apps and screens with SwiftUI.
How to build the beautiful Weather app that first appeared in iOS 15.
We’re going to pull apart then rebuild the user interface from the Weather app that shipped with iOS 15 onwards. The app itself is remarkably big, but we’re going to cherry pick all the interesting bits – starting with clouds…
One of the most beautiful parts of the Weather app is the way it smoothly transitions between day and night – it doesn’t just go from black to blue, but instead mimics both sunrise and sunset, smoothly animating between the two. In this tutorial we’re going to recreate that same effect in our own app.
Now that we have a working day/night cycle, we’re going to follow that up with a subtle but beautiful effect: we’ll dynamically tint our clouds so they glow with sunrise and sunset, and look darker at night time.
At night the weather app usually shows stars, although if you live in my town chances are they are usually obscured by clouds! These stars aren’t as simple as you might think, so we need to get a bit creative…
One of the most fascinating and beautiful effects in the Weather app is the use of rain and snow: some particles that fall gracefully, and some that pile up on the user interface. Building this means taking your
Canvas skill up a notch, so let’s get into it…
Now that our Weather app supports both rain and snow, we can progress onto an even more advanced effect: making those weather particles appear to interact with the rest of our user interface! This uses a fun trick, but it takes a little thinking…
It’s time for us to build one of the most eye-catching effects in the weather app: the fantastic bolts of lightning that arc down, fork off randomly, and really add some drama to stormy days. This is going to be good…
Other popular user interfaces you might want to try.
In this article we’re going to look at how easy it is to rebuild the iOS lock screen. Yes, this isn’t hard, but along the way I think you’ll pick up a few cool SwiftUI tricks, including better date formatting, haptic buttons, and more.
In this article we’re going to look at how to rebuild the Tips app using SwiftUI, including how to make scrolling tabs of content, how to get a parallax scrolling effect, and more.
Few things in SwiftUI are quite so easy and yet quite so rewarding as rebuilding Apple’s welcome screens. In this article we’ll do just that, making it flexible enough to adapt easily for your own apps.