Make Table View Cells to fill up the screen exactly in Swift

Question

I have three cells in my UITableView which I built in the storyboard, when I run it I have got three cells as expected in the simulator and then blank space underneath. What I want to do is have the cells to dynamically fill up the screen depending on the iOS device. How do i do that?

@Eric well I am planning to add few other cells and I want them to be evenly aligned to fill the screen so I guess to answer your question - yes — user3395936, Mar 14 '16 at 18:27

score 9 · Accepted Answer · edited Jul 23 '19 at 21:53

9

Set a minimum height for the cell, if there are few items, use even height, otherwise use minHeight.

let MinHeight: CGFloat = 100.0
override func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
    let tHeight = tableView.bounds.height

    let temp = tHeight/CGFloat(items.count)

    return temp > MinHeight ? temp : MinHeight
}

Update for Swift 5:

let minRowHeight: CGFloat = 100.0

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
    let tHeight = tableView.frame.height
    let temp = tHeight / CGFloat(items.count)
    return temp > minRowHeight ? temp : minRowHeight
}

edited Jul 23 '19 at 21:53

DeepBlue

591
9
18

answered Mar 14 '16 at 19:18

dichen

1,643
14
19

Thank you for your suggestion, and how do i call the number of cells in my table? I see you are using `items.count` to get that number – user3395936 Mar 14 '16 at 19:51
items here is the entities you need to show in the table, just replace it to your own object. If you don't know the concept `UITableViewDataSource`, look for some tutorials of UITableViewController, e.g. https://www.ralfebert.de/tutorials/ios-swift-uitableviewcontroller/ – dichen Mar 14 '16 at 19:56
Perfect solution ! Thanks ! – w3spi Jul 24 '16 at 11:32
what if table cells have automatic height? – Vyachaslav Gerchicov Aug 17 '21 at 06:08

score 1 · Answer 2 · edited May 23 '17 at 10:29

1

Is there a reason you are using a UITableView for this? The TableView really doesn't buy you any real benefits if you are going to fit it onto the screen and aren't going to have a variable number of cells with the ability to scroll.

If you simply want to have 3 views, each with 1/3 of the screen height, you could simply use IB to set up each view to be 1/3rd of the screen using the method in this answer

Or if you want to use autolayout, which is the better solution, you can do it using this technique.

edited May 23 '17 at 10:29

Community

1
1

answered Mar 14 '16 at 18:26

wottle

13,095
4
27
68

The reason I asked this question was because when i actually click on the cells, it doesn't give me options to change the sizing or anything like that. All the alignment functionality is greyed out, so looking at your suggested answers, I am not able to implement any of them. And to answer your question : I am not intending to add cells programmatically , I just want to have around 5 fixed cells with equal ratio. – user3395936 Mar 14 '16 at 18:38
If you have to use a TableView, I would use @RWhoot's answer and implement `(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath` If there are 5 cells, will they all fit on the screen, or will only 3 fit at any time and you need to scroll to see the rest? – wottle Mar 14 '16 at 18:45
When you say 'If you have to use a TableView', what is the alternative you have in mind? I mean I am just to new to developing in iOS and the only method I know is to create a UITableView and add cells to it manually – user3395936 Mar 14 '16 at 18:50
If you have a fixed number of areas, you could add a UIView for each area. a TableView adds overhead to things that really only help with a large number of items that will require scrolling, or at the very least a dynamic number of items. You could also look into `UIStackView`: http://www.appcoda.com/stack-views-intro/ – wottle Mar 14 '16 at 19:03
That looks great but I want to add a disclosure indicator so that when the cell is clicked it will take the user to a separate view – user3395936 Mar 14 '16 at 19:35

score 0 · Answer 3 · answered Mar 14 '16 at 18:28

0

In your UITableViewDataSource set up the - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath method to calculate the height of the rows based on the height of the UITableView's content height.

answered Mar 14 '16 at 18:28

Rwhoot

51
4

Thanks for your suggestion. What is a `UITableViewDataSource`? And is the piece of code you provided in ObjC? – user3395936 Mar 14 '16 at 18:49

score 0 · Answer 4 · answered Mar 14 '16 at 18:31

0

Set zero height footer view at your viewDidLoad method.

tableView.tableFooterView = UIView()

answered Mar 14 '16 at 18:31

Muzahid

5,072
2
24
42

1

Your suggestion removes the extra cells, but doesn't align the cells like I have described in my question. – user3395936 Mar 14 '16 at 18:39

Make Table View Cells to fill up the screen exactly in Swift

4 Answers4