Reputation: 900

UITableViewCells bottom edge flickering when app enters foreground

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.

Upvotes: 6

Answers (13)

Dogan Altinbas

Reputation: 461

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.

Upvotes: 1

Houcem Eddine Soued

Reputation: 236

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.

Upvotes: 1

iosdvlpr

Reputation: 595

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()
}

Upvotes: 2

naeemjawaid

Reputation: 514

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)

Upvotes: 0

Pratik Sodha

Reputation: 3727

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

PlainTable SS

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

Upvotes: 1

Karthick Ramesh

Reputation: 1486

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

Upvotes: 1

Amit gupta

Reputation: 553

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.

Upvotes: 0

Sean

Reputation: 56

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

Upvotes: 0

AD Progress

Reputation: 5146

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.

Upvotes: 0

arturdev

Reputation: 11039

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.

Upvotes: 1