Model-view-controller is the standard design pattern in iOS development. This video explains the model-view-controller design pattern, and gives an example of how it works in an iOS app.
- [Instructor] Model-view-controller refers to something that is known as a design pattern in the programming world. A design pattern is a way of organizing your code, your physical assets, and your data to create an application. The model-view-controller design pattern is not the only design pattern, but it's the most commonly used design pattern in iOS development. The way that it works is that you separate your model, your view, and your controller.
The model object refers to your data, the information inside of your application. If you imagine the contacts application on your phone, you can think of that as holding a whole bunch of data, names, addresses, and phone numbers, et cetera. That would be the model. The view is what presents that data, the interface that you see on your screen. The controller is the code that connects the view and the model. So, in other words, the controller could grab the data from the database and then present it inside of the view.
If you take a look at this chart, you'll see that the view on the left side responds to user action. For example, maybe a user taps a button on the screen. That notifies the controller. A button was tapped. The controller can then respond accordingly. Maybe when a button is tapped, something in the view needs to change, so the controller could update the view if it wants to. Maybe something in the model needs to change based on what the user tapped. Maybe the user tapped to delete a contact or some kind of contact information in the contacts app.
Then the controller could update the model, which in turn can notify the controller of any updates that it receives. So this is how these elements work, and in the model-view design pattern, these three are separated. Now, let's look at an example in the contacts app in the simulator. So I'm going to tab over to the simulator, and if you want to see the home screen, you just go to the simulator, and you can press shift-command-h to show the home screen, or you can go to hardware, home.
That'll take you right here. Now, you might not be on the right page, so you can obviously swipe left or right to get to here where you see extras. So, inside of there is the contacts app. Let's go to the starting page here. So as I mentioned earlier, the model would be all of the names of these people and their information. The view is what we're looking at right now. It's presenting the model's data to us. If we select one of the users here, for example, John Appleseed, the controller is notified of that user action.
John Appleseed was selected. The controller can then tell the model, grab me John Appleseed's data. The model can say, okay, the data is ready to present, and then it can notify the controller. Once the controller receives that notification, it can say, alright view, you're ready to go to the next screen, because I have the data that I need to present, and then the view is updated. And this flow kind of repeats itself going wherever the user directs.
If I go back over to the simulator and I hit the edit button, I could delete information about John Appleseed. Let's say I want to delete his mobile number. I hit that button to remove it after hitting the edit button, the controller can be notified of that, I hit delete, and then the model must be updated, and then once the update takes place through the model, the controller can be notified again and the controller can tell the view that there is a change of data and it needs to update the screen to remove that data.
So I'll cancel that out and then head back to this chart here. There is more to learn about model-view-controller, specifically its implementation in iOS, so we'll look at how all of that works, but for now what I really want you to take away, if any of this is overwhelming, is that we separate these three things in iOS development. We keep our view separate from our code that controls the view. We keep our code that controls the view separate from our actual data. They are three different things, and they can interact with each other.
For more information about model-view-controller as it applies to iOS, you can go to this page and read the details here.
- Installing Xcode and the iOS SDK
- Creating an Xcode project
- Running your first app
- Basic layouts with storyboards
- Dismissing the keyboard with delegation
- Making UI-to-code connections
- Coding your app