UITableViewCells bottom edge flickering when app enters foreground

Question

I've build an app which contains an UITableView with a bunch of cells. Inside the cells I've got a view, which fill the whole cell. I've configured the tableview like this:

tableView.separatorStyle = .none
tableView.backgroundColor = UIColor(red: 24/255.0, green: 34/255.0, blue: 41/255.0, alpha: 100)
tableView.separatorColor = UIColor(red: 26/255.0, green: 34/255.0, blue: 40/255.0, alpha: 100)

Whenever the app enters the foreground, I got those little lines flickering for 0.5 seconds or so. To be clear, I don't want those.

And this is how it looks like when the app fully entered the foreground, and how it is supposed to look like:

Any ideas how to get rid of them?

EDIT 1:

I'm starting to doubt that the flickering is related to the separators, because it is only happening between cells in a section, not between the section-cell and the first cell in a section. I've grabbed some screenshots of the view hierarchy and the constraints related to the view (Foreground view) I show in the cell.

EDIT 2:

If I set the top and bottom constraint to -2 instead of 0, there's no flickering at all, however it's not as I want it visually. So the flickering is not related to the separators at all.

Where are you setting the `tableView.separatorStyle = .none`? Is it in viewDidLoad? — digitalHound, Aug 19 '18 at 17:17
Yea, it's in the viewDidLoad. I tried viewWillAppear too, without any luck. — Recusiwe, Aug 19 '18 at 19:18
Are you using a launchScreen or launch Images? If you are not using a launch screen try switching to one see if that helps. — Daniel Lyon, Aug 21 '18 at 17:19
I am, but as mentioned it's just a problem when it enters foreground from background, not when the app initially is launched. — Recusiwe, Aug 21 '18 at 19:10
If you build a minimal working example, which can be used to replicate the issue, it would be much easier to help. — Milan Nosáľ, Aug 22 '18 at 05:01
Try adding `Renders with edge antialiasing.' true to your inf'o.plist — Daniel Lyon, Aug 23 '18 at 23:00
are you reloading the tableview or updating the data source when coming to foreground? — Karthick Ramesh, Aug 24 '18 at 01:30
can you try setting a background color to the separator as the same color as tableview background? this way if the line doesnt appear when you come to foreground from background, we can confirm that the line separator is the issue. — Karthick Ramesh, Aug 24 '18 at 01:43
Also can you try setting "Renders with edge antialiasing" to YES in your info.plist? — Karthick Ramesh, Aug 24 '18 at 01:47
You aren't supposed to vote down if an answer doesn't work for you. Just imagine if people simply didn't like your question just for kicks and started voting down, how'd the situation be for you. Voting down should be done when the answer either is way off base, or is not presented clearly. Reps are prized possession, you should not eat into other people's for no good reason. — Manganese, Aug 24 '18 at 05:21
@Recusiwe - setting "Renders with edge antialiasing" worked? — Karthick Ramesh, Aug 26 '18 at 14:04
Also i can see that someone downvoted me because i was at 2. Is it fare? Do any one know how to raise this issue? — Karthick Ramesh, Aug 28 '18 at 22:12

score 2 · Answer 1 · answered Aug 25 '18 at 16:42

Trick for removing the cell separators.

Objective-C

- (void)viewDidLoad {
    [super viewDidLoad];

    self.tableView.tableFooterView = [UIView new];
}

Swift

override func viewDidLoad() {
    super.viewDidLoad()

    tableView.tableFooterView = UIView()
}

score 1 · Answer 2 · answered Aug 22 '18 at 20:59

1

Usually flickering happens when you're returning a wrong heightForRowAtIndexPath.
In your case, you're returning a little smaller than your cell's actual height I guess.
So try to set "clipToBounds" of your cell to "true" and check if it works.

answered Aug 22 '18 at 20:59

arturdev

10,884
2
39
67

1

@Recusiwe one more strange thing that I noticed is that the ContentView of your TableViewCell is missing. By default, when you're dragging UITableViewCell to IB it comes with a ContentView. But in your screenshot, it's missing. Or you've just renamed it? – arturdev Aug 23 '18 at 06:48
I just renamed it, it's the "Background Container View" – Recusiwe Aug 23 '18 at 09:17

score 1 · Answer 3 · answered Aug 24 '18 at 05:41

1

Try setting "Renders with edge antialiasing" to YES in your info.plist.

answered Aug 24 '18 at 05:41

Karthick Ramesh

1,451
20
30

score 1 · Answer 4 · edited Aug 24 '18 at 12:00

1

I think here your issue with UITableViewStyle. Right now you are using UITableViewStyle Grouped. So, line between cell isn't UITableViewCellSeparator it's Group Table 1 pixel header and footer space. So,

I have two solutions:

Either use UITableView background color same as cell background color.
Change UITableView style to Plain

GroupTable SS

or

PlainTable SS

I hope it'll help you. And solve your issue :)

edited Aug 24 '18 at 12:00

koen

5,383
7
50
89

answered Aug 24 '18 at 10:56

Pratik Sodha

3,679
2
19
38

Where do you see I use grouped? I use Plain actually. – Recusiwe Aug 25 '18 at 22:31
Share your class file.. It'll better to crack – Pratik Sodha Aug 26 '18 at 10:55

score 1 · Answer 5 · answered Aug 26 '18 at 00:13

I think it's not related to the separator, because the separator doesn't cover the whole screen, it must be related to your constraints, try changing the background color of the BackgroundContainerView, the DepartureCell and the TableView, one of these 3 views should have the dark grey color as a background color.

score 1 · Answer 6 · answered Aug 27 '18 at 20:00

1

Would it be possible that the tableview is inherited from another one and seperatorStyle could be set different in the super class? Then, you need override it.

answered Aug 27 '18 at 20:00

Dogan Altinbas

268
2
11

AD Progress · Answer 7 · 2018-08-23T04:43:01.473

0

Try setting the tableview separator color with full transparency it might help

tableView.separatorColor = UIColor(red: 26/255.0, green: 34/255.0, blue: 40/255.0, alpha: 0)

Do this in viewWillAppear

If that will not help check the view hierarchy maybe there is an issue with the cell rendering in

func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath)

Check this post and its swift 4 update

or try adding this extension to your ViewController

extension UITableViewCell {
func removeCellSeparators() {
    for subview in subviews {
        if subview != contentView && subview.frame.width == frame.width {
            subview.removeFromSuperview()
        }
    }
  }
}

then try calling it in just before you return the cell

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "YourCellIdentifier", for: indexPath)

    cell.removeSeparators()

return cell
}

if this doesn't help then please post more information about your setup, code or maybe host a minimal version of your app with the tableView having the issue on gitHub so that I can help.

EDIT 1:

Try setting the rowHeight / cellHeight to 15 pixels more than what it currently is if that will solve your problem than the cellHeight is what needs tweaking could be that it only needs to be 2-4 pixels higher. Probably as the app is entering the foreground autolayout is trying to do what it can do show everything as you want however some constraints are ambiguous therefore whilst entering from the background there is the view appearing animation from the system for about half a second and there is your flickering as well.

edited Aug 23 '18 at 04:43

answered Aug 22 '18 at 04:40

AD Progress

4,190
1
14
33

Both solutions are not working. Plus the linked answer is only for section separators. – Pranav Kasetti Aug 22 '18 at 13:08
Are you using storyboards or creating the tableView in code? – AD Progress Aug 22 '18 at 13:19
I use storyboards, and I'm starting to think that the problems isn't related to separators, but my contraints. – Recusiwe Aug 22 '18 at 19:34
Because the flickering only occurs in between cells in sections, not between the sections and the first cell. – Recusiwe Aug 22 '18 at 20:00
Could you extract the tableView code into a separate project so I can replicate the issue and be able to help you or share the current project on github?? – AD Progress Aug 23 '18 at 04:01
Try setting the rowHeight / cellHeight to 4 pixels more than what it currently is – AD Progress Aug 23 '18 at 04:36
But I want the rounded corners which this would ruin, right? – Recusiwe Aug 23 '18 at 09:21
It shouldn't do. As the corner radius is left untouched. Try it and see if it resolves the flickering issue then we can go ahead and fix other issues if any will appear – AD Progress Aug 23 '18 at 09:31
Have you tried the solution?? Have you managed to solve the problem? – AD Progress Aug 29 '18 at 09:06

score 0 · Answer 8 · answered Aug 22 '18 at 15:10

0

Set this in viewDidLoad()

tableView.separatorStyle = .none

answered Aug 22 '18 at 15:10

Kathiresan Murugan

2,783
3
23
44

Share your class – Kathiresan Murugan Aug 23 '18 at 00:54

score 0 · Answer 9 · answered Aug 22 '18 at 15:34

0

You can do it as per follows, from your storyboard to avoid that separator from UITableView.

answered Aug 22 '18 at 15:34

Bhavin Kansagara

2,866
1
16
20

score 0 · Answer 10 · answered Aug 22 '18 at 15:37

0

If you set

tableView.separatorStyle = .none

on viewDidLoad(), it will flicker

you need to it before like in viewWillAppear() or in the storyboard

answered Aug 22 '18 at 15:37

Jesus Rodriguez

2,571
2
22
38

1

Heh, did you just vote me down? Share proper code and we could help you better. – Jesus Rodriguez Aug 23 '18 at 09:16

score 0 · Answer 11 · answered Aug 23 '18 at 06:05

0

Can you use Xcode "Debug View Hierarchy" to find question View , and use "KVC" remove that view. ps. my english is poor , i hope i can help you

answered Aug 23 '18 at 06:05

Sean

56
3

score 0 · Answer 12 · edited Aug 23 '18 at 12:17

0

From storyboard select table view separator to None.
In Separator Inset select custom and remove left value make it from 15 to 0.
Build and run it again now check.

edited Aug 23 '18 at 12:17

koen

5,383
7
50
89

answered Aug 23 '18 at 11:30

Amit gupta

553
3
10

score 0 · Answer 13 · answered Aug 24 '18 at 14:55

Make tableView's backgroundColor and separatorColor exactly the same as in:

tableView.backgroundColor = UIColor(red: 24/255.0, green: 34/255.0, blue: 41/255.0, alpha: 100)
tableView.separatorColor = UIColor(red: 24/255.0, green: 34/255.0, blue: 41/255.0, alpha: 100)

UITableViewCells bottom edge flickering when app enters foreground

13 Answers13