IFang Lee3 min

Swiftly Highlights: Code With SwiftUI Like a Pro

EngineeringMay 3, 2022

Hooray! Spring has arrived, and WWDC 2022 is coming! Apple officially announced it would be an online format on June 6–10, free for all developers to attend.

We were excited about the Apple Glasses. However, Gurman reconfirms in his latest newsletter that there are no plans to unveil the hardware at WWDC 2022. Wherever you watch from, get ready for a remarkable WWDC. But before that, let's immerse ourselves into the fantastic world of SwiftUI!

Property Wrappers

If a view needs to store data that it can modify, declare a variable with the @State property wrapper. Changing the User Interface when the state changes is one of the principles of SwiftUI: data drives the UI. But how to (not) initialize @State inside the View's init?

Surprisingly, there are many top answers to StackOverflow questions that are wrong. Valentin Radu shares some examples and gives us some solid insight into how @State and other DynamicProperty wrappers work and why you shouldn't initialize @State inside the view's init — instead, use @Binding, @ObservedObject, a combination between @Binding and @State, or even a custom DynamicProperty.

Adaptability

Apple said one of the most potent aspects of SwiftUI is how it adapts based on the context to build great-looking apps across all Apple platforms with the power of Swift — and as little code as possible. It is significant and can save tons of time. But if you're used to UIKit, it requires thinking a little differently to code with SwiftUI like a Pro.

How do you adapt your SwiftUI layouts for varying dynamic type sizes and available horizontal space? How do you build adaptive layouts with SwiftUI for varying dynamic type sizes and available horizontal space? In UIKit, we can switch the axis of a UIStackView, while in SwiftUI, we can switch between a HStack and VStack based on the horizontal size class that we get from the @Environment. SwiftUI Adaptive Stack Views demonstrate how to switch a horizontal layout to vertical when moving between regular and compact size classes to build a layout that works on both iPad (regular width) and iPhone (compact width).

Images

Almost every application contains some graphics. Downloading and caching images is an essential and the most common task of building apps.

Whether using 1st-party APIs like downloading images with URLSession and caching the downloaded images using NSCache or well-maintained popular 3rd-party libraries like Kingfisher and AlamofireImage, every developer has his/her way of handling remote images since there's no go-to standard. Antoine van der Lee shows us how to use AsyncImage in SwiftUI as a 1st-party solution to displaying remote images, using URLCache underneath. He also shares tips for picking a 3rd-party library with the following keys: Maintenance, Popularity, Code Quality and Dependencies.

Animations

Apple Human Interface Guidelines indicate that beautiful, subtle animation throughout iOS builds a visual sense of connection between people and content on screen. Do you have any creative animation ideas for your apps? You can check out Using Lottie and SwiftUI to Create Awesome Animations. Lottie is a mobile library for Android and iOS that natively renders vector-based animations and art in real-time with minimal code.

Simon Ng gives us detailed instructions on finding Lottie animation on LottieFiles and Drawer, importing and adding Lottie files, and loading animations remotely with SwiftUI. Animations look great and make your app shine, but sometimes you want to disable animations on a specific view since they don't look great when animating. For more on this, take a look at this article from SwiftLee.

And in case you're new to SwiftUI, Ray Wenderlich has a comprehensive tutorial to guide you through creating multiple platform Apps with SwiftUI.

Hope you enjoyed this month's SwiftUIly Swiftly Highlights! Catch you next time!

Share this article



Sign up to our newsletter

Monthly updates, real stuff, our views. No BS.