how to add header view to each of custom tableViewCells in swift

Question

I have two custom TableViewCells. So first TableViewCell is like a recent list, it can become longer. but second cell is always stays at bottom. so i need to add UILabel that hold's secondTableViewCell. the result that i need.

import UIKit

class bagPage: UIViewController, UITableViewDelegate, UITableViewDataSource {
    var itemsName: [String] = []
    var itemsPhoto: [UIImage] = []
   // these arrays will defined in other view controller
    
    @IBOutlet weak var tableView: UITableView!
        override func viewDidLoad() {
        super.viewDidLoad()
        
        tableView.dataSource = self
        tableView.delegate = self
       
    }
    func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        
        if indexPath.row < itemsName.count{
            return 165
        }else{
            return 50
        }
        
    }
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        
        return  6 + itemsName.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        
        
        if indexPath.row < itemsName.count{
            
            let cell = tableView.dequeueReusableCell(withIdentifier: "bagTableViewCell") as? bagTableViewCell
            cell?.itemName.text = itemsName.last
            cell?.itemPhoto.image = itemsPhoto.last
            return cell!
        }
        if indexPath.row == itemsName.count {
            let cellTwo = tableView.dequeueReusableCell(withIdentifier: "extraBagPageTableView") as? extraBagPageTableView
            // here i'm hiding views in first row
            cellTwo?.textLabel?.text = "These are products that u can add to your cell"

            return cellTwo!
            
        }else{
            let cellTwo = tableView.dequeueReusableCell(withIdentifier: "extraBagPageTableView") as? extraBagPageTableView
            return cellTwo!
        }
        
    }
    
}

I guess my other solution wasn't what you were looking for, allow me to try and help again. I think my confusion is the way you say a label that holds the second tableview cell. What exactly do you mean by this as your image doesn't make the question any clearer? Try and explain what you mean by hold. Do you want a label within the second cell to do something? — latenitecoder, Feb 26 '21 at 18:50
Look, i dragged two UITableViewCells to my tableView. first one can become longer by the user's action. but second one, is always stays at bottom and i need a UILabel that describes what second cell is about. i added photo of my storyboard — Мухаммед Аралбек, Feb 27 '21 at 13:03
otherwise they can be unlimited rows in first cell, but there are only five in second cell and Label should be like a first row of second cell. i hope u understood me. — Мухаммед Аралбек, Feb 27 '21 at 13:13
i dragged two UITableViewCells to my tableView. OK- first one can become longer by the user's action. OK - but second one, is always stays at bottom OK - and i need a UILabel that describes what second cell is about. NOT OK You need to explain what this label is. The image doesn't explain. — latenitecoder, Feb 27 '21 at 15:55
otherwise they can be unlimited rows in first cell OK I know the cell can grow longer based on user interaction - the second cell you haven't clearly explained how its different. I really want to help you but I'm struggling to understand what the label in the second cell does — latenitecoder, Feb 27 '21 at 15:57
i will explain u by my project's idea. first cell is list of products that user has already added to bug. Second cell is extra products that user can also add to his bag. i need to put UIlabel before second cell that says "these are extra product that u can add to your bag" — Мухаммед Аралбек, Feb 27 '21 at 16:14

latenitecoder · Accepted Answer · 2021-02-27T17:37:58.653

0

This is another attempt at providing a solution. Is this what you are looking for?

Here is a link to the project https://drive.google.com/file/d/1XlSF4fGiNzOqQHauiNo7TuFhKUTrFbsJ/view?usp=sharing

Let me know if you need more help

edited Feb 27 '21 at 17:37

answered Feb 27 '21 at 17:08

latenitecoder

746
7
13

