Card Slide Gallery in UIViewController

Question

Is there a way to implement a card sliding gallery in a UIViewController? The gallery is not supposed to have images but buttons. I'm thinking the app "Bumble" for example when it comes to their subscription process. You can swipe through 2 cards to choose your subscription model. This has to be implemented in a UIViewController .. Any chance to get this done?

Answer 1

You can try using UICollectionView to emulate how bumble cardview works

make the scroll direction to horizontal and disable the scroll indicator

and then, add UICollectionViewDelegateFlowLayout protocol and use these two bad boys

    func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
        
    }

    func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {
        
    }

what the two of them do is detect when the scroll gesture is decelerating and end of the scroll gesture. You can try to engineered the movement

here's an example how I implement it

    private lazy var collectionView:UICollectionView = {
        let layout = UICollectionViewFlowLayout()
        layout.scrollDirection = .horizontal
        //layout.itemSize = CGSize(width: 330, height: 150)
        layout.sectionInset = UIEdgeInsets(top: 0, left: 20, bottom: 0, right: 20)
        let collectionView = UICollectionView(frame: CGRect(x: 0, y: 70, width: UIScreen.main.bounds.width, height: 150),collectionViewLayout: layout)
        collectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: "cell2")
        collectionView.showsHorizontalScrollIndicator = false
        collectionView.backgroundColor = .clear
        return collectionView
    }()

delegate :

    func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
        self.collectionView.scrollToNearestVisibleCollectionViewCell()
    }

    func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {
        if !decelerate {
            self.collectionView.scrollToNearestVisibleCollectionViewCell()
        }
    }