CODEWITHSUNDEEP
iosswiftxcode7
SB2015
SB2015

Reputation: 145

SWIFT: Creating a tableView with different prototype styles

I'm creating an event RSVP app, and the RSVP screen is designed as follows -

enter image description here

As shown, there are multiple headers (for each event), which are displayed to the user IF at least one guest in the users family is invited to that respective event. If the header for a particular event is shown, then the guest(s) are listed underneath it with the option for the user to select (or deselect) the invited guests representing if they are attending the event (or not).

With the help of Stack Overflow, I have implemented a tableView with multiple prototype cells using the following logic - 

override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

    if indexPath.row == 0 {

        //cell 1 content 
        return cell
    } else if indexPath.row == 1 {
       //cell 2 content 
        return cell
    } else if indexPath.row == 2 {
       //cell 3 content 
        return cell
    } ...

There's a problem with the above logic when implementing what I'd like. Yes, indexPath.row == 0 will equal "Event 1". However, indexPath.row == 2, indexPath.row == 3, ..., indexPath.row == x, will be populated with the number of guests invited to the particular event (OR the header will be suppressed if there are no guests invited to the event). The question is, what logic would I use to display the "Event 2" header (i.e. indexPath.row == x + 1)?

If there are any specific tutorials or solutions that anyone can point me to, it would be greatly appreciated. Thanks.

Upvotes: 1

Views: 707

Answers (2)

Jen Jose
Jen Jose

Reputation: 4035

You need to create an Array (named Sections ) of Dictionary having Event ID, EventName and SubArray of Guests(named guests). You have to use numberOfSectionsInTableView function to set the Header count.

override func numberOfSectionsInTableView(tableView: UITableView) -> Int {
      // Return the number of sections.
    return self.sections.count
}

Set the number of Cells in particular section as 

override func tableView(tableView: UITableView,
    numberOfRowsInSection section: Int)
    -> Int {
    return self.sections[section].guests.count
}

You can create a TableViewCell for custom HeaderView in StoryBoard ans use it from

override func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    let  headerCell = tableView.dequeueReusableCellWithIdentifier("HeaderCell") as! CustomHeaderCell
    headerCell.backgroundColor = UIColor.cyanColor()

      headerCell.headerLabel.text = self.sections[section].eventName

    return headerCell
  }

For sub-section cells use,

 override func tableView(tableView: UITableView,
        cellForRowAtIndexPath indexPath: NSIndexPath)
        -> UITableViewCell {
        let guest = self.sections[indexPath.section].guests[indexPath.row]

        let cell = tableView.dequeueReusableCellWithIdentifier("UITableViewCell", forIndexPath: indexPath) as UITableViewCell
        cell.textLabel.text = guest.name
        return cell
    }

Read this for more help https://www.ralfebert.de/tutorials/ios-swift-uitableviewcontroller/

Upvotes: 1

Mejdi Lassidi
Mejdi Lassidi

Reputation: 999

Make a dictionary using as keys the events ids and as values arrays of guests.

Your tableView will use sections.

Number of sections will be the number of events (number of keys of your dictionary).

Number of rows in each sections will be the size of the array of guests.

Like this the celForRowAtIndex will be easy to implement.

Upvotes: 0

Related Questions