Collection view item is getting cut off

[ssamkough]

Hi there!

I'm coming across an issue where my item gets cut off before showing it's full contents. I've attached a video of me using it.

RPReplay_Final1612853381.MP4

[MaherKSantina]

Thanks @ssamkough for contributing to this repo by raising this issue!
I was wondering are you using the latest version of the library?
If yes, can you try this for me:
Print out the frame width for the peeking collection view and see if it's the same as the device's frame. I can see that the scrolling doesn't work for the subsequent collection items as they are cut off and not shown in center properly.
Seems that the calculation of the offset of items is not correct
The ideal case for me would be if you're able to share with me a minimal example project that has the issue, this way I'm able to investigate it properly and work on a fix

[ssamkough]

I am using version 3.1.1.

I will print the values and tell you what I see. In the meantime, here is an example of my project:

import MSPeekCollectionViewDelegateImplementation
class FeedController: UITableViewController {
    var posts = [Post]()
    var behavior: MSCollectionViewPeekingBehavior!

    override func tableView(_ tableView: UITableView,
                            willDisplay cell: UITableViewCell,
                            forRowAt indexPath: IndexPath) {
        behavior = MSCollectionViewPeekingBehavior(cellSpacing: 15)
        cell.taggedProductsCollectionView.configureForPeekingBehavior(behavior: behavior)
        cell.taggedProductsCollectionView.delegate = self
        cell.taggedProductsCollectionView.dataSource = self
    }

    override func scrollViewWillEndDragging(_ scrollView: UIScrollView,
                                            withVelocity velocity: CGPoint,
                                            targetContentOffset: UnsafeMutablePointer<CGPoint>) {
            behavior.scrollViewWillEndDragging(scrollView,
                                               withVelocity: velocity,
                                               targetContentOffset: targetContentOffset)
    }
}

extension FeedController: UICollectionViewDataSource,
                          UICollectionViewDelegate,
                          UICollectionViewDelegateFlowLayout {

    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return posts[collectionView.tag].taggedProducts.count
    }

    func collectionView(_ collectionView: UICollectionView,
                        cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        guard let cell = collectionView.dequeueReusableCell(
            withReuseIdentifier: "taggedProductCell",
            for: indexPath) as? TaggedProductCell else {
                fatalError("Unexpected index path, problem dequeuing resuable cell.")
            }
        let taggedProduct = self.posts[collectionView.tag].taggedProducts[indexPath.item]
        cell.taggedProduct = taggedProduct
        cell.taggedProductDelegate = self
        return cell
    }

    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
        let taggedProduct = self.posts[collectionView.tag].taggedProducts[indexPath.item]
        let layout = UICollectionViewFlowLayout()
        layout.scrollDirection = .horizontal
        layout.minimumLineSpacing = 10
        layout.minimumInteritemSpacing = 10
        collectionView.scrollToItem(at: indexPath, at: .bottom, animated: false)
        layout.sectionInset = UIEdgeInsets(top: 0, left: 10, bottom: 0, right: 10)
        collectionView.setCollectionViewLayout(layout, animated: false)
    }
}

[ssamkough]

Print out the frame width for the peeking collection view and see if it's the same as the device's frame. I can see that the scrolling doesn't work for the subsequent collection items as they are cut off and not shown in center properly.

By the peeking collection view do you mean the collection view, or just the peeking part of it? Because the collection view is the same size as the device (using constraints), but each item has a custom width of 373. This is all configured within a storyboard.

[MaherKSantina]

Hey @ssamkough really sorry I didn't receive a Github notification for your comments 😢 Okay so let's do a little debugging. Can you try to move the whole collection view outside the cell? Like have it directly in the view controller? I'm expecting that having the collection view inside a table view cell will cause the frames not to be calculated properly. If the collection view behaves properly there, then I think you might need to initialize the peeking and everything in the viewDidLayoutSubviews function. This way we're sure that the frame calculations are all done by then
Hope that helps, especially that it's 20 days late 😢

[alexookah]

Hello @MaherKSantina
I am also experiencing the same issue.
I have a collectionView inside UITableViewHeaderFooterView.
When using cellPeekWidth the scroll calculations are wrong. If set to 0 the scrolling is correct.
I tried to put the initialize of the behaviour inside layoutSubviews()
I even tried to set the collectionViewFrameWidth same as the device's width before creating the behaviour
collectionView.frame.size.width = UIScreen.main.bounds.width
in order to have correct calculations, but that didn't help either.

[alexookah]

@MaherKSantina
here you can find my example implementation:
https://github.com/alexookah/MSPeekCollectionView-Example

[alexookah]

I resolved the issue @ssamkough @MaherKSantina.

If the collectionView is inside a tableview it needs:
collectionView.isPagingEnabled = false

Something similar exists in UICollectionView+PeekConfiguration.swift:
collectionView.configureForPeekingDelegate()

[alexookah]

@MaherKSantina
this issue can be closed