What’s new in SwiftUI

Apple’s Worldwide Developer Conference (WWDC) kicked off this Monday, providing not just developers but everyone with 205 new videos over the course of the week. After watching the Keynote and the State of the Union, it is always a hustle to choice the first video when so many great things are available for free. I’ve already marked a dozens videos but decided to go with What’s new in SwiftUI because I wanted to see what has been in store for Text Fields as I was hoping to get a new UI component on iOS which not just has a prompt as placeholder but also a permanent label separated from the text field to provide users a better experience with less cognitive load when adding input. More on that later (when Xcode 13 beta is finally downloaded).

Here are some highlights I noted while watching the 40min-long session:

• 03:28: AsyncImage for asynchronous image loading: Just pass a URL and done, you can modify the appearance if needed, e.g. placeholder images, colored backgrounds, etc.
• 04:56: Concurrency-related .task modifier for automatic loading: Combine this with AsyncImage when having a feed which should automatically load new content when available; it also cancels the task if the users interacts aways from the respective view
• 04:14: .refreshable modifier to tell the app when some content can be refreshed, adding Pull-to-Refresh automatically to a List on iOS and iPadOS with just one line of code
• 10:02: .swipeActions modifier allows you to completely modify swipe actions, defining actions using buttons and customizing their color by using the .tint modifier (maybe now we can use a custom value for delete actions as well aka adjusted red tint), and actions can be either on the leading or trailing (default) side of the list item
• 19:46: SF Symbols 3 with 3,166 symbols with new rendering modes (hierarchical, palette) in addition to the current ones (monochrome, multicolor)
• 32:04: ToolbarItemGroup to place controls above they keyboard with modifiers to add arrows to focus the previous or next input component
• 34:46: Buttons! So many new ways of adding buttons, e.g. just add a .buttonStyle modifier to add different styles like bordered buttons, control their size, make them prominent and use the new defined color palette which comes with variations for Light and Dark Mode as well as different states (e.g. pressed)