Create Subsections in UITableView (Swift 2.3)

Question

I am currenlty working on an app, and I have to display soccer fixtures in a TableView.

The table view should look like this (see picture above) As a tree view it should look like :

Date
    League
        Fixture1
        Fixture2
    League2
        Fixture1
        Fixture2
Date
    League
        Fixture1
        Fixture2
    League2
        Fixture1
        Fixture2

So I created a DataManager in order to manage my dummy data :

import Foundation
import RxSwift
import RxCocoa

class DataManager {
    var games = [Int:[League:[Game]]]()

    static let shared = DataManager()

    private init() {
        self.buildDummyData()
    }

    func buildDummyData() {

        let today = NSDate()
        let tomorrow = NSCalendar.currentCalendar()
            .dateByAddingUnit(
                .Day,
                value: 1,
                toDate: today,
                options: []
        )
        let day_after = NSCalendar.currentCalendar()
            .dateByAddingUnit(
                .Day,
                value: 2,
                toDate: today,
                options: []
        )

        let premierLeague = League(title: "Premier League", iName: "england")
        let ligueUn = League(title: "Ligue 1", iName: "France Contest")
        let europaLeague = League(title: "Europa League", iName: "Europa Contest")



        let game1 = Game(ftName: "Monaco", ftLogo: "sampleLogo", stName: "Paris SG", stLogo: "sampleLogo", time: "16:30", date: today, league: ligueUn)

        let game2 = Game(ftName: "Man U.", ftLogo: "sampleLogo", stName: "Liverpool", stLogo: "sampleLogo", time: "20:30", date: tomorrow!, league: premierLeague)

        let game3 = Game(ftName: "Celta Vigo", ftLogo: "sampleLogo", stName: "Man U.", stLogo: "sampleLogo", time: "19:45", date: day_after!, league: europaLeague)

        let game4 = Game(ftName: "ASSE", ftLogo: "sampleLogo", stName: "Man U.", stLogo: "sampleLogo", time: "19:45", date: day_after!, league: europaLeague)

        games = [0: [ligueUn: [game1]], 1: [premierLeague: [game2]], 2: [europaLeague: [game3, game4]]]


    }

}

And my ViewController.swift :

import UIKit

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

    @IBOutlet weak var tableView: UITableView!

    let dataManager = DataManager.shared

    let currentDate = NSDate()

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.

        self.tableView.delegate = self
        self.tableView.dataSource = self

        tableView.registerNib(UINib(nibName: "GameTableViewCell", bundle: nil), forCellReuseIdentifier: "gameCell")



    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return dataManager.games.count
    }

    func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {

        let view = UIView(frame: CGRectMake(0, 0, 350, 60))

        let label = UILabel(frame: CGRectMake(0, 13, 350, 33))

        view.addSubview(label)

        label.text = "Today"

        return view
    }

    func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
        return 60.0
    }

    func numberOfSectionsInTableView(tableView: UITableView) -> Int {
        return dataManager.games.count
    }

    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCellWithIdentifier("gameCell", forIndexPath: indexPath) as! GameTableViewCell

//        var arrayOfLeagueAndGame = dataManager.games[indexPath.section]
//        var arrayOfGame = arrayOfLeagueAndGame?.popFirst()
//        
//        cell.setupCell(arrayOfGame(indexPath.row))

        return cell
    }

    func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
        return 50.0
    }


}

So I'd like to see this :

TODAY
   Ligue 1
        Monaco - PSG
TUESDAY 06 JUNE
    Premier League
        Man U. - Liverpool
WEDNESDAY 07 JUNE
    Europa League
        Celta Vigo - Man U.
        ASSE - Man U.

I don't know where to start, and how to deal with such nested data.

Thanks for your help !

Answer 1

UITableView does not intrinsically support multiple tree levels as you describe, just entries and headers.

I would flatten the data model for display from three levels to two (Date + League on top). Each section header will display both the day and the league.

You could also just display the day in the header, then sort the games by league on that day, and distinguish the grouped leagues in the entry cells with icons indentations or cell background colors.

Hope this helps.