Search code examples
iosswiftuilabeluisplitviewcontrolleruisplitview

Adding a custom label to a prototype cell in a split view


I am working on a dictionary app in a SplitViewController. On the master view controller I want to show the various entry words AND the number of times that they've been tapped, while on the detail I want to show the word definition and details. I've set up everything so far, except the number of times that a word has been tapped, which should be showing on the Main view controller. How do I manage to customise the various labels in the main view controller, adding a label?

// "Word" class
import UIKit

class Word {
let name: String
let meaning: String
let wordType: String
let numberOfTimesFound: String


init(name: String, meaning: String, wordtype: String, numberOfTimesFound: String) {
    self.name = name
    self.meaning = meaning
    self.wordType = wordtype
    self.numberOfTimesFound = numberOfTimesFound
    }
}


let words = [
Word(name: "Afraid", meaning: "WORD DEFINITION GOES HERE", wordtype: "adjective", numberOfTimesFound: "1")
]

//MasterViewController.swift

import UIKit

class MasterViewController: UITableViewController {

override func viewDidLoad() {
    super.viewDidLoad()


    let firstWord = words.first

}


override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return words.count
}


override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
    let word = words[indexPath.row]
    cell.textLabel?.text = word.name
    return cell
}

override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
    let word = words[indexPath.row]
    let appDelegate = UIApplication.shared.delegate as! AppDelegate
    appDelegate.detailViewController.refreshUI(word: word)
}

//AppDelegate.swift

import UIKit

@UIApplicationMain


class AppDelegate: UIResponder, UIApplicationDelegate {

var window: UIWindow?
var masterViewController = MasterViewController()
var detailViewController = DetailViewController()

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
    let splitViewController = window?.rootViewController as? UISplitViewController
    let leftNavController = splitViewController!.viewControllers.first as? UINavigationController
    masterViewController = (leftNavController?.topViewController as? MasterViewController)!
    detailViewController = (splitViewController!.viewControllers.last as? DetailViewController)!

    // Override point for customization after application launch.
    return true

}

Solution

    • Select the storyboard or nib in the project navigator.
    • Select the prototype cell.
    • Press ⌥⌘4 to show the Attributes Inspector.
    • Set the style of the cell to Right Detail, Left Detail or Subtitle which enables a detailTextLabel label.
    • In cellForRowAt assign the second string to the text property of the detailTextLabel

    If the predefined styles don't fit your needs set the style to custom, drag all UI elements to the cell, add constraints, create an UITableViewCell subclass, add IBOutlets, connect the outlets, set the class of the cell to the custom class and cast the dequeued cell in cellForRowAt to the custom class.