Set the width of UITableViewCell

Question

I want to create UITableView with horizontal space like this:

So I found a solution here

But it seems that it does not work the function 'setFrame' won't work with iOS9, So I found another suggestion to use layoutSubviews

override func layoutSubviews() {
    super.layoutSubviews()

    self.contentView.frame = UIEdgeInsetsInsetRect(self.bounds, UIEdgeInsetsMake(0, 10, 0, 10))
}

But it does not work also here is what I get:

So how to add properly horizontal space, I'm using Swift 2, Xcode7, Storyboard with custom UITableViewCell

try :- self.contentView.frame = UIEdgeInsetsMake(0, 20, 0, 20) — Mudith Chathuranga Silva, Sep 23 '15 at 04:11
it gives "Cannot assign a value of type 'UIEdgeInsets' to a value of type 'CGRect'" — iOSGeek, Sep 27 '15 at 17:03

score 11 · Accepted Answer · answered Sep 27 '15 at 17:31

Ok, So here's one way of doing this by making a custom cell.

You can set a background color on the TableView to grey.

Then in your custom prototype UITableViewCell

Set the background color to transparent.
Drag UIView on it and change its color to White or whatever u like.
Set the constraints left, right, top and bottom to at least 5 from the view to the cell.
Make sure you use the delegate methods to set automatic height and then estimated height, if you cell will have dynamic height.
Also remove the separator in the table view so that there is no line.
Inside the view you can drop a label to add text.

I think that should serve your purpose, let me know how it goes :)

rudd · Answer 2 · 2015-09-29T21:01:24.473

4

Please don't try and change around the frame of contentView, Apple does not state that this is possible. You have a few options here, in order of preference:

This is what UICollectionView is built for. UICollectionView makes it completely trivial to change the flow between your various cells. Consider switching your implementation to use a UICollectionView and take a look at subclassing UICollectionViewFlowLayout (or just setting up your layout directly in IB)
If you must use UITableView: Create a class that encapsulates the view that you'd like to be in the cell. Then make your table view the width of the screen, and the cells the height of the content plus the vertical margin. Add your view directly to the cell's contentView with the appropriate, inset frame.

edited Sep 29 '15 at 21:01

answered Sep 27 '15 at 22:05

rudd

846
7
17

1

+1 There is no need to customise `UITableView` like that, `UICollectionView` has all this functionality that you need and that's behaviour can be set with storyboard without writing a line of code! – Jakub Sep 29 '15 at 20:07
@Kuba good point, edited to indicate that you can do all of the collection view stuff in IB – rudd Sep 29 '15 at 21:00

score 2 · Answer 3 · answered Sep 27 '15 at 17:20

2

I think you should not try to update frame of the contentView. You should add a view(as a parent view) under your contentView and then apply all constraint to that UIView.

answered Sep 27 '15 at 17:20

Shoaib

2,286
1
19
27

I agree. have a containerView inside the contentView and let iOS size the contentView – Daij-Djan Sep 27 '15 at 17:57

score 1 · Answer 4 · answered Sep 28 '15 at 10:10

1

You may try to subclass a cell and override setFrame:

- (void)setFrame:(CGRect)frame {
   frame.origin.x += inset;
   frame.size.width -= 2 * inset;
   [super setFrame:frame];
}

answered Sep 28 '15 at 10:10

Tim

1,877
19
27

JAY RAPARKA · Answer 5 · 2015-09-30T07:17:48.890

You can also try this solution If you are using Custom tableview cell in Xib than

step1: RightClick on cell xib step2: Open As > source code step3: try to find <tableViewCellContentView> tag section. step4: find autoresizingMask tag below <tableViewCellContentView> and add widthSizable="YES" in <autoresizingMask> tag for example

`<tableViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" tableViewCell="1Ah-hd-rCV" id="Xqs-eb-z8W">`

    `<autoresizingMask key="autoresizingMask" widthSizable="YES"/>`
`</tableViewCellContentView>`

it Looks like above code after setting this.

because tableviewcell's content view does not autoresize width so you have to code for that. Like above.

and if you are adding cell by programming than this will not help you have to create xib for tableviewCell and in storyboard this will work also you have to open source code by right clicking on storyboard.

put UIView in tableViewCell and make cell background clear and tableview you want to grey than set its background color grey and make size of UIView you want to display and do it horizontally stretched in autoresizing mask.

Hope this will help you. Thank you!

@iOSGeek if you found solution for that than it is very good but i have post new answer for that Because you were not accept any answer still so i have post new answer. — JAY RAPARKA, Sep 30 '15 at 06:56
@iOSGeek you have to accept answer because if another user has same problem like you so he/she can easily find right answer so it's your responsibility that your used solution you have to accept. It will help other users. Thank you! — JAY RAPARKA, Sep 30 '15 at 06:59

Set the width of UITableViewCell

5 Answers5