SwiftUI Crash Course
The course is part of this learning path
This course delves into SwiftUI, which you can use to create user interfaces for your apps. We're going to cover how to use it, how to create views, and how to leverage it to create responsive apps that work in all screen sizes.
This course is designed for anyone who wants to:
- Learn about iOS development and coding
- Move into a career as an iOS developer
- Master Swift skills
To get the most out of this course, you should have some basic knowledge of iOS.
Hi, within this lecture, we're going to create our second view and we're going to see how we can navigate from our first view to the second view. And in order to do that, I'm going to create my second view first, so come over here and say 'New file' and choose 'SwiftUI View' and I'm going to name mine DetailsView because we're going to show the details of the selected element inside of that view, okay? Once we do that, we get a brand new view and of course we're going to do some design over here, a user interface over here as well showing the image, the name, and the description of the selected item, but for right now, I'm just going to leave it as it is because first we have to understand how we can navigate from here to other view. And there are a couple of ways to do that and we're going to see the most common one which is a navigation link. So, we're going to wrap every element with a navigation link so that when we hit one of them, it will take us to the DetailsView.swift. So, in order to do that, I'm going to come over here to my ForEach and I'm going to write NavigationLink, okay? Once you do that, you can open a parentheses, and not lik but link, open a parenthesis to see the parameters. And for some reason it doesn't show up over here, so let me try it above so that you can see what it is asking for because it's important to see the parameter names. So, let me write NavigationLink over here and you will see that it will ask us for a destination, this one and a label. So, we're going to provide the destination as the destination view that we're going to go. And for label, of course we're going to provide what we want to show inside of that NavigationLink. So, our destination is the DetailsView, okay, so open and close parentheses and if you hit "Enter" over here, it will create a coding block for you in which you will display the text actually. So, let me take this from here and cut it and paste it over here and I'm going to take this text inside of my NavigationLink. So, it means that I'm wrapping everything around with a NavigationLink inside of this list, of course not the section names, but just the element names, okay? So, as you can see now it's chosen green and if I run this in Live Mode, I cannot even click one of them because we cannot use NavigationLink like this. In order to use a NavigationLink, we have to have a navigation view. This is like embedding in a Navigation Controller inside of your View Controller in the main.storyboard. So, you have a navigation bar, you have a navigation controller and when you go to another view, you will get a free back button to navigate back. That's exactly what we are trying to do here. We're going to have a navigation view before everything else inside of our body and we're going to use our NavigationView. So, let's call this NavigationView. Let's open the parentheses and close it over here. Now you will see it will push down a little bit because we have our navigation bar right now and if we run this, now we get to click each of the elements. So, here we go, it takes us to the DetailsView. Let's click each of them to see if they work or not. Here you go, now they work, they take us to the DetailsView and I cannot even click on the section names because I wrapped around text element.name only, okay? And if you come over here to that list, you can have a navigation bar. This one okay, navigation bar title I mean, you can go for navigation bar title and in the navigation bar title, you can actually write whatever you want, something like favorite book will do the job so that you will have a title of your own app, so that's cool. Now all we have to do is just to figure out how to pass information, how to pass the selected model selected instance to the other view so that we can use its attributes, use its properties in order to display the image, display the name, and the description. Let's do that in the next lecture.
Atil is an instructor at Bogazici University, where he graduated back in 2010. He is also co-founder of Academy Club, which provides training, and Pera Games, which operates in the mobile gaming industry.