21.
The Data Model
Written by Eli Ganim
Heads up... You’re accessing parts of this content for free, with some sections shown as text.
Heads up... You’re accessing parts of this content for free, with some sections shown as text.
Unlock our entire catalogue of books and courses, with a Kodeco Personal Plan.
Unlock now
In the previous chapter, you created a table view for the high scores and got it to display rows of items. However, this was all done using hard-coded, fake data. This would not do for a real high score screen since your users want to see their own real high scores up there.
To manage and display this information efficiently, you need a data model that allows you to store (and access) the high scores easily. That’s what you’re going to do in this chapter.
This chapter covers the following:
- Model-View-Controller: A quick explanation of the MVC fundamentals that are central to iOS programming.
- The data model: Creating a data model to hold the high scores data.
Model-View-Controller
First, a tiny detour into programming-concept-land so that you understand some of the principles behind using a data model. No book on programming for iOS can escape an explanation of Model-View-Controller, or MVC for short.
MVC is one of the three fundamental design patterns of iOS. You’ve already seen the other two: Delegation, making one object do something on behalf of another, and target-action, connecting events such as button taps to action methods.
The Model-View-Controller pattern states that the objects in your app can be split into three groups:
-
Model objects: These objects contain your data and any operations on the data. For example, if you were writing a cookbook app, the model would consist of the recipes. In a game, it would be the design of the levels, the player score and the positions of the monsters.
The operations that the data model objects perform are sometimes called the business rules or the domain logic. For the high score screen, the high scores themselves form the data model.
-
View objects: These make up the visual part of the app: Images, buttons, labels, text fields, table view cells and so on. In a game, the views form the visual representation of the game world, such as the monster animations and a frag counter.
A view can draw itself and responds to user input, but it typically does not handle any application logic. Many views, such as
UITableView, can be re-used in many different apps because they are not tied to a specific data model. -
Controller objects: The controller is the object that connects your data model objects to the views. It listens to taps on the views, makes the data model objects do some calculations in response and updates the views to reflect the new state of your model. The controller is in charge. On iOS, the controller is called the “view controller.”
Conceptually, this is how these three building blocks fit together:
The view controller has one main view, accessible through its view property, that contains a bunch of subviews. It is not uncommon for a screen to have dozens of views all at once. The top-level view usually fills the whole screen. You design the layout of the view controller’s screen in the storyboard.
In the high score screen, the main view is the UITableView and its subviews are the table view cells. Each cell also has several subviews of its own, namely the text labels.
Generally, a view controller handles one screen of the app. If your app has more than one screen, each of these is handled by its own view controller and has its own views. Your app flows from one view controller to another.
You will often need to create your own view controllers. However, iOS also comes with ready-to-use view controllers, such as the image picker controller for photos, the mail compose controller that lets you write an email and, of course, the table view controller for displaying lists of items.
Views vs. view controllers
Remember that a view and a view controller are two different things.
A view is an object that draws something on the screen, such as a button or a label. The view is what you see. The view controller is what does the work behind the scenes. It is the bridge that sits between your data model and the views.
A lot of beginners give their view controllers names such as
FirstVieworMainView. That is very confusing! If something is a view controller, its name should end with “ViewController,” not “View.” I sometimes wish Apple had left the word “view” out of “view controller” and just called it “controller” as that is a lot less misleading.
The data model
So far, you’ve put a bunch of fake data into the table view. The data consists of a text string and a number. As you saw in the previous chapter, you cannot use the cells to remember the data as cells get re-used all the time and their old contents get overwritten.
The first iteration
First, you’ll see the cumbersome way to program this. It will work, but it isn’t very smart. Even though this is not the best approach, you should still follow along and copy-paste the code into Xcode and run the app so that you understand how this approach works.
class HighScoresViewController: UITableViewController {
let row0name = "The reader of this book"
let row1name = "Manda"
let row2name = "Joey"
let row3name = "Adam"
let row4name = "Eli"
let row0score = 50000
let row1score = 10000
let row2score = 5000
let row3score = 1000
let row4score = 500
. . .
override func tableView(_ tableView: UITableView,
numberOfRowsInSection section: Int) -> Int {
return 5
}
override func tableView(_ tableView: UITableView,
cellForRowAt indexPath: IndexPath)
-> UITableViewCell {
let cell = tableView.dequeueReusableCell(
withIdentifier: "HighScoreItem",
for: indexPath)
let nameLabel = cell.viewWithTag(1000) as! UILabel
let scoreLabel = cell.viewWithTag(2000) as! UILabel
if indexPath.row == 0 {
nameLabel.text = row0name
scoreLabel.text = String(row0score)
} else if indexPath.row == 1 {
nameLabel.text = row1name
scoreLabel.text = String(row1score)
} else if indexPath.row == 2 {
nameLabel.text = row2name
scoreLabel.text = String(row2score)
} else if indexPath.row == 3 {
nameLabel.text = row3name
scoreLabel.text = String(row3score)
} else if indexPath.row == 4 {
nameLabel.text = row4name
scoreLabel.text = String(row4score)
}
return cell
}
Simplifying the code
Let’s combine the name and score into a new object of your own!
The object
➤ Select the Bullseye group in the project navigator and right-click it. Choose New File… from the pop-up menu.
class HighScoreItem {
var name = ""
var score = 0
}
Using the object
Before you try using an array, you’ll replace the name and score instance variables in the view controller with these new HighScoreItem objects to see how that approach would work.
class HighScoresViewController: UITableViewController {
var row0item = HighScoreItem()
var row1item = HighScoreItem()
var row2item = HighScoreItem()
var row3item = HighScoreItem()
var row4item = HighScoreItem()
var row0item: HighScoreItem
Fixing existing code
Because some methods in the view controller still refer to the old variables, Xcode will throw up multiple errors at this point. Before you can run the app again, you need to fix these errors. So, let’s do that now.
if indexPath.row == 0 {
nameLabel.text = row0item.name
scoreLabel.text = String(row0item.score)
} else if indexPath.row == 1 {
nameLabel.text = row1item.name
scoreLabel.text = String(row1item.score)
} else if indexPath.row == 2 {
nameLabel.text = row2item.name
scoreLabel.text = String(row2item.score)
} else if indexPath.row == 3 {
nameLabel.text = row3item.name
scoreLabel.text = String(row3item.score)
} else if indexPath.row == 4 {
nameLabel.text = row4item.name
scoreLabel.text = String(row4item.score)
}
Setting up the objects
Remember how the new row0item etc. variables are initialized with empty instances of HighScoreItem? That means that the text for each variable is empty. You still need to set up the values for these new variables!
override func viewDidLoad() {
super.viewDidLoad()
// Add the following lines
row0item.name = "The reader of this book"
row0item.score = 50000
row1item.name = "Manda"
row1item.score = 10000
row2item.name = "Joey"
row2item.score = 5000
row3item.name = "Adam"
row3item.score = 1000
row4item.name = "Eli"
row4item.score = 500
}
Using arrays
With the current approach, you need to keep around a HighScoreItem instance variable for each row. That’s not ideal, especially if you want more than just a handful of rows.
class HighScoresViewController: UITableViewController {
var items = [HighScoreItem]()
override func viewDidLoad() {
super.viewDidLoad()
// Replace previous code with the following
let item1 = HighScoreItem()
item1.name = "The reader of this book"
item1.score = 50000
items.append(item1)
let item2 = HighScoreItem()
item2.name = "Manda"
item2.score = 10000
items.append(item2)
let item3 = HighScoreItem()
item3.name = "Joey"
item3.score = 5000
items.append(item3)
let item4 = HighScoreItem()
item4.name = "Adam"
item4.score = 1000
items.append(item4)
let item5 = HighScoreItem()
item5.name = "Eli"
item5.score = 500
items.append(item5)
}
Simplifying the code — again
Now that you have all your rows in the items array, you can simplify the table view data source and delegate methods once again.
override func tableView(_ tableView: UITableView,
cellForRowAt indexPath: IndexPath)
-> UITableViewCell {
let cell = tableView.dequeueReusableCell(
withIdentifier: "HighScoreItem",
for: indexPath)
let item = items[indexPath.row] // Add this
let nameLabel = cell.viewWithTag(1000) as! UILabel
let scoreLabel = cell.viewWithTag(2000) as! UILabel
// Replace everything after the above line with the following
nameLabel.text = item.name
scoreLabel.text = String(item.score)
return cell
}
let item = items[indexPath.row]
override func tableView(_ tableView: UITableView,
numberOfRowsInSection section: Int) -> Int {
return items.count
}