How to set padding/margin and corner radius to TableViewCell of TableView?

Question

I've UITableView and I wants set corner radius and a margin/padding to Top/Right/Left/Bottom. But, if I try set this, my layout is messing. And, when I try: cell.cellView.layer.cornerRadius = 20.0 fires nil pointer exception.

My layout is like this:

A example of I like that my layout be:

I wants that my cells stay "floating" with corner radius and margins, without mess my layout builded.

Also about UITableView, how I remove the unused cells? I have only 3 cells, but TableView shows all cell possibles, leaving others cell not useds.

Also (4): Why my cells appears united? This not appears "floating"

This answer [https://stackoverflow.com/a/33234181/7698092] will also be helpful — Awais Fayyaz, Apr 28 '18 at 07:14

score 2 · Accepted Answer · answered Apr 27 '18 at 05:11

2

For your require layout do below steps.

Add UIView in you cell contentView with Leading, Top, Trailing, Bottom Constraint. Like (15, 10, 15, 10)
Select that UIView and check Clip to Bounds checkmark.
Add your required UI inside that UIView.
Set UIView cornerRadius inside layoutSubviews() inside your cell file

And to remove UnUsed cell write this line your viewDidLoad -> self.tblVW.tableFooterView = UIView.init(frame: .zero)

Here is demo Link: https://www.dropbox.com/s/815loyp20r0oetf/Demo.zip?dl=0

answered Apr 27 '18 at 05:11

Kuldeep

4,466
8
32
59

Yes, this apparently works, but look my edition, the cells appears a one background white, not stay floating. – Augusto Apr 27 '18 at 05:13
@Augusto, iam not getting your point? upload image that type of output you want. – Kuldeep Apr 27 '18 at 05:15
@Augusto this link contains the same `layout` like 2nd image, only labels are different. – Kuldeep Apr 27 '18 at 05:16
@Augusto, did you see this demo? – Kuldeep Apr 27 '18 at 05:18
Oh yes, this Demo is perfectly what I need – Augusto Apr 27 '18 at 05:20
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/169907/discussion-between-kuldeep-and-augusto). – Kuldeep Apr 27 '18 at 05:20
I try follows your demo, but I can't obtain the same result. Please you can help me? – Augusto Apr 30 '18 at 13:03
@Augusto, hi what's the problem? – Kuldeep May 01 '18 at 12:54
I did solved, but only works when I create the .xib file checking the box on creating a new cocoatouch class file. If, I create separate, not works. – Augusto May 01 '18 at 15:00
@Augusto, ca you give me link of your demo project so I can see it and let you know whats the problem – Kuldeep May 02 '18 at 05:41

Roshan · Answer 2 · 2018-04-27T01:43:46.527

0

I am assuming you are taking a view inside table view cell on which your all content is present. that is why your using cell.cellView

what you need here is that just add this line too if in case you are missing.

cell.cellView.clipToBounds = true

This should work.

In case you are not taking an UIView inside cell content view then follow this steps.

Take a UIView from object library.
give it required margins inside cell content view.
add all your required UI components in this view.
set clipToBounds to true along with cornerRadius

edited Apr 27 '18 at 01:43

answered Apr 27 '18 at 01:37

Roshan

712
4
17

better contextualize your solution, please. I don't know where I set margin to make more easy I design my UI inside margin limits on UIView – Augusto Apr 27 '18 at 04:30
I do other question in my question, if you can reply please do this. – Augusto Apr 27 '18 at 04:38

How to set padding/margin and corner radius to TableViewCell of TableView?

2 Answers2