Computed Properties in Swift 5 (Xcode 12, 2020, Swift Beginners) - iOS Development

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
what is going on everyone welcome back to another swift video in today's video we're going to be taking a look at computed properties so for those of you who don't know there are multiple types of properties in the language stored computed and others uh we're going to look at computed today so here we are on swift's own documentation on swift.org and here we've got a brief summary of a computed property and as the name implies it's basically a property that gets computed by other things going on in your class or other variables so we'll take a look at why you would want this in a playground some quick examples and i will jump into a project as always to look at a more practical example so that said make sure you destroy that like a button as always for the youtube algorithm hit subscribe if you're a returning viewer and have not done so already get excited open up xcode and let's dive right in quick pause before we get into the video if you haven't seen it already i am hard at work putting together ios academy dot io a community where all of us ios engineers can come together learn how to build some of the top apps like facebook youtube and instagram in addition to interview prep to land some of these ios roles at top tech companies so if you're interested in the free and premium content to come head on over to ios academy dot io and enter your email address in the waitlist form and you will be notified as content becomes available that said let's get into the video all right so i've got xcode opened up here i'm going to come up here and go to file new and we're going to start with a playground and we can stick with a blank playground i'll go ahead and call this playground computed props playground and let's center this window and also expand it a little bit to give ourselves some more room to work here let me bump this font size a little bit to make sure we can all see it so cool let's start by creating a class and we're going to call this class a person and it's going to have an initializer that takes no parameters let's give it some stored properties on here so we'll say let name equals dan smith it's lowercase.m we'll say dan has an age or person as an age let's go with 18 uh let's go with height in inches let's do heightened feet rather and we'll say he's six foot tall and let's say we wanted to use this person and let's say we have an application where we want to check the eligibility of a person to sign up for our app and let's say we want to make sure each person object which presumably is a model in our app is going to have an age on it that the user submits so let's say we have a person sorry his name is dan so we're going to say this is person and we want a computed property in here which is going to say can sign up so let's say we want to ensure that everyone that signs up is an adult aka 18 years of age or older so we would create this computed property as follows rather before we even create this computed property one way we can do this is we can say if dan dot age is greater than 18 go ahead and continue but computer properties can add a level of convenience better readability and cleanness to our code so let's put this else here so we can say else cannot sign up which should be greater than or equal to and this is a little annoying if we want to keep using this across our app we consistently have to check the age we can possibly screw up this greater than or equal to check let's say somewhere we forget to add the equal so it can turn into a bit of a mess pretty fast so enter in computer properties so computed property can be used as follows you basically create a variable it's not a constant because it's computed every time and we're going to say can sign up it's going to return to us a bull notice there's no equal sign here and here we're going to return if age is greater than or equal to 18 whoops not 19 18. and now instead of using this age check down here we can basically say if dan can sign up so what are the advantages here well firstly we only have one place where we're doing this greater than or equal to check making it less uh brittle the second thing is that it is improved readability in the sense of can sign up from a developer perspective is much more cognizant of what we're actually doing here versus checking if the user's age property is above 18. now in theory right they do the exact same thing but this just to me let's say i'm a new developer on a team building this app is much more readable and easier to understand from a human perspective and in at the end of the day what we can actually also do is let's say we want to add another check in here let's say we want to make sure that everybody's side that signs up is uh also six feet tall or higher we can also adjust this and it'll get adjusted across our app with a simple change here so we can also save height and feet is greater than or equal to six right uh this way let's see what we're getting issues about here we need two ands there so basically the point is the takeaway rather is this makes our code less kind of break proof less fragile it's a co-located it's easier to edit if we want to ever make changes and it's improved readability so that all said let's jump into a project and take a look at a pretty common example that people do across projects and something that i strongly advocate for myself so let's close that let's do file new and we're going to do a new project here and let's stick with a single view application and i'm going to go ahead and call this computed property project and let's go ahead and save this to our desktop and let's get into it so what we're going to actually do is we are going to come to our view controller and we're going to create a simple view so let's come in here and let's say let view equals let's say my view so it doesn't conflict with the naming is a ui view we're going to say my views background color is going to be a system blue and we're going to add this as a sub view to the view controllers view and let's simply start by giving this a frame and we're going to say the frame is something along lines of 0 0 100 and 100 and next up let's pick a simulator up here move this window down a little bit let's pick a simulator up here and run the app let's go with let's go with the 8 here hit that run button to build and run the app give it a second to run and we'll end up seeing that we have a basically a blue square showing up in the top left corner of our view controller bear with it simulators love to be slow there it is awesome so cool so let's say we wanted to make this uh view half the width of the screen make it half the height of the screen as well and then center it let's talk about how we can do that so for the width we would basically say the width is view.frame.size.width over two and we would say this is the height whoops over two that gives you width and height and i'm aware we can do myview.center but we're not going to do that for this example for x and y basically what we would do is as follows so let me make this a property called with we'll save this as width and let's go ahead and make this a property called height and we'll say this is height and the x is going to be the width view.frame.size.width of the entire view minus width divided by 2 and the height similarly rather the y similarly will be the height subtracting height divided by 2. so go ahead and run this let's see what we get so cool it's basically what we expect it's centered horizontally and vertically and the sizing is half the size of the respective axis so the width and the height how can we simplify this code with a computed property basically if you take a look at it we're doing the same verbose code of view frame size with over and over so we can shorthand this by adding a custom computed properties on a ui view extension so we're going to add an extension to ui view which if you're not familiar just adds functionality to the uiview class we're going to create a property called with which will be a cgfloat and we're simply going to return in here frame.size.with and what this lets us do now is we can drop all of this and we can drop all of this because we now have this new computer property which is dot width which internally simply does that frame.size business now you can take this to pretty extreme lengths so let's say we added one for height and we do the same one for height let's get rid of this stuff let's also get rid of this stuff and our code is already looking a lot cleaner so let's let's see what else we can do so currently our view looks like this now what if we wanted to add a view that's right below this in theory you would calculate the height and the y but that's a little cumbersome and annoying so why don't we add another property here called bottom and this will be a computed property as well and the bottom of any frame is essentially the frame's origin y position basically where it is from the top adding the frames size dot height or we can even add height directly because that's already doing that here and now if we wanted to add another view that's just at the bottom of this my view let's say second view is the ui view let's give this guy a background color of green let's add it as a sub view second view and let's give it a frame we can say let's say cgrect zero this one's going to be my view dot bottom the width will be view dot width and the height will be 50. and let's go ahead and run this and see what it looks like see if you run it here you see it's right at the bottom of this blue view which is actually exactly what we want to be showing here and that's basically the power of a computed property being used to not only simplify your code in terms of readability where we got rid of this redundant frame.size business but we can also do things that are more readable like bottom bottom is much better in terms of a name for how we're laying our code out here right instead of doing something like frame.size.width or height plus frame.origin dot y that gets a redundant it's a lot more code to type out but it's also less clear to me from a developer perspective of what the heck it's supposed to be doing and this to me makes a lot more sense in the way it's written out now notice that these are all computed properties they're not assigned with an equal they're kind of contingent on other things right so in this case the bottom is the current y plus the current height and that's basically the nature of a property that you're computing based on current factors and that's about it that's how you would use a computed property uh if you haven't hit that like button already make sure to do so for the youtube algorithm subscribe if you found the video useful uh if you're a returning viewer helps grow the channel of course comment any questions concerns suggestions of hearing from you guys thanks for watching i'll catch you in the next one
Info
Channel: iOS Academy
Views: 1,749
Rating: undefined out of 5
Keywords: swift 5 tutorial, swift 2020, swift, swift 5, swift tutorial, swift for beginners, swiftUI 2020, swift programming, swift basics, swift apps, make iPhone app, swift make first app, swift computed properties, computed property swift, swift 2020 computed property, stored property swift, swift property, computed property swift 5, swift beginners property, swift properties, properties swift 2020, swift var computed, swift computed let, swift computed variable, swift variables
Id: P3Rvd4eqN2o
Channel Id: undefined
Length: 13min 14sec (794 seconds)
Published: Sat Sep 26 2020
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.