Dynamic UIViewCell Vertical Cell scrolling with Horizontal UICollectionViewFlowLayout

Question

I have a collection view that displays a detailed view of an article with dynamic content size.
I have multiple items in the collection view that can be scrolled horizontally.

When the horizontal flow layout is active, the dynamic cell cannot be scrolled vertically and the content gets hidden under the view.

If I disable the horizontal flow layout, I can scroll the content vertically. But, all the other items gets stacked on the bottom of each cell.

I am basically looking for a news portal like layout, where a user can scroll through the content of the article vertically, and also scroll horizontally through the list of articles.

I have setup my collection view this way.

lazy var blogDetailCollectionView: UICollectionView =
{
    let layout = UICollectionViewFlowLayout()
    layout.scrollDirection = .horizontal
    layout.minimumInteritemSpacing = 0
    //layout.itemSize = UICollectionViewFlowLayoutAutomaticSize
    let blogDetailCollection = UICollectionView(frame: .zero, collectionViewLayout: layout)
    blogDetailCollection.delegate = self
    blogDetailCollection.dataSource = self
    blogDetailCollection.backgroundColor = .white
    blogDetailCollection.isPagingEnabled = true
    blogDetailCollection.translatesAutoresizingMaskIntoConstraints = false
    return blogDetailCollection
}()

The collection view cell has a dynamic height that needs to be vertically scrollable, which I have set here.

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize
{
    guard let blogDescription = blogContainer?.blogs[indexPath.item].blogDescription else {return CGSize(width: frame.width, height: frame.height)}

    let widthOfTextView = frame.width
    let size = CGSize(width: widthOfTextView, height: 1000)
    let attributes = [NSAttributedStringKey.font: UIFont.systemFont(ofSize: UIFont.labelFontSize)]

    let estimatedFrame = NSString(string: blogDescription).boundingRect(with: size, options: .usesLineFragmentOrigin, attributes: attributes, context: nil)

    let blogImageHeight = frame.width * (2 / 3)

    return CGSize(width: widthOfTextView, height: estimatedFrame.height + blogImageHeight)
}

The collection view has multiple items, which needs to be scrolled horizontally.

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int
{
    return (blogContainer?.blogs.count)!
}

score 0 · Answer 1 · 2018-04-10T11:35:06.953

0

Have you tried.Setting the collectionView

    let layout:UICollectionViewFlowLayout = UICollectionViewFlowLayout()
    layout.itemSize = CGSize(width: screenWidth/2,height: 200)
    layout.scrollDirection = .horizontal
    layout.minimumInteritemSpacing = 1
    layout.minimumLineSpacing = 1
    collectionView.setCollectionViewLayout(layout, animated: true)

And set the collection view for both horizontal or vertical scroll when the button tapped declare the layout globally above viewDidLoad().

edited Apr 10 '18 at 11:35

answered Apr 10 '18 at 11:28

How do I set the collectionview for both horizontal and vertical scroll? The above code is almost the same as what I did, it stops the content of the cell from scrolling vertically. – kshitiz_7 Apr 10 '18 at 11:37
1

if the vertical button is pressed i presume then paste the same code i posted as answer and change scrolldirection as vertical – Apr 10 '18 at 12:19
I have edited my question and added the code, maybe you will understand the problem now. – kshitiz_7 Apr 11 '18 at 05:31

Dynamic UIViewCell Vertical Cell scrolling with Horizontal UICollectionViewFlowLayout

1 Answers1