Auto Cell Height on UITableView without overlapping bottom part of iPhone X

Question

So my goal is to achieve automatic height for my table view. What I mean by by that is whenever I add new item to the table view, the table is still "full screen" while the cell is decreasing its height.

for example this is what I've done :

on iPhone 6s Simulator

on iPhone 5s Simulator

and I've achieve that using code :

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
    let itemCount:CGFloat = CGFloat(items.count)
    let statusHeight = UIApplication.shared.statusBarFrame.height
    let navHeight = self.navigationController!.navigationBar.frame.height-statusHeight
    let viewHeight = view.bounds.height
    let cellHeight = (viewHeight-navHeight)/itemCount
    return cellHeight
}

but the problem is that in iPhone X it was doing something like :

on iPhone X Simulator

the bottom part of the bottom item is cut/overlapped. How can I fix it?

Thank you.

Edit :

Thanks for the answer Trupesh Vaghasiya and Pankaj I've done your solution, couldn't find it but this is what I've done {Screenshot}

But the outcome was like this {iPhone X Screenshot}. Don't you think that's violates the iPhone X UI guideline?

Do you want to show 3 Cell ? directly return tableview.frame.height / 3. No need for status bar and etc — Prashant Tukadiya, Nov 22 '18 at 07:43
if you've solved the issue on other sized phones the issue should be with the frame of your scrollview not the cells. — Alex Bailey, Nov 22 '18 at 07:45
Do you mean you want to remove the white area in the bottom? — TienLe, Nov 22 '18 at 07:47
@PrashantTukadiya yes, well, I want it to be dynamic. so whenever I add or remove cell, the cell height will fill up the screen. — Gelar Aulia Prima Putra, Nov 22 '18 at 07:55
@AlexBailey so by that you mean the problem isn't the cell height, but more like the table height? — Gelar Aulia Prima Putra, Nov 22 '18 at 07:55
@TienLe yup, well, not really remove it, but decreasing the table height so the white area aren't overlapping the table. — Gelar Aulia Prima Putra, Nov 22 '18 at 07:57
Because it is safe area. Look back your layout, change to superView instead Safe area — TienLe, Nov 22 '18 at 08:02

score 1 · Answer 1 · answered Nov 22 '18 at 09:04

1

You need to change TableView Bottom Constraint First Item Safe Area to give SupperView.

Let us know... is working?

answered Nov 22 '18 at 09:04

Trupesh Vaghasiya

417
4
15

Thank you, I'll try that soon. I'll inform you if it's working. – Gelar Aulia Prima Putra Nov 23 '18 at 02:26
It seems the answer isn't working as I intended. I've edited my answer. could you check it? – Gelar Aulia Prima Putra Nov 23 '18 at 03:32

score 0 · Answer 2 · answered Nov 22 '18 at 08:41

0

Just change your Interface constraint relevant to superView instead of safe area. Check your tableview top and bottom Constraint and make it related to superView. but as per apple said, it is good if you make it related to safe area as iPhone X and higher version have home button on screen so. you can check bellow screen shots. Select Bottom Constraint

answered Nov 22 '18 at 08:41

Pankaj K.

535
8
18

Thank you for your answer. I've done your solution but It seems the answer isn't working as I intended. I've edited my answer. could you check it? – Gelar Aulia Prima Putra Nov 23 '18 at 03:34

score 0 · Answer 3 · answered Nov 23 '18 at 03:39

0

Select constraint that you want to change and Double Click at there.

And then select First Item and then select Superview

answered Nov 23 '18 at 03:39

Supanat Techasothon

417
5
11

alright thank you, gonna try it soon. I'll inform you as soon as I implement your answer. – Gelar Aulia Prima Putra Nov 23 '18 at 04:27

Auto Cell Height on UITableView without overlapping bottom part of iPhone X

3 Answers3