Custom presented UINavigationController glitches with UICollectionView's contentOffset during transition

212 views Asked by At

I found a weird bug today. Here's a gif. enter image description here

And for good measure an image showing it clearly. enter image description here

As you can see, the UICollectionView in the topViewController gets a weird choppy offset behaviour before pushing to the next view controller.

I suspect the issue might lie with the custom presentation of the UINavigationController which presents the horizontal cards that I push from.

Here's the custom code for how that goes down. The view controller that glitches is just an ordinary navigationController?.pushViewController(viewController, animated: true) pushed from the top view controller.

Snippet A - Presentation

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
    guard let viewModel = viewModel else { return }
    // V This is a UINavigationController
    let viewController = viewModel.getViewController(displayingOfferAt: indexPath.item)
    viewController.modalPresentationStyle = .custom
    viewController.transitioningDelegate = self
    present(viewController, animated: true)
}

Snippet B - Transitioning delegate

extension StorefrontViewController: UIViewControllerTransitioningDelegate {
    func presentationController(forPresented presented: UIViewController, presenting: UIViewController?, source: UIViewController) -> UIPresentationController? {
        switch presented {
        case is CashStore.FullNavigationController:
            return CashStore.FullPresentationController(presentedViewController: presented, presenting: presenting)
        default:
            return nil
        }
    }
}

Snippet C - The presentation controller

class FullPresentationController: UIPresentationController {

    // MARK: Outlets

    private lazy var backgroundView: UIView = {
        $0.isUserInteractionEnabled = true
        $0.backgroundColor = #colorLiteral(red: 0, green: 0, blue: 0, alpha: 0.8016641695)

        return $0
    }(UIView())


    // MARK: Overrides

    override func containerViewDidLayoutSubviews() {
        super.containerViewDidLayoutSubviews()

        presentedView?.frame = frameOfPresentedViewInContainerView
        backgroundView.frame = containerView!.bounds
    }

    override func presentationTransitionWillBegin() {
        backgroundView.alpha = 0.0
        containerView?.addSubview(backgroundView)
        presentedViewController.transitionCoordinator?.animate(alongsideTransition: { context in
            self.backgroundView.alpha = 1.0
        })
    }

    override func dismissalTransitionWillBegin() {
        presentedViewController.transitionCoordinator?.animate(alongsideTransition: { context in
            self.backgroundView.alpha = 0.0
        }, completion: { context in
            self.backgroundView.removeFromSuperview()
        })
    }


    // MARK: Actions

    @objc func dismiss() {
        presentingViewController.dismiss(animated: true)
    }
}
class FullNavigationController: TiseNavigationController {
    override func viewDidLoad() {
        super.viewDidLoad()

        view.backgroundColor = .clear
    }
}

Snippet D - Custom collection view layout for snapping

class ProductFlowLayout: UICollectionViewFlowLayout {

    override init() {
        super.init()
        scrollDirection = .horizontal
    }

    required init?(coder _: NSCoder) {
        return nil
    }

    override func targetContentOffset(forProposedContentOffset proposedContentOffset: CGPoint, withScrollingVelocity velocity: CGPoint) -> CGPoint {
        guard let collectionView = collectionView else {
            return super.targetContentOffset(forProposedContentOffset: proposedContentOffset, withScrollingVelocity: velocity)
        }

        var offsetAdjustment = CGFloat.greatestFiniteMagnitude
        let horizontalOffset = proposedContentOffset.x + collectionView.contentInset.left

        let targetRect = CGRect(x: proposedContentOffset.x, y: 0, width: collectionView.bounds.size.width, height: collectionView.bounds.size.height)

        let layoutAttributesArray = super.layoutAttributesForElements(in: targetRect) ?? []

        for attributes in layoutAttributesArray where fabsf(Float(attributes.frame.origin.x - horizontalOffset)) < fabsf(Float(offsetAdjustment)) {
            offsetAdjustment = attributes.frame.origin.x - horizontalOffset
        }

        let flowDelegate = collectionView.delegate as? UICollectionViewDelegateFlowLayout
        let leftInset = flowDelegate?.collectionView?(collectionView, layout: self, insetForSectionAt: 0).left ?? 0.0
        let targetOffset = CGPoint(x: proposedContentOffset.x + offsetAdjustment - leftInset, y: proposedContentOffset.y)

        return targetOffset
    }
}

I have tried disabling content offset adjustment, which did not change anything. I also tried disabling maskToBounds on both the view controller with the cards and the collection view, to no avail. Sorry for the over-length question, I hope someone can help me out with this weird glitch!

0

There are 0 answers