tableview xcode swift with rounded borders

Question

I created a table view with a custom prototype cell but I need to shape the borders, this is the image I have now

please note that I created a new class for the tableviewcell where I added a textfield to be changed from a list

I want to set the corners radius i tried to add this code,

layer.cornerRadius = 10

and

layer.masksToBounds = true

in the user defined runtime attributes like I did before for a button but it doesn't work

Here is the code:

import UIKit

class ListOffersViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {

    let profil = ["Eric","Eric","Eric","Eric","Eric","Eric"]

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


    public func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! ListOffersViewControllerTableViewCell

        cell.profilName.text = profil[indexPath.row]
        return cell
    }

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }

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

i want to make every cell with rounded corners and shadow,i've seen some other posts but there is some code that I need to add and i don't know where to add it exactly — Elyas Bennani, Apr 14 '18 at 19:27
@LLIAJLbHOu I've seen this one https://stackoverflow.com/questions/33793211/tableview-rounded-corners-and-shadow but i don't know where to add this code exactly — Elyas Bennani, Apr 14 '18 at 19:36

score 1 · Answer 1 · answered Apr 14 '18 at 19:36

1

Be attentive when you work with UITableViewCell. UI features you mind make with contentView. Here is example.

class ViewController: UITableViewController {

    let identifier = "roundedCell"

    override func viewDidLoad() {
        super.viewDidLoad()

        tableView.register(UITableViewCell.self, forCellReuseIdentifier: identifier)
    }

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

    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: identifier, for: indexPath)

        cell.textLabel?.text = "\(indexPath)"

        return cell
    }

    override func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {
        cell.backgroundColor = .red
        cell.contentView.backgroundColor = .blue
        cell.contentView.layer.cornerRadius = 10.0
    }

}

answered Apr 14 '18 at 19:36

LLIAJLbHOu

1,313
12
17

when i added the new function it worked with blue background color,i want to set it to white,so when i did nothing happened,I think it's because there is no shadow,right? – Elyas Bennani Apr 14 '18 at 19:45
Setup cell.backgroundColor = .clear And cell.contentView.backgroundColor = .white – LLIAJLbHOu Apr 14 '18 at 19:46
Of course, you can setup shadow. But do it with cell.contentView.layer – LLIAJLbHOu Apr 14 '18 at 19:48
can you explain more how can i add the shadow – Elyas Bennani Apr 14 '18 at 19:55
i added this code but i can only see the shadow for inside content like the buttons,the texfields.. not the borders of the cell cell.contentView.backgroundColor = UIColor.clear cell.contentView.layer.shadowColor = UIColor.darkGray.cgColor cell.contentView.layer.shadowOffset = CGSize(width: 2.0, height: 2.0) cell.contentView.layer.shadowOpacity = 1.0 cell.contentView.layer.shadowRadius = 2 – Elyas Bennani Apr 14 '18 at 20:50
I think this may helps you. https://stackoverflow.com/questions/4754392/uiview-with-rounded-corners-and-drop-shadow – Muhammad Ahmed Baig Apr 14 '18 at 21:02

score 0 · Answer 2 · answered Apr 14 '18 at 19:25

0

Try adding a UIView on the cell and set the constraints so that it is the same size as the cell. Put all your design objects inside that view. Connect that view to your cell file, then add the corner radius to that view. Make sure you set the cell view background to transparent, and add colour to the new UIView.

answered Apr 14 '18 at 19:25

Ryan Dailey

286
1
6
13

is there any method just by adding a code,and what is the difference btw the one i use now and the one you suggested? – Elyas Bennani Apr 14 '18 at 19:29
What do you mean by that? Are you talking about adding the UIView programmatically? – Ryan Dailey Apr 14 '18 at 20:42
i followed this tutorial https://www.youtube.com/watch?v=uBesaTUJZi0 i don't know how the UIView work because I'm beginner in the video they added a prototype cell and they customize it by adding some textfields and image.. – Elyas Bennani Apr 14 '18 at 20:44

tableview xcode swift with rounded borders

2 Answers2