Remove thin-like border when focusing a custom UITableCell

Question

Question:

How do I remove the thin-like white border when focusing a custom UITableCell?

(In all honesty it has nothing to do with the border of a cell, I've tried modifying the color of the border to see)

Description:

This seems to only occur when I leave the default focus style for the table cell via the storyboard, when I remove the default focus animation on the cell, the white borders do not appear (but then I have to implement my own custom animation..)

I've attempted to play around with different colors and tints but that didn't seem to work.

Above gif is showing the white border appearing when focusing a specific UITableCell

Screen shots of my UITableViewController Storyboard.

Image above is a screenshot of the attribute inspector for the UITableViewCell

Image above is a screenshot of the attribute inspector for the Content View of my UITableViewCell

Image above is a screenshot of the attribute inspector for the UITableView

Answer 1

Updated:

It's not border, but shadow. Now UITableViewCellFocusStyle.default is probably setting shadow to cell while focusing and when you scroll then even after hiding it, shadow is visible for a short period.

You can hide the shadow like this:

func tableView(_ tableView: UITableView, didUpdateFocusIn context: UITableViewFocusUpdateContext, with coordinator: UIFocusAnimationCoordinator) {
     if let cell = context.nextFocusedView as? CustomTableViewCell {
        cell.layer.shadowOpacity = 0
        cell.layer.masksToBounds = true
     }
     //other configurations
}

Note 1: Shadow appears for a short period of time using above code. Use below code for no shadow.

Alternatively, you can use UITableViewCellFocusStyle.custom and give default focus animation without shadow manually like this:

func tableView(_ tableView: UITableView, didUpdateFocusIn context: UITableViewFocusUpdateContext, with coordinator: UIFocusAnimationCoordinator) {
    let xScale = 1.008
    let yScale = 1.008
    if let cell = context.nextFocusedView as? CustomTableViewCell {
           coordinator.addCoordinatedAnimations({ () -> Void in
                cell.transform = CGAffineTransform(scaleX: CGFloat(xScale), y: CGFloat(yScale))
            }, completion: nil)
    }

    if let previous = context.previouslyFocusedView as? CustomTableViewCell {
        coordinator.addCoordinatedAnimations({ () -> Void in
            previous.transform = CGAffineTransform.identity                
        }, completion: nil)
    }
    } 

Note:

Try playing with xScale & yScale values for better animation.