7 days of WordPress plugins, themes & templates - for free!* Unlimited asset downloads! Start 7-Day Free Trial
FREELessons: 19Length: 2.3 hours

Next lesson playing in 5 seconds

  • Overview
  • Transcript

2.2 Build the Models

Just like any other iOS application, WatchKit apps follow the Model-View-Controller (MVC) pattern. In this lesson we will focus on the M and create the foundational models that our entire application is going to revolve around: Reminder and Stage.

2.2 Build the Models

The first part of our application that I wanna start by writing is going to be what I might refer to as the models of our application. So when we're talking about MVC, or Model View Controller. In this case, we're gonna be talking about the models, and the models are kind of the substance behind your application. What is your application really about? And whatever those concepts are, those concrete ideas that are gonna be part of your application, those are typically gonna be referred to as models. So the first thing I wanna do is I want to put our models in the Remind Me target. So right up here, I'm gonna come in here and I'm gonna select File, New File. And in this case, I want to stick with just i OS and I wanna go with a Swift File. So let's talk a little bit about what it is exactly we're going to be creating. So this concept of this application is called, Remind Me. And the motivation behind this, was I recently started getting into barbecue, and specifically smoking baby back ribs. Now you may not be able to relate to that, but the concept is pretty simple. When I am making ribs, when I'm smoking them, it typically happens in multiple stages. And the idea here is that I start with the first stage, which might be putting the ribs on the smoker with a few different ingredients. With a rub and things like that, and putting them on the smoker for, say, two hours, maybe two and a half hours depending on the size of the ribs. And then when that stage is done, I am going to take them off, and I am going to wrap them up, and I'm going to add some more ingredients. And then I'm gonna put put them back on the smoker, and I'm going to let them sit on the smoker for another hour, hour and a half, somewhere in there. And so the basic idea here is that there's multiple stages of things going on that comprise a certain activity that I'm doing. And like I said, you might not be able to relate to that, but the concept is pretty simple if you boil it down to, I basically want to have a series of stages rolled up into what I'm referring to as a reminder. So I'm gonna have this concept of a reminder, and that example might be something like baby back ribs or something, give it some name. And then that reminder is gonna be built or comprised of a number of different stages. And at the end of every stage, I wanna know when that stage is done. Maybe get some sort of notification, or something like that. And then I wanna know when that stage is done so that I can go ahead and do the next part of the stage. Now this could also apply to many other things, maybe exercise programs, maybe morning routines or anything like that. Where it's nice to be able to just focus on what you're doing, and then have some sort of outside thing like your watch or your phone or something like that notify you when the stage is done. And that's kind of the basic idea of where this is coming from. So like I said, what we're dealing with here is probably something like reminders and those reminders are created of stages. So those are the models that I wanna kinda build right now. So let's go ahead and start to build those things out. So actually, let's go ahead and hit Cancel. What I'd like to do is actually focus or kind of create these things in logical groupings. So let's go ahead and cancel out all of this. Let's go and right-click on the reminder target here and let's create a new group. A new group is just another name for a folder. And let's go ahead and rename this to Models. And as you can see, I'm putting this in the Remind Me target, at least in that folder structure, and we'll talk about that in a little bit too. So now at this point, I could come up to File and I could select New File, or I could right-click on this folder and I could select New File. So now in here, like I said before, we're gonna stick with the iOS grouping under Source, and we're gonna select a Swift file. So we're gonna do two of these. The first one that I wanna do is going to be a reminder. So let's go ahead and save this as reminder.swift, like that. So here is our first file, reminder.swift. And let's go ahead and select our Models folder and let's create one more. So let's say New File, and then we're going to call this stage.swift. Now the way that you structure these things in the folders and all that sort of thing is kind of up to you. It doesn't really matter that much, just some of the basic concepts will matter. So let's talk about what the reminder is going to be first. So the reminder is gonna be a class. So the first thing I wanna do is wanna create a class. So I'm gonna call this Reminder, and this is going to have one property to start with. So we're gonna say var name and that’s going to be a string. And what I want to be able to do is I wanna create an initializer or a constructor, if you want to refer to it that way, that’s gonna allow me to pass in that name. So that I can initialize my property with whatever I pass in as the name of that reminder. So every time I create a reminder, I have to give it a name. All right, that's pretty basic. All right, so the next that I was talking about before is this is going to have stages. So what I wanna be able to do is I wanna create another property here. I want to say var stages, and I want this to be equal to maybe a new array of stages. So I want it to look something like this. This is how I wanna define it, but stage doesn't actually exist yet. And there we go, xCode's figuring that out, it's gonna say, hey, I don't know what stage is. Well, lets go a head and take care of that. We're going to go into Stage now and we're gonna do the same thing. Let's create another class, and this is gonna be called Stage. And this, once again, is gonna be very similar. Where we're going to begin with a name, which is going to be a string. And we're also gonna start to introduce this concept of, how long does this stage take? Hours, minutes, seconds, and some sort of combination of those. Well, you could try to store all of those pieces of information, but what I think is probably the easiest thing to do is to boil it down to the lowest common denominator and just store that. And then do whatever sort of formatting of that you want later on. So I think the easiest way to do this is by creating seconds. And let's just store the number of seconds that this stage is going to take. And in order for us to create this, let's go ahead and create an initializer. So we're gonna have a name here that's going to be a string. We're going to have seconds, that's gonna be an integer. And then we just go ahead and initialize these properties to what we're passing in. Self.seconds is going to be equal to seconds, just like that. Okay, so that's not too bad. So now we have this concept of a name for a stage, as well as its duration. Which is going to be in seconds, which is pretty good, that's a good start. Now let's come back to Reminder. And now we're gonna see that that warning or that error goes away, because now we have a class called Stage. Well, another thing that would be very interesting and maybe beneficial would to know how long is this entire Reminder gonna to take? So I wanna know what's the total duration? So if I wanted to create one for maybe smoking ribs. I wanna know that typically we're looking at somewhere between four to five hours roughly, it may give or take, depending on the size and things like that. So that's something that I might wanna know when I'm looking at all the different reminders that I have in my system. So I'd like to know how long this entire reminder is gonna take. Well, the easiest way for me to do that is to just add up all of these seconds that are found in all of the stages that are part of this reminder. So how can we do that? Well, the easiest way for me to do that is, within Reminder, let's go ahead and create a computed property. And a computed property is nothing more than a property, so in this case we're gonna say var seconds. And this is going to be an integer, but we're gonna give this curly brackets. And within here, we're gonna define how we actually do the get of this particular property. So we're gonna compute something and return an integer that's going to give us the value of seconds for the reminder, and it's actually pretty simple. Let's create a variable called numberOfSeconds, so this is gonna kind of be our counter, what we're gonna use to track the total number of seconds. And we're gonna initialize it to 0. And then all we really need to do is, we need to loop through all of the different stages. So we're gonna say for each stage in Stages, I simply want to do number of seconds plus equal to stage.seconds. And then once I've done all that calculation, I'll simply return numberOfSeconds, so we can go ahead and save that. So now I have a computed property of seconds for the Reminder, so I can't set any of those seconds for the Reminder. The only thing I can do is retrieve it, and it's going to calculate all of the seconds for that reminder based on all of the children. All right, so that's pretty good. Now the fun thing that I want to talk about a little bit is seconds are good, seconds are the lowest common denominator. But at some point I wanna be able to display the total duration. And there's not many people in the world that can look at an integer value of seconds and then calculate in their brain what that means to normal human beings like hours, minutes, and seconds. So what we wanna do is we wanna be able to display that. And so what I want, basically here, is to create another computed property. That's ultimately going to format those seconds into something a little bit more usable. And what we're looking for here is something that's just gonna look like hours, minutes, and seconds. Something like that, so that's kinda the goal here. So let's go ahead and create another computed property and we're gonna call this duration. And this is gonna be a string, and actually it's gonna be an optional string. In case there is nothing in the seconds or maybe we don't have anything. Things can go wrong with formatters and things like that, so we'll make it optional. And what we want to do now is, we want to use some nice built-in features of Swift to be able to convert that number of seconds into an hours, minutes, and seconds format. All right, so what we wanna do is we wanna create a time interval first. We're gonna say let the interval be equal to a new time interval, and the time interval is going to be calculated by passing in the number of seconds. So now we're gonna have a time interval. And now we're gonna use a formatter, we're gonna use a DateComponentsFormatter. So we're gonna say, let formatter be equal to a DateComponentsFormatter. And now we can set some properties on here. So we're gonna say, formatter., and we're gonna specify the the unit style is going to be equal to positional. We're gonna say that the formatter.allowedUnits. Now this is where we can specify what sort of units we want to be included in this time, do we want hours, minutes, and seconds? Do we only want minutes and seconds, so on and so forth. And you do this by creating an array, and you pass in an array of these enum values. So we wanna include in hours, we want to include minutes. And we want to include seconds, just like that. And then finally we are going to pad with zeros, because typically you'll see hours, minutes, and seconds. If they're single digits, they'll be padded with zeros, so instead of just 1, it will be 01, things like that. We wanna include that in the formatter as well, so this is zero formatting behavior. And we are going to set that equal to, and once again we can set a number of these, but we're just going to pad. And then finally what we wanna do is we want to return formatter.string, and the string for the interval that we created before with the seconds. So this is our computed property of duration. It's going to take in the seconds from all of the stages underneath it, and be able to calculate a nice human readable version of that number of seconds. Now this would obviously be very beneficial for the stage as well. So what I'm gonna do right now is I'm just gonna copy this and come over into Stage. And I'm gonna drop this in here for duration so we can get the same type of calculation for stages as well. Because I think it's gonna be important for us to be able to see that for both stages and durations. But this is a bad practice to do copy and pasting. But we’ll do a little bit of cleanup in an upcoming lesson, but just to kinda get things off the ground, this is where gonna start. So now we have our models that we’re going to build our watchOS application around.

Back to the top