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 start building our FavoriteBook app. So, in order to do that, I'm going to go ahead and 'Create a new Xcode project'. And, of course, I'm going to go with 'Single View App' one more time and don't forget to check this 'Use SwiftUI' box and this will be our 'FavoriteBook'. So, here you go. Now, I'm going to place this under my 'iOS complete' folder and let me make this into a full screen. So remember, the app, we have two screens in which we have the list and we have the details of the selected element, right? But, before we go on with the list and the other design, we have to create our models. So, I'm going to create my model first and I'm going to build my way up from there. And in order to do that, I'm going to work with structs. I'm going to create another Swift file in which we will have our structs. And yes, we will have more than one struct so that we can work this with very structurally and very professionally. Of course, along the way, we're going to have to deal with images, we're going to have to deal with some sample codes and it's going to take time. But, I believe, this will be a good practice for you to understand how to work with structures; how to work with structs. So, let's create an 'New File' and I'm going to go for 'Swift File' rather than SwiftUI View because we're not going to need any views inside of our model. And this time, I'm going to call this 'FavoriteModel'. Of course, you can call this Favorites as well, but I'm going to be explicit over here and I'm going to call this 'FavoriteModel'. So, in here, we have the Foundation and we're just going to have our struct. So remember, how we create struct. It's actually very similar to the classes. All you have to do is just come over here and write 'struct' and write your struct name. So, in our case, it's 'FavoriteModel'. But, I want to make this 'FavoriteModel : Identifiable'. We have talked about this before. Remember, how we had to give a manual ID when we deal with forEach loop or for list. Now, if we do this as an Identifiable struct, then we can just keep that step because this will be identifiable. And, if you cannot reach the Identifiable, maybe then, you would have to import this 'SwiftUI'. But, if you can reach, it doesn't matter. And all you have to do to make your struct identifiable to have is just to have an id in your struct as an attribute or as a property. So, come over here and say, 'var id', and this error will go away. So, you can have your id in some different ways. Like, you can come over here and say, 'id = UUID'. And remember, what is a UUID? It is universally unique ID. So, every time you create an instance of this struct, it will just assign a universal unique ID to that object. So, that you will have a made up string; you will have a made up UUID. And you can do it like an integer as well. But this time, you would have to manually give some IDs like zero, one, two, three. So, I'm not going to do that. Rather, I'm just going to say, 'UUID', and Swift will take care of this for me. So, inside of my FavoriteModel, I'm going to have a title and this title will refer to my titles in the lists. So, remember our titles like FavoriteMovies, FavoriteBands, Favorite, I don't know if you want to have another example, like FavoriteBooks. So, this will be our title. So, this will be like the categories that we're going to work with. And inside of that categories, we're going to have some 'elements'. And, in fact, I'm going to create another struct to have elements because we're going to have some properties too in our elements as well, like an image, like a description, like a name. So, you have seen how this app works. We click on 'Metallica' and we see the image, we see the description, and we see the name of the Metallica. So, let's create another 'struct' for that. And you can just call this something like 'FavoriteElements'. And you have to make this 'Identifiable' as well. And over here, you have to just say, 'var id = UUID' one more time because this is identifiable. So, I'm going to have a 'name : String'. I'm going to have an 'imagename : String'. And again, I'm going to have a 'description : String'. So, I can come over here and say this will be an array of FavoriteElements. So, if I can open this array, this one, 'FavoriteElements'. So, our FavoriteModel will have a title and a FavoriteElements array. So, maybe if I can create one example, you would understand it much better. So, let's come down here and try to create our FavoriteMusicians or FavoriteBands. Of course, I'm going to start with Metallica over here as usual. So, I'm going to say, 'let metallica = FavoriteElements'. So, I named it Element but it doesn't matter. As you can see we get two options: one asking for id and one that does not. So, I'm going to choose the second one. If you choose the first one, you can write UUID with a parenthesis and it won't matter. So, for 'imagename: "metallica"'. And for 'description,' I'm just going to say something like No. 1 band or No. 1 musician. So, for the 'imagename', we're going to have to find an image and name it Metallica later on. So, I believe, we have this image because we have previously used it in the same section. So, I'm going to bring in the Metallica image and here you go. Now, I can create this. I can create this with image as well. Of course, we are not going to need image for until like two or three lectures right now, but note that we have to find images for other musicians as well, like 'megadeth'. Let's call this 'ironmaiden'. And let's change this a little bit. So, let's make this 'No. 2', let's make this 'No. 3'. And for 'imagename: "megadeth"'. And this time, I'm going to go for '"ironmaiden"'. And let's change the names as well. So, this is '"Megadeth"' and this is '"Ironmaiden"'. And let's create our FavoriteModel right now for our FavoriteMusicians. So, I'm going to call this something like favoriteBands, or favoriteMusician, Model, I don't know. I'm going to call this 'favoriteBands' and we're going have to give some title, which is '"FavoriteBands"'. And we're going to have to give some array of 'elements'. And inside of that array, I'm going to have 'metallica', I'm going to have 'megadeth', and I'm going to have 'ironmaiden'. Now, here you go. This is how our struct will look like. Of course, I'm not going to stop here because, I believe, we need to have at least one more example to understand this app in a better way. So, I'm going to create a FavoriteMovie, FavoriteModel, and FavoriteElements as well so that we will have enough examples. And we're going to have to find some related images as well. So, I'm going to stop here and continue within 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.