if "product number ..." and "add more product here" are two different cells, yes! – Мухаммед Аралбек Feb 27 '21 at 17:17
They are different cells yes – latenitecoder Feb 27 '21 at 17:18
Yes looks like it’s what i wanted to achieve – Мухаммед Аралбек Feb 27 '21 at 17:29
I added a link to the complete project – latenitecoder Feb 27 '21 at 17:38
I sended a request to project – Мухаммед Аралбек Feb 27 '21 at 17:43
Looks like I need an access from u – Мухаммед Аралбек Feb 27 '21 at 18:55
sorry I changed permission - anyone with a link can get the project now. – latenitecoder Feb 27 '21 at 19:26
thank u, i implemented it to my code. On the simulator the result was not exactly as i wanted. but UIlabel's position was great. So can u implement your code to my code that was written on question. and sorry for this kind of incomprehensible question – Мухаммед Аралбек Feb 28 '21 at 05:41
and it will be great if u don't change my numberOfRowsInSection and cellForRow function – Мухаммед Аралбек Feb 28 '21 at 05:43
Take a look to the result of your code. i updated image link in question – Мухаммед Аралбек Feb 28 '21 at 05:49
To do this without changing NumberOfRowsInSection or cellForRow you would have to change your cell to include the label. Then for the products added have the label height set to 0 and then for the last cell have the label height set to display the title. It's slightly different approach but can be done. If you prefer I will change the project to this later this evening – latenitecoder Feb 28 '21 at 13:59
Please see new answer uploaded – latenitecoder Feb 28 '21 at 22:39
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/229352/discussion-between---and-latenitecoder). – Мухаммед Аралбек Mar 01 '21 at 15:18

score 0 · Answer 2 · answered Feb 28 '21 at 22:38

Good evening, so I followed your image and made the code follow your convention of 1 tableview section, 2 difference cells. I tried to use your naming convention. Note I had to swap around the height values, you had them wrong way round.

   class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
    
        @IBOutlet weak var tableView: UITableView!
        var itemsName: [String] = ["Helmet", "Gloves", "Bindings", "Goggles", "Kneepads", "Boots", "Snowboard"]
        
        override func viewDidLoad() {
            super.viewDidLoad()
        }
        
        func numberOfSections(in tableView: UITableView) -> Int {
            return 1
        }
    
        func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
            return 1 + itemsName.count
        }
        
        func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
            
            if indexPath.row < itemsName.count{
                let bagTableViewCell = tableView.dequeueReusableCell(withIdentifier: "BagTableViewCell") as? BagTableViewCell
                bagTableViewCell?.productsLabel.text = itemsName[indexPath.row]
                return bagTableViewCell!
            } else {
                let extraBagPageTableView = tableView.dequeueReusableCell(withIdentifier: "ExtraBagPageTableView") as? ExtraBagPageTableView
                return extraBagPageTableView!
            }
        }
        
        func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
            if indexPath.row < itemsName.count {
                return 50
            } else {
                return 165
            }
        }
    }

And the tableview cells. Please note the second cell has a bad name.

class BagTableViewCell: UITableViewCell {
    @IBOutlet weak var additionalProductsLabel: UILabel!
    @IBOutlet weak var productsLabel: UILabel!
    @IBOutlet weak var productImage: UIImageView!
}

class ExtraBagPageTableView: UITableViewCell {
    
}

And altogether it looks like this

And the project can be found here. (I set the permissions correctly this time :) )

TableCellWithLabel Project

Hello. look's like u added uilabel to the second cell. but don't forger that i have 5 rows in second cell — Мухаммед Аралбек, Mar 01 '21 at 04:01
look's like i finded a solution but its a bag when scrolling. i defined current code in answer. can u try implement it to your code? — Мухаммед Аралбек, Mar 01 '21 at 04:01
i added one more row to second cell and hided all views than added text to there. but if user will add 6-7 items to bag, text label changes position. try to add 7-8 items to both arrays — Мухаммед Аралбек, Mar 01 '21 at 04:09
This is why the first solution is better for you, using the section header means there will only be one extra label, no matter how many cells are in the first or second sections. I would suggest we switch back to the first solution, and I will help you to adjust your code to work with it. It's probably about 10 extra lines of code but a better solution overall. I will update the project using the first solution and maybe we can talk over discord or here in SO chat to finish off. Will be later though. — latenitecoder, Mar 01 '21 at 14:54
ok. i haven't use discord. should send link or something like this? — Мухаммед Аралбек, Mar 01 '21 at 15:19
you can use from a webpage - or if you have a chat program you prefer let me know — latenitecoder, Mar 01 '21 at 15:24
yes - username to search for is @latenitecoder or t.me/latenitecoder — latenitecoder, Mar 01 '21 at 15:34

how to add header view to each of custom tableViewCells in swift

2 Answers2