UITableViewCell: rounded corners and shadow

Question

I\'m changing the width of a UITableViewCell so that the cell is smaller but the user can still scroll along the edges of the tableview.

override func layout         


        

Answer 1

To create shadow and corner for cell you need only one backView. See my example below.

You have to add backView and set leading, trailing, top, bottom constraints equal to Content view. Put you content to backView with appropriate constraints, but be sure your content not over cover backView.

After that in your cell initialisation code add these lines:

override func awakeFromNib() {
    super.awakeFromNib()

    backgroundColor = Colors.colorClear

    self.backView.layer.borderWidth = 1
    self.backView.layer.cornerRadius = 3
    self.backView.layer.borderColor = Colors.colorClear.cgColor
    self.backView.layer.masksToBounds = true

    self.layer.shadowOpacity = 0.18
    self.layer.shadowOffset = CGSize(width: 0, height: 2)
    self.layer.shadowRadius = 2
    self.layer.shadowColor = Colors.colorBlack.cgColor
    self.layer.masksToBounds = false
}

Don't forget to create IBOutlet for Back View.

And here the result: