UICollectionView Does Not Scroll (Horizontal) Inside ScrollView

Question

I need to implement following layout using IB

http://www.giphy.com/gifs/tK0FNSHglOSyg8sVWx

I am currently using the following Structure

UIScrollView
    - Content View (UIView)
        - Image Slider (FSPagerView)
        - Clinic Name (UILabel)
        - Clinic Slogan (UILabel)
        - Line Separator View
        - Clinic Profile (UITextView)
        - Section View (Custom UIView)
        - Doctors View (UICollectionView) - Horizontal Scrolling

PFB screenshot of IB

It renders me the following screen

http://www.giphy.com/gifs/fxkcxS2GbJCCQcaiCD

As you can see in above GIF, the layout is working, however I am having hard time making Collection View scroll horizontally inside UIScrollView

My question is

How do I make UICollectionView scroll horizontally within UIScrollView
If adding UICollectionView inside UIScrollView is not a good idea, what component do I use for the layout I want to achieve? (if you can just help with the idea)

PS: I tried almost all solution from StackOverflow and other sources to make UICollectionView scrollable inside UIScrollView, nothing works, however I have Implemented a similar layout programmatically (without IB & Autolayout) and it works, for your reference, here is the working code I am using https://iswift.org/playground?dmHCmv&v=3

Thank you.

How are your constraints set up on your collection view? Is the width constrained to the width of the scroll view? Are you using a default flow layout, or custom? — DonMag
Can you share your code & xib? You try set: (content view). clipsToBounds = true, I think you will not see CollectionView. — Nguyen Hoan
@NguyenHoan I will try and share in a while. I tried using CollectionView inside ScrollView with a new (test) project using IB and it works, this seems definitely an issue with Autolayout or something related. — Ibrahim Azhar Armar
@NguyenHoan Yes I tried setting clipsToBound = true for content view and as you said, collection view does not show up but the rest of content does, why is it so? — Ibrahim Azhar Armar
I think your constraints are not correct -> contentsize height of UIScollView 's not enough to show collectionview. To detail — Nguyen Hoan

Ibrahim Azhar Armar Ibrahim Azhar Armar · Accepted Answer · 2018-09-27T06:35:52

Alright, the culprit was following code, constraint and everything was set correctly, but when I update the constant of height constraint in viewWillLayoutSubviews, although the constant value gets updated, collection view scrolling stops working. And here I was searching the issue in IB thinking it is a constraint issue.

override func viewWillLayoutSubviews() {
    super.viewWillLayoutSubviews()
    self.clinicSloganLabelHeightConstraint.constant = estimatedFrameFor(
        text: self.clinicSloganLabel.text!,
        font: self.clinicSloganLabel.font!,
        width: self.clinicSloganLabel.frame.width
    ).height
    self.clinicProfileTextViewHeightConstraint.constant = self.clinicProfileTextView.sizeThatFits(
        CGSize(width: self.clinicProfileTextView.frame.width, height: .infinity)
    ).height
    self.scrollView.contentSize.height = 2000.0
}

UICollectionView Does Not Scroll (Horizontal) Inside ScrollView

3 Answers