New Features for iOS 14: SwiftUI

There’s quite a few!

Image for post
Image for post
Photo by Ilyuza Mingazova on Unsplash

Apple have added a good number of features to SwiftUI at the recent WWDC conference.

So, without delay, we shall get stuck in!

Difficulty: Beginner | Easy | Normal | Challenging<br/>

This article has been developed using Xcode 12 beta

Prerequisites:

  • You will need to download the Xcode Beta (12) from Apple’s developer website
  • Be able to produce a “Hello, World!” Swift application

The examples

These code examples are presented in a List in a `SwiftUI` App. Take a look at the repo for the full low-down!

The mini-app looks something (exactly) like the following:

Image for post
Image for post

Before we get stuck in…

There is a new starting point for `SwiftUI` applications! It’s all very nice, and here instantiates a `ContentView()` instance and you can even perform some more setup within this `struct`. Awesome!

Image for post
Image for post

TextEditor

SwiftUI Now has TextEditor for handling scrolling text across multiple lines. Here the text is stored in yourText which is @State.

Image for post
Image for post

Which is produced by the following code:

Image for post
Image for post
Click for Gist

ProgressView

Wonderful! A ProgressView that acts as a progress bar — for example used to inform the user about the progress of their downloads!

Image for post
Image for post

And the code…

Image for post
Image for post
Click for Gist

ProgressSpinner

If you want a UIActivityMonitor you can use a ProgressView without a value. This is…a way of showing that some work is going on. Great!

Image for post
Image for post

And the code…

Image for post
Image for post
Click for Gist

Map

Want to embed a map a s a view? `SwiftUI` has you covered. I’ve set this particular map around where I’m staying at the moment — the wine’s opening soon so are you popping round? You can look up your own ‘abode’ by using Google to get your latitude and longitude for the coordinates and set a span for how zoomed out the map is.

Image for post
Image for post

With the code:

Image for post
Image for post
Click for Gist

Changes

You can attach onChange() to views so SwiftUI checks when changes have been made to a view, and runs code when changes are made.

For example, this will print name changes as they are typed:

Image for post
Image for post

With the code

Image for post
Image for post
Click for Gist

Link

Open a link in Safari? Now you can!

Image for post
Image for post

With the code:

Image for post
Image for post
Click for Gist

Color Picker

SwiftUI finally has a native ColorPicker! You’ll need to bind a value (something like a background color), but when you do you’ll get this quite wonderful graphic view for picking your color — isn’t that great?

Image for post
Image for post

With the code:

Image for post
Image for post
Click for Gist

PageTabViewStyle

If you want a swipable set of views this is your feature. Yes!!

Image for post
Image for post

And the code

Image for post
Image for post
Click for Gist

LazyVGridExampleView

You can set new containers for grid-based layouts setting childviews using LazyHGrid or LazyVGrid. Each of these elements are GridItems and can be set as follows:

Image for post
Image for post

And the code:

Image for post
Image for post
Click for Gist

Conclusion

I hope this article has helped you understand what is happening in this WWDC season, and has been of use to you. We’re sure to see more about how we can use Swift to make great apps during the remainder of WWDC and beyond…so as always:

Have fun!

If you’ve any questions, comments or suggestions please hit me up on Twitter

https://subscribe.to/swiftcodingblog/

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store