Search code examples
iosswiftuitableviewuiimageviewuiimage

Display array of images on a certain amount of tableview cells


I have an UIImageView inside my table view cell, named pic. I want to use an array named colors (filled with UIImages), to display on 3 tableview cells.

I have the ViewController class and the tableview cell class listed below. The tableview displays the imageview pic. I assume you would place the color array in cellForRowAt method.

import UIKit
    
class ViewController: UIViewController,UITableViewDelegate,UITableViewDataSource {
    var colors:[UIImage] = [
        UIImage(named: "blue")!,
        UIImage(named: "red")!,
        UIImage(named: "red")!
    ]

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 3
    }
    func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        return 118
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! customtv
        return cell
    }
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
            
    }    
}
    
class customtv: UITableViewCell {
    lazy var backView : UIView = {
        let view = UIView(frame: CGRect(x: 10, y: 6, width: self.frame.width  , height: 110))
         view.backgroundColor = .green
            
        return view
    }()

    lazy var pic : UIImageview = {
        let view = UIImageview(frame: CGRect(x: 100, y: 6, width: 100  , height: 100))
        view.backgroundColor = .red
            
        return view
    }()

    override func layoutSubviews() {
        backView.clipsToBounds = true
        backView.frame =  CGRect(x: 0, y: 6, width: bounds.maxX  , height: 110)
    }
    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(animated, animated: true)
        addSubview(backView)
        addSubview(pic)
    }
}

Solution

  • Try with this example below

    import UIKit
    
    class ViewController1: UIViewController {
        var tableView: UITableView?
        
        var colors:[UIImage] = [
            UIImage(named: "blue")!,
            UIImage(named: "red")!,
            UIImage(named: "red")!
        ]
        
        override func viewDidLoad() {
            super.viewDidLoad()
            loadUI()
        }
        
        func loadUI()  {
            tableView = UITableView()
            self.view.addSubview(tableView.unsafelyUnwrapped)
            tableView?.register(CustomTVC.self, forCellReuseIdentifier: "cell")
            tableView?.delegate=self
            tableView?.dataSource=self
            tableView?.translatesAutoresizingMaskIntoConstraints = false
            tableView?.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor).isActive = true
            tableView?.leftAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leftAnchor).isActive = true
            tableView?.rightAnchor.constraint(equalTo: view.safeAreaLayoutGuide.rightAnchor).isActive = true
            tableView?.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor).isActive = true
        }
    }
    
    extension ViewController1: UITableViewDelegate, UITableViewDataSource {
        func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
            return 3
        }
        func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
            return 118
        }
        func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
            let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! CustomTVC
            cell.pic.image = colors[indexPath.row]
            return cell
        }
    }
    
    class CustomTVC: UITableViewCell {
        lazy var backView : UIView = {
            let view = UIView()
            view.backgroundColor = .green
            return view
        }()
        
        lazy var pic : UIImageView = {
            let view = UIImageView()
            view.backgroundColor = .red
            return view
        }()
        
        override func awakeFromNib() {
            super.awakeFromNib()
            commonInit()
        }
        
        override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
            super.init(style: style, reuseIdentifier: reuseIdentifier)
            commonInit()
            
        }
        
        required init?(coder aDecoder: NSCoder) {
            super.init(coder: aDecoder)
            commonInit()
        }
        
        override func layoutSubviews() {
            backView.clipsToBounds = true
            backView.frame =  CGRect(x: 0, y: 6, width: bounds.maxX  , height: 110)
        }
        
        func commonInit() {
            contentView.addSubview(backView)
            backView.translatesAutoresizingMaskIntoConstraints = false
            backView.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 4).isActive = true
            backView.leftAnchor.constraint(equalTo: contentView.leftAnchor, constant: 4).isActive = true
            backView.rightAnchor.constraint(equalTo: contentView.rightAnchor, constant: -4).isActive = true
            backView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor, constant: -4).isActive = true
            
            backView.addSubview(pic)
            pic.translatesAutoresizingMaskIntoConstraints = false
            pic.topAnchor.constraint(equalTo: backView.topAnchor, constant: 4).isActive = true
            pic.leftAnchor.constraint(equalTo: backView.leftAnchor, constant: 4).isActive = true
            pic.bottomAnchor.constraint(equalTo: backView.bottomAnchor, constant: -4).isActive = true
            pic.widthAnchor.constraint(equalTo: pic.heightAnchor).isActive = true
        }
        
        override func setSelected(_ selected: Bool, animated: Bool) {
            super.setSelected(animated, animated: true)
        }
    }